Criar os componentes de um cartão ou caixa de diálogo

Nesta página, descrevemos como projetar e criar os principais componentes de IU de mensagens de card no Google Chat.

Cards oferecem suporte a um layout definido, elementos de interface interativos, como botões, e rich media, como imagens. Você pode usar cards para apresentar informações, coletar entradas ou informar as próximas etapas aos usuários em mensagens de cards e caixas de diálogo.


Crie e visualize cards com o Criador de cards.

Abra o Criador de cards.

Cards e caixas de diálogo geralmente têm os seguintes componentes:

  • Uma CardHeader que contém o título do seu card.
  • Um ou mais widgets CardSection que formam o corpo principal do card.
  • Um widget CardFixedFooter específico apenas para caixas de diálogo.

Pré-requisitos

  • Uma conta do Google Workspace com acesso ao Google Chat.
  • Um app do Chat publicado. Para criar um app do Chat, siga este quickstart.
  • Adicionar um cabeçalho

    O widget CardHeader representa o cabeçalho de um card. Os cabeçalhos podem incluir um título, subtítulo e uma imagem de avatar para o cartão.

    Você pode incluir CardHeader para mensagens de cards e caixas de diálogo.

    Veja a seguir um exemplo de CardHeader:

    Definir uma seção de um card

    O widget CardSection é um contêiner de alto nível em um card. As seções de cards são usadas para agrupar widgets em um card. Para cada seção do cartão, é possível incluir um cabeçalho e um ou mais widgets.

    Você pode incluir CardSection para mensagens de cards e caixas de diálogo.

    Veja a seguir um exemplo de um CardSection que contém dois widgets textParagraph:

    O widget CardFixedFooter representa o rodapé de uma mensagem da caixa de diálogo enviada por um app do Chat. Os rodapés podem incluir um botão principal e um botão secundário.

    O widget CardFixedFooter está disponível apenas para caixas de diálogo.

    Veja a seguir um exemplo de widget CardFixedFooter com dois botões:

    Resolver problemas

    Quando um app ou card do Google Chat retorna um erro, a interface do Chat mostra a mensagem "Ocorreu um erro" ou "Não foi possível processar sua solicitação". Às vezes, a interface do Chat não mostra nenhuma mensagem de erro, mas o app ou card do Chat produz um resultado inesperado. Por exemplo, uma mensagem de card pode não aparecer.

    Embora uma mensagem de erro não apareça na interface do Chat, mensagens de erro descritivas e dados de registro estão disponíveis para ajudar a corrigir erros quando o registro de erros dos apps do Chat está ativado. Se precisar de ajuda para visualizar, depurar e corrigir erros, consulte Resolver problemas e corrigir erros do Google Chat.