カードベースのインターフェース

アドオンカードの例

Google Workspace アドオンは情報とユーザーを表示 Google Chat の設定のサイドバーで ホスト アプリケーション UI です。アドオンはメインの識別ツールバーと 1 つ以上の カード。

各カードは特定の「ページ」を表しますUI が表示され、 新しいカードへの移動は、通常 カードの作成は簡単です 内部のカードスタックにプッシュします。 カード間のナビゲーション フローを定義して、充実したインタラクションを実現できます。

カードには非コンテキストとコンテキストがあります。コンテキスト カードが表示されます。 ユーザーに表示されます。たとえば Gmail のメールまたはカレンダーの予定を開いたときに表示されるようになりました。コンテキストに依存しないカード（ ホームページ）がユーザーに表示される 外部 IP アドレスを使用できます。たとえば、ユーザーが そのユーザーが自分の Gmail の受信トレイ、メインのドライブ フォルダ、カレンダーを表示しているとき。

Apps Script に組み込まれている Google Workspace アドオンは、 ユーザー インターフェースを作成するためのカードサービス カード。他の言語で組み込まれたアドオン インターフェースをカードとしてレンダリングするには、適切にフォーマットされた JSON を返す必要があります。

各カードは、ヘッダーと 1 つ以上のカード セクションで構成されます。各セクションは ウィジェットのセットで構成されています。ウィジェット ユーザーに情報を表示したり、ボタンなどのインタラクション コントロールを提供したりします。

カードベースのインターフェースには次の利点があります。

  • カードベースのインターフェースを作成するために HTML や CSS の知識は必要ありません。
  • カードとウィジェットは、 拡張する Google Workspace アプリケーションです。

  • カードベースのインターフェースはパソコンとモバイル デバイスの両方で動作しますが、 インターフェースを一度定義するだけで済みます。

カードベースのインターフェースの作成

カードベースのアドオンを作成する際は、 設計パターンについて説明します。次のガイドでは、 効果的なカードベースのアドオンを構築する必要があります。

カードを作成して実装する際に参照するページ UI の動作。次のサンプルは、 実装時の参考にしてください。