Crie popovers em Construtor de IU

  • Versão de lançamento: Zurich
  • Atualizado 31 de jul. de 2025
  • 2 min. de leitura
  • 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 A. Construtor de IUe contém informações, opções ou ações adicionais 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 um Construtor de IUpágina em que você acha que informações adicionais ajudam os usuários. Popovers destinam-se a fornecer pequenas informações ou links para conteúdo relacionado, portanto, você deve limitar a quantidade de informações ou funcionalidades em um popover porque o popover só é exibido quando um usuário está interagindo com ele.

    Você pode tornar 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
    Página com o link de texto de dica de ferramenta que foi selecionado para mostrar um popover de informações adicionais.

    Adicione popover a Construtor de IUpágina

    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 > 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 IUpara 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 no Construtor de IU, consulte Crie uma página no Construtor de IU .
    4. Adicione um componente à sua página para acionar um popover, como um componente de botão.
      Para obter mais informações, consulte Adicionar e configurar componentes.
    5. Selecione Eventos no painel de configuração.
    6. Selecione - Adicionar manipulador de eventos .
      Seta que aponta para o link do manipulador de eventos de adição do componente de botão.
    7. Selecione Abrir popover .
    8. Selecione Crie um novo popover .
      Seta que aponta para a opção Criar um novo popover.
    9. Selecione Adicionar.
      O popover aparece acima da fase.
    10. Para adicionar componentes ao popover, selecione E ícone.
      Seta que aponta para mais para adicionar conteúdo.
    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.

      Seta que aponta para o popover personalizado na árvore de conteúdo.
    12. Clique em Salvar.
    13. Selecione Visualização em Construtor de IUcabeçalho.
    14. Clique no botão para testar o popover.