Adição de componentes a um canal

Componentes são os elementos fundamentais da experiência do AEM (Adobe Experience Manager). Você pode usar vários componentes e adicioná-los ao seu canal em um projeto do AEM Screens.

Componentes no AEM Screens

O AEM Screens fornece diferentes componentes do AEM que podem ser usados em um projeto do Screens.

Visualização de componentes do AEM Screens

Sempre que criar um projeto do AEM Screens, você verá uma lista de componentes padrão que podem ser adicionados ao projeto.

Para visualizar os componentes padrão no seu projeto do Screens, siga as etapas abaixo:

  1. Selecione o canal. Por exemplo, We.Retail In Store --> Canais --> Canal ocioso.

  2. Clique em Editar na barra de ações para abrir o editor do AEM.

  3. Clique no ícone + na barra lateral para abrir os componentes.

  4. Todos os componentes incluídos por padrão em um projeto do AEM Screens são exibidos, conforme mostrado na figura abaixo.

screen_shot_2017-12-18at21350pm

Adição de um novo componente

O AEM fornece vários outros componentes. Você sempre pode adicionar outros componentes (não incluídos por padrão) ao seu projeto, desde que eles sejam compatíveis com o AEM Screens.

O exemplo a seguir mostra a adição de um componente do Livefyre a um projeto do AEM Screens:

  1. Selecione o canal ao qual você deseja adicionar um novo componente. Por exemplo, We.Retail In Store --> Canais --> Canal ocioso.

  2. Clique em Editar na barra de ações para abrir o editor.

  3. Selecione o modo de Design.

  4. Selecione o editor de design inteiro à direita e clique no símbolo de configurações para abrir a caixa de diálogo ParSys (Design).

  5. Você pode selecionar os componentes que deseja importar para o projeto do AEM Screens. O exemplo a seguir mostra a adição do componente Livefyre a um projeto do AEM Screens.

adicionar_componentes

OBSERVAÇÃO

Da mesma forma, você pode adicionar ao seu projeto qualquer número de outros novos componentes compatíveis com o AEM Screens.

Noções básicas sobre os componentes do AEM Screens

A seção a seguir explica os componentes do AEM Screens que podem ser usados no projeto.

OBSERVAÇÃO

Para visualizar as propriedades de qualquer componente, selecione o componente e clique no ícone de martelo para abrir/visualizar propriedades.

Aplicativo

O componente Aplicativo permite adicionar um aplicativo ao seu canal.

O componente Aplicativo tem as seguintes propriedades:

Propriedade Descrição
Caminho do aplicativo Selecione o caminho absoluto no qual o aplicativo existe.
Duração (ms) Selecione a duração do aplicativo. Por padrão, a duração é definida como -1, o que significa que o elemento é executado para sempre (ou seja, aplicativo de página única). Definir o valor de duração como maior que 0 mostra o elemento pela duração especificada e, em seguida, avança para o próximo.

O exemplo a seguir mostra como incorporar um componente de aplicativo junto com a visualização de suas propriedades:

add_components_application

OBSERVAÇÃO

Consulte o exemplo acima para visualizar as propriedades de cada um dos componentes abaixo.

Canal

O componente Canal permite que você adicione um canal inteiro ao seu projeto.

O componente Canal tem as seguintes propriedades:

Propriedade Descrição
Caminho do canal Selecione o caminho absoluto no qual o aplicativo existe.
Duração (ms) Selecione toda a duração do canal. Definir a duração como -1 indica que o canal incorporado será executado até o final em um canal específico.

Página incorporada

Uma Página incorporada permite adicionar uma página incorporada ao seu projeto. Por exemplo, ela pode ser um aplicativo web ou um catálogo de produtos.

A Página incorporada tem as seguintes propriedades:

Propriedade Descrição
Caminho da página
Selecione o caminho absoluto onde o canal existe.
Duração (ms) Selecione toda a duração do canal. Definir a duração como -1 indica que o canal incorporado será executado até o final em um canal específico.

Sequência incorporada

OBSERVAÇÃO

Consulte Sequências incorporadas na seção Telas de criação para saber mais detalhes sobre sequências incorporadas.

Uma sequência incorporada permite adicionar um canal de sequência incorporada ao seu canal existente (com outros ativos).

A Sequência incorporada tem as seguintes propriedades de página:

Propriedade Descrição
Caminho do canal Selecione o caminho absoluto da sequência que você deseja incluir no seu canal.
Duração (ms) Selecione toda a duração do canal. Definir a duração como -1 indica que o canal incorporado será executado até o final em um canal específico.
Estratégia Defina como original ou único. Definir o valor como original significa que a subsequência será totalmente executada em cada ciclo da sequência pai. O outro valor possível é single e mostraria apenas um item da subsequência em cada execução (por exemplo, o primeiro item no primeiro loop, o segundo item no segundo loop e assim por diante).

