Migração para a interface de usuário de toque

A partir da versão 6.0, a Adobe Experience Manager (AEM) introduziu uma nova interface de usuário chamada interface de usuário habilitada para toque (também conhecida simplesmente como interface de usuário de toque). Ele está alinhado ao Adobe Marketing Cloud e às diretrizes gerais da interface do usuário do Adobe. Essa interface se tornou a interface padrão em AEM com a interface legada orientada para desktop, chamada interface clássica.

Se você tiver usado AEM com a interface clássica, precisará tomar medidas para migrar sua instância. Esta página tem como objetivo agir como trampolim, fornecendo links para recursos individuais.

OBSERVAÇÃO

Esse projeto de migração pode ter um impacto significativo em sua instância. Consulte Gerenciar projetos - Práticas recomendadas para obter as diretrizes recomendadas.

Noções básicas

Ao migrar, você deve estar ciente das seguintes (principais) diferenças entre a interface clássica e a interface de toque:

Interface do usuário clássica Interface do usuário habilitada para toque
É descrito no repositório JCR como uma estrutura de nós. Todos os nós que representam um elemento da interface de usuário são chamados de widget ExtJS e renderizados no lado do cliente por ExtJS. Também descrito no repositório JCR como uma estrutura de nós. No entanto, nesse caso, cada nó se refere a um tipo de recurso Sling (componente Sling), que é responsável pela renderização. Portanto, a interface do usuário é (basicamente) renderizada no servidor.

sling:resourceType

  • not used
 sling:resourceType
  • usado
  • por exemplo
    cq/gui/components/authoring/dialog

Nós de diálogo:

  • Nome: dialog
  • jcr:primaryType: cq:Dialog

Nós de diálogo:

  • Nome: cq:dialog
  • jcr:PrimaryType: nt:unstructured

Localização do Javascript:

  • As peças imperiativas são incorporadas diretamente usando ouvintes ou gerenciadas em clientlibs.

Localização do Javascript:

  • As partes imperativas não podem ser incorporadas na definição da caixa de diálogo; separação de responsabilidades.

Tratamento de eventos:

  • Os widgets de diálogo fazem referência diretamente ao código Javascript.

Tratamento de eventos:

  • O Javascript observa eventos de diálogo.
Renderização realizada pelo cliente:
  • O cliente cria dinamicamente os componentes da interface do usuário.
  • A definição do componente de solicitações do cliente (Pull) (como JSON) do servidor.
 Renderização realizada pelo servidor:
  • O cliente solicita páginas juntamente com a interface relacionada.
  • O servidor envia (envia) a interface do usuário como documentos HTML; usando componentes da interface do usuário do Coral.

Em outras palavras, a migração de uma seção da interface do usuário da interface clássica para a interface do usuário de toque significa portar um widget ExtJS para um componente Sling. Para facilitar isso, a interface de usuário de toque é baseada na estrutura da interface de usuário Granite, que já fornece alguns componentes Sling para a interface de usuário (conhecidos como componentes da interface de usuário Granite).

Antes do start, verifique o status e as recomendações relacionadas:

As noções básicas para desenvolver a interface de usuário de toque fornecerão uma base sólida:

Migração de criação de página

As caixas de diálogo são um fator importante ao migrar seus componentes:

Migração de consoles

Você também pode personalizar os consoles:

Embora não estejam diretamente relacionados a uma migração para a interface de usuário de toque, há problemas relacionados que vale a pena considerar ao mesmo tempo, já que eles também são a prática recomendada:

OBSERVAÇÃO

Outros recursos

Para obter informações completas sobre o desenvolvimento AEM consulte a coleta de recursos em:

CUIDADO

AEM As Ferramentas de Modernização são um esforço comunitário e não são suportadas nem garantidas pela Adobe.

Nesta página