Komponenten einer Karte oder eines Dialogfelds entwerfen

Auf dieser Seite wird beschrieben, wie Sie die Hauptkomponenten der Benutzeroberfläche von Kartennachrichten in Google Chat entwerfen und erstellen.

Karten unterstützen ein definiertes Layout, interaktive UI-Elemente wie Schaltflächen und Rich Media wie Bilder. Sie können Karten verwenden, um Informationen zu präsentieren, Input zu sammeln oder Nutzern über Kartennachrichten und Dialogfelder die nächsten Schritte mitzuteilen.

Mit dem Card Builder können Sie JSON-Kartennachrichten für Chat-Apps erstellen und als Vorschau ansehen:

Card Builder öffnen

Karten und Dialogfelder haben in der Regel die folgenden Komponenten:

  • Ein CardHeader, der den Titel deiner Karte enthält.
  • Ein oder mehrere CardSection-Widgets, die den Hauptteil der Karte bilden.
  • Ein CardFixedFooter-Widget nur für Dialogfelder spezifisch.

Voraussetzungen

  • Ein Google Workspace-Konto mit Zugriff auf Google Chat.
  • Eine veröffentlichte Chat-App. Informationen zum Erstellen einer Chat-App finden Sie in dieser quickstart.

    • Header hinzufügen

    Das CardHeader-Widget stellt die Kopfzeile einer Karte dar. Überschriften können einen Titel, eine Unterüberschrift und ein Avatarbild für Ihre Karte enthalten.

    Du kannst CardHeader für Kartennachrichten und Dialogfelder angeben.

    Hier ein Beispiel für ein CardHeader-Objekt:

    Bereich einer Karte definieren

    Das CardSection-Widget ist ein übergeordneter Container innerhalb einer Karte. Mithilfe von Kartenbereichen können Sie Widgets innerhalb einer Karte gruppieren. Für jeden Kartenabschnitt können Sie einen Header und ein oder mehrere Widgets einfügen.

    Du kannst CardSection für Kartennachrichten und Dialogfelder angeben.

    Das folgende Beispiel zeigt ein CardSection mit zwei textParagraph-Widgets:

    Das Widget CardFixedFooter steht für die Fußzeile einer von einer Chat-App gesendeten Dialogfeldnachricht. Fußzeilen können eine primäre und eine sekundäre Schaltfläche enthalten.

    Das CardFixedFooter-Widget ist nur für Dialogfelder verfügbar.

    Das folgende Beispiel zeigt ein CardFixedFooter-Widget mit zwei Schaltflächen:

    Fehlerbehebung

    Wenn eine Google Chat-App oder -Karte einen Fehler zurückgibt, wird in der Chat-Oberfläche die Meldung „Ein Fehler ist aufgetreten“ angezeigt. oder „Ihre Anfrage kann nicht verarbeitet werden.“ Manchmal wird in der Chat-UI keine Fehlermeldung angezeigt, aber die Chat-App oder -Karte liefert ein unerwartetes Ergebnis. So kann z. B. keine Kartenmeldung angezeigt werden.

    Obwohl eine Fehlermeldung möglicherweise nicht in der Chat-UI angezeigt wird, sind beschreibende Fehlermeldungen und Protokolldaten verfügbar, um Sie beim Beheben von Fehlern zu unterstützen, wenn das Fehler-Logging für Chat-Apps aktiviert ist. Informationen zum Ansehen, Debuggen und Beheben von Fehlern finden Sie unter Google Chat-Fehler beheben.