設計資訊卡或對話方塊的元件

本頁說明如何設計及建立資訊卡的主要 UI 元件 Google Chat 中的訊息。

資訊卡支援已定義的版面配置 互動 UI 元素，例如按鈕 就像圖片這種互動式多媒體一樣你可以使用資訊卡呈現資訊、收集輸入內容 或向使用者提供後續步驟 資訊卡訊息和 「對話方塊」。

您可以使用 Card Builder 設計及預覽即時通訊應用程式的 JSON 資訊卡訊息：

開啟資訊卡建立工具

資訊卡和對話方塊通常具有以下元件：

  • 包含卡片標題的 CardHeader。
  • 一或多個構成資訊卡主體的 CardSection 小工具。
  • 僅適用於對話方塊專用的 CardFixedFooter 小工具。

必要條件

  • Google Workspace 帳戶 有權存取 Google Chat。
  • 已發布的 Chat 應用程式。如要建立 即時通訊應用程式，請追蹤這個 快速入門導覽課程，

    • 新增標頭

    CardHeader 小工具 資訊卡的標頭標題可以包含 資訊卡的標題、副標題和顯示圖片。

    您可以在以下位置加入 CardHeader： 資訊卡訊息和 對話方塊。

    以下是 CardHeader 的範例：

    定義資訊卡的部分內容

    CardSection 小工具是 例如資訊卡的高階容器您使用的是卡片 即可將卡片內的小工具分組。在每個資訊卡部分，您可以加入 標頭和一或多個小工具

    您可以在以下位置加入 CardSection： 資訊卡訊息和 對話方塊。

    以下 CardSection 範例包含兩個 textParagraph 小工具：

    CardFixedFooter 小工具 可代表對話方塊訊息的頁尾， Chat 應用程式。 註腳可以包含主要按鈕和次要按鈕。

    CardFixedFooter 小工具僅適用於 「對話方塊」。

    以下是含有兩個按鈕的 CardFixedFooter 小工具範例：

    疑難排解

    Google Chat 應用程式或 card 會傳回錯誤， 即時通訊介面會顯示「發生錯誤」的訊息。 或「無法處理你的要求」。有時使用 Chat UI 不會顯示任何錯誤訊息，但 Chat 應用程式或 資訊卡產生非預期的結果例如資訊卡訊息 顯示。

    雖然 Chat UI 中可能不會顯示錯誤訊息， 提供描述性錯誤訊息和記錄資料，協助您修正錯誤 。如需觀看說明， 偵錯及修正錯誤，請參閱 疑難排解並修正 Google Chat 錯誤。