Progettare i componenti di una scheda o di una finestra di dialogo

In questa pagina viene descritto come progettare e creare i componenti principali dell'UI dei messaggi delle schede in Google Chat.

Le schede supportano un layout definito, elementi interattivi dell'interfaccia utente, come i pulsanti, e rich media come immagini. Puoi utilizzare le schede per presentare informazioni, raccogliere input o indicare i passaggi successivi agli utenti tramite messaggi a schede e finestre di dialogo.

Utilizza Card Builder per progettare e visualizzare l'anteprima di messaggi delle schede JSON per le app di chat:

Apri Card Builder

In genere le schede e le finestre di dialogo includono i seguenti componenti:

  • Un CardHeader che contiene il titolo della tua carta.
  • Uno o più widget CardSection che costituiscono il corpo principale della scheda.
  • Un widget CardFixedFooter specifico solo per le finestre di dialogo.

Prerequisiti

  • Un account Google Workspace con accesso a Google Chat.
  • Un'app di Chat pubblicata. Per creare un'app di Chat, segui questa quickstart.

    • Aggiungi un'intestazione

    Il widget CardHeader rappresenta l'intestazione di una scheda. Le intestazioni possono includere un titolo, un sottotitolo e un'immagine avatar per la tua scheda.

    Puoi includere CardHeader per i messaggi delle schede e le finestre di dialogo.

    Di seguito è riportato un esempio di CardHeader:

    Definisci una sezione di una scheda

    Il widget CardSection è un contenitore di alto livello all'interno di una scheda. Puoi usare le sezioni delle schede per raggruppare i widget all'interno di una scheda. Per ogni sezione della scheda puoi includere un'intestazione e uno o più widget.

    Puoi includere CardSection per i messaggi delle schede e le finestre di dialogo.

    Di seguito è riportato un esempio di CardSection che contiene due widget textParagraph:

    Il widget CardFixedFooter rappresenta il piè di pagina di un messaggio di una finestra di dialogo inviato da un'app di Chat. I piè di pagina possono includere un pulsante principale e un pulsante secondario.

    Il widget CardFixedFooter è disponibile solo per le finestre di dialogo.

    Di seguito è riportato un esempio di widget CardFixedFooter con due pulsanti:

    Risolvi il problema

    Quando un'app o una scheda Google Chat restituisce un errore, l'interfaccia di Chat mostra il messaggio "Si è verificato un problema". o "Impossibile elaborare la richiesta". A volte nella UI di Chat non viene visualizzato alcun messaggio di errore, ma l'app o la scheda Chat produce un risultato imprevisto. Ad esempio, il messaggio di una scheda potrebbe non essere visualizzato.

    Anche se un messaggio di errore potrebbe non essere visualizzato nell'interfaccia utente di Chat, sono disponibili messaggi di errore descrittivi e dati di log per aiutarti a correggere gli errori quando il logging degli errori per le app di Chat è attivato. Per informazioni su visualizzazione, debug e correzione degli errori, vedi Risolvere i problemi e correggere gli errori di Google Chat.