Sequência incorporada dinâmica

Uma sequência incorporada dinâmica permite adicionar uma sequência semelhante à mencionada acima, exceto pela função do canal.

Consulte Sequências incorporadas na seção Telas de criação para saber mais detalhes sobre sequências incorporadas.

A sequência incorporada dinâmica tem as seguintes propriedades:

Propriedade Descrição
Função da atribuição do canal
Insira a função do canal.
Duração (ms) Selecione toda a duração do canal. Definir a duração como -1 indica que o canal incorporado será executado até o final em um canal específico.
Estratégia Defina como original ou único. Definir o valor como original significa que a subsequência será totalmente executada em cada ciclo da sequência pai. O outro valor possível é single e mostraria apenas um item da subsequência em cada execução (por exemplo, o primeiro item no primeiro loop, o segundo item no segundo loop e assim por diante).

Fragmento de experiência

Um Fragmento de experiência permite adicionar um fragmento de experiência (grupo de um ou mais componentes, incluindo o conteúdo e o layout que podem ser referenciados nas páginas) ao canal do AEM Screens. Arraste e solte o componente no editor de AEM e selecione o fragmento de experiência.

Para saber mais sobre como criar um fragmento de experiência e aproveitá-lo em um projeto do AEM Screens, consulte Uso de fragmentos de experiência.

exp

Propriedade Descrição
Fragmento de experiência
Fragmento de experiência Selecione o fragmento de experiência.
Duração Selecione a duração inteira do fragmento de experiência que é reproduzido no canal.
Configuração offline
Bibliotecas do lado do cliente Arquivos Javascript e CSS.
Arquivos estáticos Arquivos estáticos que você pode adicionar como configurações offline ao seu fragmento de experiência.
OBSERVAÇÃO

As Bibliotecas do lado do cliente e os Arquivos estáticos adicionados a partir deste componente serão adicionados às Bibliotecas do lado do cliente já configuradas e aos Arquivos estáticos adicionados a partir das Propriedades do fragmento de experiência.

Imagem

Um componente Imagem permite adicionar uma imagem ao seu canal.

O ativo de imagem possui três guias: Imagem, Acessibilidade e Sequência:

Propriedade Descrição
Imagem
Ativos da imagem Selecione o ativo da imagem.
Título Título da imagem.
Vincular ao Adicione um link à imagem.
Descrição Breve descrição da imagem.
Tamanho Tamanho da imagem.
Acessibilidade
Texto alternativo Texto alternativo para a imagem.
Sequência
Duração Por padrão, a duração é definida como 8000 ms. Se desejar alterar a duração da reprodução da imagem, atualize o campo Duration.

Transição

O componente Transição permite adicionar uma transição ao seu projeto do Screens.

A imagem a seguir mostra o componente de transição (adicionado por meio do arrastar e soltar) para o editor.

screen_shot_2019-07-25at104237am

Selecione o ícone de transição e clique em Configurar (ícone de chave) para abrir a caixa de diálogo Transição. Essa caixa de diálogo inclui três guias:

  • Transição
  • Sequência
  • Ativação
OBSERVAÇÃO

Por padrão, a sequência é definida como 600 ms. Você pode atualizar a sequência de transição para outro valor usando a guia Sequence.

transição

O componente de transição tem as seguintes propriedades:

Propriedade Descrição
Transição
Tipo

O tipo da transição entre o elemento antes e o depois. A transição Type inclui as seguintes opções:

  • Normal
  • Esmaecer
  • Deslizar da direita
  • Deslizar da esquerda
  • Deslizar do topo
  • Deslizar da parte inferior
Sequência
Duração Selecione a duração inteira da transição. Por padrão, é definido como 600 ms.
Ativação
Ativo de Carimbo de data e hora que descreve a partir de quando a transição pode estar ativa.
Ativa até Carimbo de data e hora que descreve até quando a transição pode estar ativa.
Programação Adicione um agendamento predefinido.

Vídeo

O componente Vídeo permite adicionar um vídeo ao seu projeto do Screens.

O componente Vídeo tem as seguintes propriedades:

Propriedade Descrição
Ativo de vídeo Selecione o link para o vídeo.
Duração Selecione a duração do vídeo. Por padrão, a duração é definida como -1, o que significa que o elemento é executado para sempre. Definir o valor de duração como maior que 0 mostra o elemento pela duração especificada e, em seguida, avança para o próximo.
Renderização

Se a taxa de proporção do vídeo não couber na tela, você poderá ajustar a renderização para contém ou capa.

Contém significa que o vídeo completo é exibido, e as áreas ausentes são preenchidas com uma borda preta.

Capa significa que o vídeo cobre toda a janela de exibição, mas algumas partes que transbordam nas laterais estão ocultas.

Tamanho Tamanho do vídeo.

Nesta página

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now