Migração para a interface de toque

Última atualização em 2023-10-25
  • Tópicos
  • Developing
    Exibir mais informações sobre este tópico
  • Criado para:
  • Developer

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

Se você tem usado o AEM com a interface clássica, execute uma ação para migrar sua instância. Esta página serve como um trampolim, fornecendo links para recursos individuais.

OBSERVAÇÃO

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

Noções básicas

Ao migrar, esteja ciente das principais diferenças a seguir entre a interface clássica e a interface para toque:

IU Clássica Interface de usuário habilitada para toque
É descrito no repositório JCR como uma estrutura de nós. Cada nó que representa um elemento da interface do usuário é chamado de um Widget ExtJS e renderizado 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), responsável pela renderização. Portanto, a interface do usuário é (basicamente) renderizada no lado do servidor.

sling:resourceType

  • não usado
 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 imperativas são incorporadas diretamente usando ouvintes ou gerenciadas em clientlibs.

Localização do JavaScript:

  • Partes imperativas não podem ser incorporadas na definição do diálogo; separação de responsabilidades.

Manipulação de eventos:

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

Manipulação de eventos:

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

Em outras palavras, migrar 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 do Sling. Para facilitar isso, a interface de toque é baseada na estrutura da interface de usuário do Granite, que já fornece alguns componentes do Sling para a interface de usuário (conhecidos como componentes da interface de usuário do Granite).

Antes de começar, verifique o status e as recomendações relacionadas:

As noções básicas para o desenvolvimento da interface para toque fornecem uma base sólida:

Migração da 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 esteja diretamente relacionado a uma migração para a interface de toque, há problemas relacionados que merecem ser considerados ao mesmo tempo, pois também são uma prática recomendada:

OBSERVAÇÃO

Recursos adicionais

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

ATENÇÃO

As Ferramentas de Modernização do AEM são um esforço da comunidade e não são suportadas ou garantidas pelo Adobe.

Página anterior
Next page

Nesta página