Migração para a interface de toque

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

Se você tem usado AEM com a interface clássica, será necessário tomar medidas para migrar sua instância. Esta página destina-se a atuar como um trampolim, fornecendo links para recursos individuais.

OBSERVAÇÃO

Esse projeto de migração pode ter um impacto significativo na sua instância. Consulte Gerenciamento de 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. Cada nó que representa um elemento da interface do usuário é chamado de 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), que é encarregado de sua 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 partes imperativas são diretamente incorporadas 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 feita pelo cliente:
  • O cliente cria dinamicamente os componentes da interface do usuário.
  • Definição de componente Solicitações de cliente (Pull) (como JSON) do servidor.
 Renderização feita pelo servidor:
  • O cliente solicita páginas junto com a interface relacionada.
  • O servidor envia (envia) a interface do usuário como documentos HTML; usando componentes de Coral UI.

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

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

As noções básicas para desenvolver a interface do 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:

Migrando Consoles

Você também pode personalizar os consoles:

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

OBSERVAÇÃO

Recursos adicionais

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

ATENÇÃO

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

Nesta página