Criar popovers no Construtor de IU

Use popovers em uma página do Construtor de IU para sobrepor informações contextuais ou funcionalidades para ajudar os usuários a concluir tarefas.

Um popover é uma pequena janela ou caixa de diálogo que aparece acima de uma página Construtor de IU e contém informações adicionais, opções ou ações relacionadas ao conteúdo ou à tarefa em questão. Adicione componentes a um popover da mesma forma que você adiciona modais a uma página.

Você pode colocar popovers em qualquer lugar em uma página Construtor de IU onde achar que as informações adicionais ajudam os usuários. Os popovers têm como objetivo fornecer pequenas informações ou links para conteúdo relacionado, portanto, você deve limitar a quantidade de informações ou funcionalidade em um popover porque o popover só é exibido quando um usuário está interagindo com ele.

Você pode tornar os popovers visíveis ou ocultos com o mapeamento de eventos, como acionar um popover para aparecer ao selecionar um botão ou apontar para uma parte da página. Para obter mais informações, consulte Definir eventos de mapa.

Figura 1. Popover informativo

Adicionar popover a uma página Construtor de IU

Saiba como adicionar um popover em Construtor de IU. Um popover é um contêiner que aparece acima de uma página quando você clica em um componente. Por exemplo, um popover pode exibir informações de contato ao selecionar o nome de uma pessoa em uma lista.

Antes de Iniciar

Função necessária: administrador

Procedimento

1. Navegar até Tudo > Estrutura do Now Experience > Construtor de IU.
2. Abra uma experiência para trabalhar ou crie uma experiência selecionando Criar > Experiência.
   Consulte Configure como os usuários interagem com suas aplicações no Construtor de IU para obter mais informações sobre como criar experiências.
3. Abra ou crie uma variante de página.
   Para obter mais informações sobre como criar uma página em Construtor de IU, consulte Criação de uma página no Construtor de IU.
4. Adicione um componente à página que você deseja que acione um popover, como um componente de botão.
   Para obter mais informações, consulte Adicionar e configurar componentes.
5. Selecione a guia Eventos no painel de configuração.
6. Selecione + Adicionar manipulador de eventos.
   
7. Selecione Abrir popover.
8. Selecione Criar um novo popover.
   
9. Selecione Adicionar.
   O popover aparece acima da fase.
10. Adicione componentes ao popover selecionando o ícone +.
    
11. Quando terminar de configurar o popover, feche-o.

    Observe na árvore de conteúdo que os popovers criados ficam acima do corpo da estrutura da página.

    
12. Clique em Salvar.
13. Selecione Visualizar no cabeçalho Construtor de IU.
14. Clique no botão para testar o popover.