Cards v2

カード

Google Chat メッセージまたは Google Workspace アドオンに表示されるカード インターフェース。

カードは、定義済みのレイアウト、ボタンなどのインタラクティブな UI 要素、画像などのリッチメディアをサポートしています。カードを使用して詳細情報を表示し、ユーザーから情報を収集し、ユーザーを次のステップに導く。

カードビルダーでカードをデザインしてプレビューする。

カードビルダーを開く

カードを作成する方法については、次のドキュメントをご覧ください。

例: Google Chat アプリのカード メッセージ

連絡先カードの例

Google Chat でカード メッセージのサンプルを作成するには、次の JSON を使用します。

{
  "cardsV2": [
    {
      "cardId": "unique-card-id",
      "card": {
        "header": {
           "title": "Sasha",
           "subtitle": "Software Engineer",
           "imageUrl":
           "https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png",
           "imageType": "CIRCLE",
           "imageAltText": "Avatar for Sasha"
         },
         "sections": [
           {
             "header": "Contact Info",
             "collapsible": true,
             "uncollapsibleWidgetsCount": 1,
             "widgets": [
               {
                 "decoratedText": {
                   "startIcon": {
                     "knownIcon": "EMAIL"
                   },
                   "text": "sasha@example.com"
                 }
               },
               {
                 "decoratedText": {
                   "startIcon": {
                     "knownIcon": "PERSON"
                   },
                   "text": "<font color=\"#80e27e\">Online</font>"
                 }
               },
               {
                 "decoratedText": {
                   "startIcon": {
                     "knownIcon": "PHONE"
                   },
                   "text": "+1 (555) 555-1234"
                 }
               },
               {
                 "buttonList": {
                   "buttons": [
                     {
                       "text": "Share",
                       "onClick": {
                        "openLink": {
                           "url": "https://example.com/share"
                         }
                       }
                     },
                     {
                       "text": "Edit",
                       "onClick": {
                         "action": {
                           "function": "goToView",
                           "parameters": [
                             {
                               "key": "viewType",
                               "value": "EDIT"
                             }
                           ]
                         }
                       }
                     }
                   ]
                 }
               }
             ]
           }
         ]
       }
    }
  ]
}
JSON 表現
{
  "header": {
    object (CardHeader)
  },
  "sections": [
    {
      object (Section)
    }
  ],
  "sectionDividerStyle": enum (DividerStyle),
  "cardActions": [
    {
      object (CardAction)
    }
  ],
  "name": string,
  "fixedFooter": {
    object (CardFixedFooter)
  },
  "displayStyle": enum (DisplayStyle),
  "peekCardHeader": {
    object (CardHeader)
  }
}
フィールド
header

object (CardHeader)

カードのヘッダー。通常、ヘッダーには先頭の画像とタイトルが含まれます。ヘッダーは常にカードの上部に表示されます。

sections[]

object (Section)

ウィジェットのコレクションが含まれています。各セクションには独自のオプションのヘッダーがあります。セクションは線の区切りで視覚的に区切られます。Google Chat アプリの例については、 カードのセクションを定義する

sectionDividerStyle

enum (DividerStyle)

セクション間の分割線のスタイル。

cardActions[]

object (CardAction)

カードの操作。アクションはカードのツールバー メニューに追加されます。

Google Workspace アドオンでは利用でき、Google Chat アプリでは利用できません。

たとえば、次の JSON は、カード アクション メニューを Settings および Send Feedback オプション:

"cardActions": [
  {
    "actionLabel": "Settings",
    "onClick": {
      "action": {
        "functionName": "goToView",
        "parameters": [
          {
            "key": "viewType",
            "value": "SETTING"
         }
        ],
        "loadIndicator": "LoadIndicator.SPINNER"
      }
    }
  },
  {
    "actionLabel": "Send Feedback",
    "onClick": {
      "openLink": {
        "url": "https://example.com/feedback"
      }
    }
  }
]
name

string

カードの名前。カード ナビゲーションでカード ID として使用されます。

Google Workspace アドオンでは利用でき、Google Chat アプリでは利用できません。

displayStyle

enum (DisplayStyle)

Google Workspace アドオンで、 peekCardHeader

Google Workspace アドオンでは利用でき、Google Chat アプリでは利用できません。

peekCardHeader

object (CardHeader)

コンテキスト コンテンツを表示する場合、ピークカードのヘッダーはプレースホルダとして機能するため、ユーザーはホームページ カードとコンテキスト カードの間を行き来できます。

Google Workspace アドオンでは利用でき、Google Chat アプリでは利用できません。

CardHeader

カードヘッダーを表します。Google Chat アプリの例については、 ヘッダーを追加します

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "title": string,
  "subtitle": string,
  "imageType": enum (ImageType),
  "imageUrl": string,
  "imageAltText": string
}
フィールド
title

string

必須。カードヘッダーのタイトル。ヘッダーの高さは固定されています。タイトルとサブタイトルの両方を指定すると、それぞれが 1 行になります。タイトルのみを指定する場合は、2 行に記述します。

subtitle

string

カードヘッダーのサブタイトル。指定した場合、 title

imageType

enum (ImageType)

画像の切り抜きに使用するシェイプ。

Google Chat アプリと Google Workspace アドオンで利用できます。

imageUrl

string

カード ヘッダーの画像の HTTPS URL。

imageAltText

string

ユーザー補助に使用されるこの画像の代替テキスト。

ImageType

画像の切り抜きに使用される図形。

Google Chat アプリと Google Workspace アドオンで利用できます。

列挙型
SQUARE デフォルト値。画像に正方形のマスクを適用します。たとえば、4x3 の画像は 3x3 になります。
CIRCLE 画像に円形マスクを適用します。たとえば、4x3 の画像は、直径が 3 の円になります。

セクション

セクションには、指定された順序で垂直にレンダリングされるウィジェットのコレクションが含まれます。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "header": string,
  "widgets": [
    {
      object (Widget)
    }
  ],
  "collapsible": boolean,
  "uncollapsibleWidgetsCount": integer,
  "collapseControl": {
    object (CollapseControl)
  }
}
フィールド
header

string

セクションの上部に表示されるテキスト。シンプルな HTML 形式のテキストをサポートします。テキストの書式設定の詳細については、Google Chat アプリでのテキストの書式設定Google Workspace アドオンでのテキストの書式設定をご覧ください。

widgets[]

object (Widget)

セクション内のすべてのウィジェット。ウィジェットを少なくとも 1 つ含める必要があります。

collapsible

boolean

このセクションが折りたたみ可能かどうかを示します。

折りたたみ可能なセクションでは一部またはすべてのウィジェットが非表示になりますが、 もっと見るウィジェットを非表示にするには、 一部表示

非表示のウィジェットを特定するには、次のように指定します。 uncollapsibleWidgetsCount

uncollapsibleWidgetsCount

integer

セクションを折りたたんだ状態でも表示されたままになる、折りたたみできないウィジェットの数です。

たとえば、セクションに 5 つのウィジェットがあり、 uncollapsibleWidgetsCount の設定 2 の場合、最初の 2 つのウィジェットは常に表示され、残りの 3 つのウィジェットはデフォルトでは折りたたまれています。「 uncollapsibleWidgetsCount 考慮されるのは collapsible true

collapseControl

object (CollapseControl)

省略可。セクションの展開ボタンと折りたたみボタンを定義します。このボタンは、セクションが折りたたみ可能な場合にのみ表示されます。このフィールドが設定されていない場合は、デフォルトのボタンが使用されます。 Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

ウィジェット

各カードはウィジェットで構成されています。

ウィジェットは、テキスト、画像、ボタン、その他のオブジェクト タイプのいずれかを表すことができる複合オブジェクトです。

JSON 表現
{
  "horizontalAlignment": enum (HorizontalAlignment),

  // Union field data can be only one of the following:
  "textParagraph": {
    object (TextParagraph)
  },
  "image": {
    object (Image)
  },
  "decoratedText": {
    object (DecoratedText)
  },
  "buttonList": {
    object (ButtonList)
  },
  "textInput": {
    object (TextInput)
  },
  "selectionInput": {
    object (SelectionInput)
  },
  "dateTimePicker": {
    object (DateTimePicker)
  },
  "divider": {
    object (Divider)
  },
  "grid": {
    object (Grid)
  },
  "columns": {
    object (Columns)
  },
  "chipList": {
    object (ChipList)
  }
  // End of list of possible types for union field data.
}
フィールド
horizontalAlignment

enum (HorizontalAlignment)

ウィジェットを列の左、右、中央のいずれに配置するかを指定します。

共用体フィールド data。ウィジェットには、以下のアイテムのうち 1 つのみを含めることができます。複数のウィジェット フィールドを使用して、さらにアイテムを表示できます。 data は次のいずれか 1 つのみを指定できます。
textParagraph

object (TextParagraph)

テキスト パラグラフを表示します。シンプルな HTML 形式のテキストをサポートします。テキストの書式設定について詳しくは、このモジュールの Google Chat アプリでのテキストの書式設定 および Google Workspace アドオンでのテキストの書式設定

たとえば、次の JSON は太字のテキストを作成します。

"textParagraph": {
  "text": "  <b>bold text</b>"
}
image

object (Image)

画像を表示します。

たとえば、次の JSON は代替テキストを含む画像を作成します。

"image": {
  "imageUrl":
  "https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png",
  "altText": "Chat app avatar"
}
decoratedText

object (DecoratedText)

装飾されたテキスト アイテムを表示します。

たとえば、次の JSON はメールアドレスを表示する装飾テキスト ウィジェットを作成します。

"decoratedText": {
  "icon": {
    "knownIcon": "EMAIL"
  },
  "topLabel": "Email Address",
  "text": "sasha@example.com",
  "bottomLabel": "This is a new Email address!",
  "switchControl": {
    "name": "has_send_welcome_email_to_sasha",
    "selected": false,
    "controlType": "CHECKBOX"
  }
}
buttonList

object (ButtonList)

ボタンのリスト。

たとえば、次の JSON は 2 つのボタンを作成します。1 つ目は青色のテキストボタン、2 つ目はリンクを開く画像ボタンです。

"buttonList": {
  "buttons": [
    {
      "text": "Edit",
      "color": {
        "red": 0,
        "green": 0,
        "blue": 1,
      },
      "disabled": true,
    },
    {
      "icon": {
        "knownIcon": "INVITE",
        "altText": "check calendar"
      },
      "onClick": {
        "openLink": {
          "url": "https://example.com/calendar"
        }
      }
    }
  ]
}
textInput

object (TextInput)

ユーザーが入力できるテキスト ボックスを表示します。

たとえば、次の JSON はメールアドレスのテキスト入力を作成します。

"textInput": {
  "name": "mailing_address",
  "label": "Mailing Address"
}

別の例として、次の JSON は静的な候補を使用してプログラミング言語のテキスト入力を作成します。

"textInput": {
  "name": "preferred_programing_language",
  "label": "Preferred Language",
  "initialSuggestions": {
    "items": [
      {
        "text": "C++"
      },
      {
        "text": "Java"
      },
      {
        "text": "JavaScript"
      },
      {
        "text": "Python"
      }
    ]
  }
}
selectionInput

object (SelectionInput)

ユーザーがアイテムを選択できる選択コントロールを表示します。選択コントロールには、チェックボックス、ラジオボタン、スイッチ、プルダウン メニューなどがあります。

たとえば、次の JSON は、ユーザーがサイズを選択できるプルダウン メニューを作成します。

"selectionInput": {
  "name": "size",
  "label": "Size"
  "type": "DROPDOWN",
  "items": [
    {
      "text": "S",
      "value": "small",
      "selected": false
    },
    {
      "text": "M",
      "value": "medium",
      "selected": true
    },
    {
      "text": "L",
      "value": "large",
      "selected": false
    },
    {
      "text": "XL",
      "value": "extra_large",
      "selected": false
    }
  ]
}
dateTimePicker

object (DateTimePicker)

ユーザーが日付、時刻、または日時を入力できるウィジェットを表示します。

たとえば、次の JSON は、予約をスケジュールする日時選択ツールを作成します。

"dateTimePicker": {
  "name": "appointment_time",
  "label": "Book your appointment at:",
  "type": "DATE_AND_TIME",
  "valueMsEpoch": "796435200000"
}
divider

object (Divider)

ウィジェット間に水平の線分割を表示します。

たとえば、次の JSON は分割線を作成します。

"divider": {
}
grid

object (Grid)

アイテムのコレクションを含むグリッドを表示します。

グリッドは、任意の数の列とアイテムをサポートします。行数は、アイテム数の上限を列数で割った値によって決まります。10 個のアイテムと 2 列のグリッドが 5 行あります。11 個のアイテムと 2 列のグリッドは 6 行あります。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

たとえば、次の JSON は、1 つのアイテムを含む 2 列のグリッドを作成します。

"grid": {
  "title": "A fine collection of items",
  "columnCount": 2,
  "borderStyle": {
    "type": "STROKE",
    "cornerRadius": 4
  },
  "items": [
    {
      "image": {
        "imageUri": "https://www.example.com/image.png",
        "cropStyle": {
          "type": "SQUARE"
        },
        "borderStyle": {
          "type": "STROKE"
        }
      },
      "title": "An item",
      "textAlignment": "CENTER"
    }
  ],
  "onClick": {
    "openLink": {
      "url": "https://www.example.com"
    }
  }
}
columns

object (Columns)

最大 2 列を表示します。

3 つ以上の列を含める、または行を使用する場合は、 Grid 追加します。

たとえば、次の JSON は、それぞれテキスト段落を含む 2 つの列を作成します。

"columns": {
  "columnItems": [
    {
      "horizontalSizeStyle": "FILL_AVAILABLE_SPACE",
      "horizontalAlignment": "CENTER",
      "verticalAlignment": "CENTER",
      "widgets": [
        {
          "textParagraph": {
            "text": "First column text paragraph"
          }
        }
      ]
    },
    {
      "horizontalSizeStyle": "FILL_AVAILABLE_SPACE",
      "horizontalAlignment": "CENTER",
      "verticalAlignment": "CENTER",
      "widgets": [
        {
          "textParagraph": {
            "text": "Second column text paragraph"
          }
        }
      ]
    }
  ]
}
chipList

object (ChipList)

チップのリスト。

たとえば、次の JSON は 2 つのチップを作成します。1 つ目はテキストチップ、2 つ目はリンクを開くアイコンチップです。

"chipList": {
  "chips": [
    {
      "text": "Edit",
      "disabled": true,
    },
    {
      "icon": {
        "knownIcon": "INVITE",
        "altText": "check calendar"
      },
      "onClick": {
        "openLink": {
          "url": "https://example.com/calendar"
        }
      }
    }
  ]
}

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

TextParagraph

書式設定に対応するテキストの段落。Google Chat アプリの例については、 書式付きテキストの段落を追加します。テキストの書式設定の詳細については、Google Chat アプリでのテキストの書式設定Google Workspace アドオンでのテキストの書式設定をご覧ください。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "text": string,
  "maxLines": integer
}
フィールド
text

string

ウィジェットに表示されるテキストです。

maxLines

integer

ウィジェットに表示されるテキストの最大行数。テキストが指定された最大行数を超えると、余分なコンテンツは もっと見る ] ボタンを離します。テキストが指定された最大行数以下の場合は、 もっと見る ボタンは表示されません。

デフォルト値は 0 で、この場合、すべてのコンテキストが表示されます。負の値は無視されます。 Google Chat アプリで利用可能で、Google Workspace アドオンでは利用できません。

画像

URL で指定される画像。 onClick できます。例については以下をご覧ください。 画像を追加します

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "imageUrl": string,
  "onClick": {
    object (OnClick)
  },
  "altText": string
}
フィールド
imageUrl

string

イメージをホストする HTTPS URL。

次に例を示します。

https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png
onClick

object (OnClick)

ユーザーが画像をクリックすると、この操作がトリガーされます。

altText

string

ユーザー補助に使用されるこの画像の代替テキスト。

OnClick

カード上のインタラクティブな要素(ボタンなど)がクリックされたときの応答方法を表します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{

  // Union field data can be only one of the following:
  "action": {
    object (Action)
  },
  "openLink": {
    object (OpenLink)
  },
  "openDynamicLinkAction": {
    object (Action)
  },
  "card": {
    object (Card)
  },
  "overflowMenu": {
    object (OverflowMenu)
  }
  // End of list of possible types for union field data.
}
フィールド

共用体フィールド data

data は次のいずれか 1 つのみを指定できます。

action

object (Action)

指定すると、この onClick によってアクションがトリガーされます。

card

object (Card)

指定されている場合、クリックすると新しいカードがカードスタックにプッシュされます。

Google Workspace アドオンでは利用でき、Google Chat アプリでは利用できません。

overflowMenu

object (OverflowMenu)

指定すると、この onClick でオーバーフロー メニューが開きます。 Google Chat アプリで利用可能で、Google Workspace アドオンでは利用できません。

アクション

フォームを送信したときの動作を説明するアクション。たとえば、Apps Script スクリプトを呼び出してフォームを処理できます。アクションがトリガーされると、フォームの値がサーバーに送信されます。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "function": string,
  "parameters": [
    {
      object (ActionParameter)
    }
  ],
  "loadIndicator": enum (LoadIndicator),
  "persistValues": boolean,
  "interaction": enum (Interaction),
  "requiredWidgets": [
    string
  ],
  "allWidgetsAreRequired": boolean
}
フィールド
function

string

要素を含む要素がクリックされるかアクティブ化されたときに呼び出されるカスタム関数。

使用例については、以下をご覧ください。 フォームデータを読み取る

parameters[]

object (ActionParameter)

アクション パラメータのリスト。

loadIndicator

enum (LoadIndicator)

アクションの呼び出し中に表示される読み込みインジケーターを指定します。

persistValues

boolean

アクション後にフォームの値を保持するかどうかを示します。デフォルト値は false

条件 true の場合、アクションがトリガーされた後もフォームの値は保持されます。アクションの処理中にユーザーが変更できるようにするには、 LoadIndicator から NONE。対象 カード メッセージ 設定するには、アクションの設定も ResponseType から UPDATE_MESSAGE 同じものを使用します。 cardId そのアクションを含むカードから選択します。

条件 false の場合、アクションがトリガーされるとフォームの値がクリアされます。アクションの処理中にユーザーが変更できないようにするには、 LoadIndicator から SPINNER

interaction

enum (Interaction)

省略可。ダイアログを開く場合に必須です。

ユーザーとのやり取り(カード メッセージのボタンのクリックなど)に対する応答内容。

指定しない場合、アプリは action (リンクを開く、関数を実行するなど)を通常どおりに行うことができます。

Pod の interaction: アプリは特別なインタラクティブな方法で応答できます。たとえば、 interaction から OPEN_DIALOG の場合、アプリは ダイアログで表示できます。指定すると、読み込みインジケーターは表示されません。アドオンに対して指定すると、カード全体が削除され、クライアントには何も表示されません。

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

requiredWidgets[]

string

で確認できます。 省略可。このアクションが有効な送信に必要とするウィジェットの名前をこのリストに入力します。

このアクションが呼び出されたときにここにリストされているウィジェットに値がない場合、フォームの送信は中止されます。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

allWidgetsAreRequired

boolean

で確認できます。 省略可。true の場合、このアクションではすべてのウィジェットが必須と見なされます。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

ActionParameter

アクション メソッドが呼び出されるときに指定する文字列パラメータのリスト。例えば、「今すぐスヌーズ」、「1 日スヌーズ」、「来週スヌーズ」の 3 つのスヌーズボタンを考えてみましょう。用途 action method = snooze(): スヌーズの種類とスヌーズ時間を文字列パラメータのリストに渡します。

詳しくは、 CommonEventObject

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "key": string,
  "value": string
}
フィールド
key

string

アクション スクリプトのパラメータの名前。

value

string

パラメータの値。

LoadIndicator

アクションの呼び出し中に表示される読み込みインジケーターを指定します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

列挙型
SPINNER コンテンツの読み込みを示すスピナーを表示します。
NONE 何も表示されていません。

操作

省略可。ファイルを開く際に必須 ダイアログ

ユーザーとのやり取り(カード メッセージのボタンのクリックなど)に対する応答内容。

指定しない場合、アプリは action (リンクを開く、関数を実行するなど)を通常どおりに行うことができます。

interaction を指定すると、アプリは特別なインタラクティブな方法で応答できます。たとえば、 interaction から OPEN_DIALOG の場合、アプリは ダイアログで表示できます。

指定すると、読み込みインジケーターは表示されません。アドオンに指定した場合、カード全体が削除され、クライアントには何も表示されなくなります。

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

列挙型
INTERACTION_UNSPECIFIED デフォルト値。「 action 通常どおり実行されます
OPEN_DIALOG

アプリを開く ダイアログ: Chat アプリがユーザーとやり取りするために使用する、ウィンドウ形式のカードベースのインターフェースです。

カード メッセージのボタンクリックに対するレスポンスとして、Chat アプリでのみサポートされます。アドオンに対して指定すると、カード全体が削除され、クライアントには何も表示されません。

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

OpenAs

特定の OnClick アクションでリンクが開くと、クライアントはそのリンクをフルサイズ ウィンドウ(クライアントが使用するフレームの場合)またはオーバーレイ(ポップアップなど)として開くことができます。実装はクライアント プラットフォームの機能に依存し、クライアントがサポートしていない場合、選択した値は無視されることがあります。FULL_SIZE すべてのクライアントでサポートされています。

Google Workspace アドオンでは利用でき、Google Chat アプリでは利用できません。

列挙型
FULL_SIZE リンクはフルサイズのウィンドウで開きます(クライアントがそのフレームを使用している場合)。
OVERLAY リンクがポップアップなどのオーバーレイとして開きます。

OnClose

リンクが開いたときのクライアントの動作 OnClick アクションが終了します。

実装はクライアントのプラットフォーム機能によって異なります。たとえば、ウェブブラウザは OnClose ハンドラを使用してポップアップ ウィンドウでリンクを開く場合があります。

両方が OnOpen および OnClose 設定されていて、クライアント プラットフォームで両方の値をサポートできない場合、 OnClose が優先されます。

Google Workspace アドオンでは利用でき、Google Chat アプリでは利用できません。

列挙型
NOTHING デフォルト値。カードが再読み込みされない何も起こりません。
RELOAD

子ウィンドウが閉じた後に、カードを再読み込みする。

以下と組み合わせて使用する場合: OpenAs.OVERLAY の場合、子ウィンドウはモーダル ダイアログとして機能し、子ウィンドウを閉じるまで親カードはブロックされます。

OverflowMenu

ユーザーが呼び出すことができる 1 つ以上のアクションを含むポップアップ メニューを表示するウィジェット。たとえば、カードにメイン以外のアクションを表示するなどです。このウィジェットは、利用可能なスペースにアクションが収まらない場合に使用します。使用するには、これをサポートするウィジェットの OnClick アクションでこのウィジェットを指定します。たとえば、 Button

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

JSON 表現
{
  "items": [
    {
      object (OverflowMenuItem)
    }
  ]
}
フィールド
items[]

object (OverflowMenuItem)

必須。メニュー オプションのリスト。

OverflowMenuItem

で確認できます。 ユーザーがオーバーフロー メニューで呼び出すことができるオプション。

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

JSON 表現
{
  "startIcon": {
    object (Icon)
  },
  "text": string,
  "onClick": {
    object (OnClick)
  },
  "disabled": boolean
}
フィールド
startIcon

object (Icon)

テキストの前に表示されるアイコン。

text

string

必須。ユーザーが商品アイテムを識別または説明するテキスト。

onClick

object (OnClick)

必須。メニュー オプションが選択されたときに呼び出されるアクション。この OnClick 次を含むことはできません OverflowMenu(任意の指定) OverflowMenu メニュー項目が無効化されます。

disabled

boolean

メニュー オプションを無効にするかどうか。デフォルトは false です。

アイコン

カードのウィジェットに表示されるアイコン。Google Chat アプリの例については、アイコンを追加するをご覧ください。

組み込みアイコンとカスタムアイコンをサポートします。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "altText": string,
  "imageType": enum (ImageType),

  // Union field icons can be only one of the following:
  "knownIcon": string,
  "iconUrl": string,
  "materialIcon": {
    object (MaterialIcon)
  }
  // End of list of possible types for union field icons.
}
フィールド
altText

string

省略可。ユーザー補助機能に使用されるアイコンの説明。指定しない場合、デフォルト値 Button 提供されます。ベスト プラクティスとして、アイコンに表示される内容と、アイコンで表示される内容(該当する場合)についてわかりやすい説明を記述することをおすすめします。たとえば A user's account portrait、または Opens a new browser tab and navigates to the Google Chat developer documentation at https://developers.google.com/workspace/chat

アイコンが ButtonaltText ユーザーがボタンにカーソルを合わせると、ヘルパー テキストとして表示されます。ただし、ボタンで text も設定されている場合、アイコンの altText は無視されます。

imageType

enum (ImageType)

画像に適用された切り抜きスタイル。場合によっては CIRCLE 切り抜きを使用すると、画像が組み込みのアイコンよりも大きく描画されます。

共用体フィールド icons。カードのウィジェットに表示されるアイコン。 icons は次のいずれか 1 つのみを指定できます。
knownIcon

string

Google Workspace が提供する組み込みアイコンのいずれかを表示します。

たとえば、飛行機のアイコンを表示するには、AIRPLANE を指定します。バスの場合は、 BUS

サポートされているアイコンの全一覧については、 組み込みのアイコン

iconUrl

string

HTTPS URL でホストされるカスタム アイコンを表示します。

次に例を示します。

"iconUrl":
"https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png"

サポートされているファイル形式は次のとおりです。 .png および .jpg

materialIcon

object (MaterialIcon)

次のいずれかを表示 Google マテリアル アイコン

たとえば、 チェックボックス アイコンを使用する場合は、

"materialIcon": {
  "name": "check_box"
}

Google Chat アプリで利用可能で、Google Workspace アドオンでは利用できません。

MaterialIcon

Google マテリアル アイコン(2,500 以上のオプションがあります)。

たとえば、 チェックボックス アイコン 体重と成績をカスタマイズして、次の文章を書いてください。

{
  "name": "check_box",
  "fill": true,
  "weight": 300,
  "grade": -25
}

Google Chat アプリで利用可能で、Google Workspace アドオンでは利用できません。

JSON 表現
{
  "name": string,
  "fill": boolean,
  "weight": integer,
  "grade": integer
}
フィールド
name

string

アイコンの名前が Google マテリアル アイコンなど check_box。無効な名前は破棄されて空の文字列に置き換えられるため、アイコンのレンダリングに失敗します。

fill

boolean

アイコンを塗りつぶしとしてレンダリングするかどうか。デフォルト値は false です。

さまざまなアイコン設定をプレビューするには、 Google フォント アイコン [設定]で カスタマイズ:

weight

integer

アイコンのストロークの太さ。{100, 200, 300, 400, 500, 600, 700} から選択します。指定しない場合、デフォルト値は 400 です。他の値を指定した場合は、デフォルト値が使用されます。

さまざまなアイコン設定をプレビューするには、 Google フォント アイコン [設定]で カスタマイズ:

grade

integer

重量とグレードはシンボルの太さに影響します。グレードの調整は、重みの調整よりも細かく、記号のサイズに小さな影響を及ぼします。{-25、0、200} から選択します。指定しない場合、デフォルト値は 0 です。他の値が指定されている場合は、デフォルト値が使用されます。

さまざまなアイコン設定をプレビューするには、 Google フォント アイコン [設定]で カスタマイズ:

DecoratedText

テキストの上にラベルを表示したり、テキストの前にアイコンを表示したり、テキストの後に選択ウィジェットを表示したり、ボタンを表示したりするなど、テキストを装飾して表示するウィジェット。Google Chat アプリの例については、 装飾テキストでテキストを表示します

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "icon": {
    object (Icon)
  },
  "startIcon": {
    object (Icon)
  },
  "topLabel": string,
  "text": string,
  "wrapText": boolean,
  "bottomLabel": string,
  "onClick": {
    object (OnClick)
  },

  // Union field control can be only one of the following:
  "button": {
    object (Button)
  },
  "switchControl": {
    object (SwitchControl)
  },
  "endIcon": {
    object (Icon)
  }
  // End of list of possible types for union field control.
}
フィールド
icon
(deprecated)

object (Icon)

廃止により廃止 startIcon

startIcon

object (Icon)

テキストの前に表示されるアイコン。

topLabel

string

上に表示されるテキスト text。常に切り捨てられます。

text

string

必須。プライマリ テキスト。

シンプルな書式をサポートします。テキストの書式設定について詳しくは、このモジュールの Google Chat アプリでのテキストの書式設定 および Google Workspace アドオンでのテキストの書式設定

wrapText

boolean

テキストの折り返しの設定。条件 true の場合、テキストは折り返されて複数行に表示されます。それ以外の場合、テキストは切り捨てられます。

適用対象 text、次を含まない topLabel および bottomLabel

bottomLabel

string

その下に表示されるテキストは text。常に折り返します。

onClick

object (OnClick)

この操作は、ユーザーが広告をクリックして topLabel または bottomLabel

共用体フィールド control。ページのテキストの右側に表示されるボタン、スイッチ、チェックボックス、または画像。 decoratedText 追加します。 control は次のいずれか 1 つのみを指定できます。
button

object (Button)

ユーザーがクリックしてアクションをトリガーできるボタン。

switchControl

object (SwitchControl)

ユーザーがクリックして状態を変更し、アクションをトリガーできる切り替えウィジェット。

endIcon

object (Icon)

テキストの後に表示されるアイコン。

サポート 組み込み および カスタム 追加できます。

ボタン

ユーザーがクリックできるテキスト、アイコン、またはテキストとアイコンボタン。Google Chat アプリの例については、 ボタンを追加する

画像をクリック可能なボタンにするには、 ImageImageComponent)を指定し、 onClick できます。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "text": string,
  "icon": {
    object (Icon)
  },
  "color": {
    object (Color)
  },
  "onClick": {
    object (OnClick)
  },
  "disabled": boolean,
  "altText": string,
  "type": enum (Type)
}
フィールド
text

string

ボタン内に表示されるテキスト。

icon

object (Icon)

ボタン内に表示されるアイコン。icontext の両方を設定すると、テキストの前にアイコンが表示されます。

color

object (Color)

省略可。ボタンの色。設定すると、このボタンは type の設定 FILLED 色は text および icon 見やすくするために、各フィールドは識別しやすい色に設定されています。たとえば、ボタンの色を青に設定している場合、ボタン内のテキストやアイコンはすべて白に設定されます。

ボタンの色を設定するには、 red, green blue 表示されます。この値は、RGB カラー値に基づく 0 ~ 1 の浮動小数点数にする必要があります。 0 (0/255)は無色を表し、 1 (255/255) は色の最大強度を表します。

たとえば、次の例では、最大強度で色を赤に設定しています。

"color": {
   "red": 1,
   "green": 0,
   "blue": 0,
}

ボタンの色には alpha フィールドを使用できません。指定すると、このフィールドは無視されます。

onClick

object (OnClick)

必須。ハイパーリンクを開く、カスタム関数を実行するなど、ユーザーがボタンをクリックしたときに実行するアクション。

disabled

boolean

条件 true: ボタンは非アクティブな状態で表示され、ユーザーの操作に反応しません。

altText

string

ユーザー補助に使用される代替テキスト。

ボタンの役割をユーザーに示す説明テキストを設定します。たとえば、ボタンでハイパーリンクが開く場合、次のように記述します。「新しいブラウザタブを開き、次の場所にある Google Chat デベロッパー向けドキュメントに移動 https://developers.google.com/workspace/chat&quot;.

type

enum (Type)

省略可。ボタンのタイプ。未設定の場合、ボタンのタイプはデフォルトで OUTLINED。もし color フィールドが設定されている場合、ボタンの型は FILLED このフィールドに設定された値はすべて無視されます。

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

RGBA カラースペースのカラーを表します。この表現は、コンパクトさよりも、さまざまな言語の色表現との変換をシンプルにするために設計されています。たとえば、この表現のフィールドは、この表現のコンストラクタに java.awt.Color Javaまた、UIColor の +colorWithRed:green:blue:alpha メソッド(iOS の場合)少し手を加えるだけで、簡単に CSS にフォーマットできます。 rgba() 使用します。

このリファレンス ページには、RGB 値の解釈に使用する絶対色空間(sRGB、Adobe RGB、DCI-P3、BT.2020 など)に関する情報が記載されていません。デフォルトでは、アプリは sRGB 色空間を想定する必要があります。

色の等価性を判断する必要がある場合、実装では、特に明記されていない限り、赤、緑、青、アルファの値の差が最大でも 2 つの色が等しいものとして扱われます。 1e-5

例(Java):

 import com.google.type.Color;

 // ...
 public static java.awt.Color fromProto(Color protocolor) {
   float alpha = protocolor.hasAlpha()
       ? protocolor.getAlpha().getValue()
       : 1.0;

   return new java.awt.Color(
       protocolor.getRed(),
       protocolor.getGreen(),
       protocolor.getBlue(),
       alpha);
 }

 public static Color toProto(java.awt.Color color) {
   float red = (float) color.getRed();
   float green = (float) color.getGreen();
   float blue = (float) color.getBlue();
   float denominator = 255.0;
   Color.Builder resultBuilder =
       Color
           .newBuilder()
           .setRed(red / denominator)
           .setGreen(green / denominator)
           .setBlue(blue / denominator);
   int alpha = color.getAlpha();
   if (alpha != 255) {
     result.setAlpha(
         FloatValue
             .newBuilder()
             .setValue(((float) alpha) / denominator)
             .build());
   }
   return resultBuilder.build();
 }
 // ...

例(iOS / Obj-C):

 // ...
 static UIColor* fromProto(Color* protocolor) {
    float red = [protocolor red];
    float green = [protocolor green];
    float blue = [protocolor blue];
    FloatValue* alpha_wrapper = [protocolor alpha];
    float alpha = 1.0;
    if (alpha_wrapper != nil) {
      alpha = [alpha_wrapper value];
    }
    return [UIColor colorWithRed:red green:green blue:blue alpha:alpha];
 }

 static Color* toProto(UIColor* color) {
     CGFloat red, green, blue, alpha;
     if (![color getRed:&red green:&green blue:&blue alpha:&alpha]) {
       return nil;
     }
     Color* result = [[Color alloc] init];
     [result setRed:red];
     [result setGreen:green];
     [result setBlue:blue];
     if (alpha <= 0.9999) {
       [result setAlpha:floatWrapperWithValue(alpha)];
     }
     [result autorelease];
     return result;
}
// ...

例(JavaScript):

// ...

var protoToCssColor = function(rgb_color) {
   var redFrac = rgb_color.red || 0.0;
   var greenFrac = rgb_color.green || 0.0;
   var blueFrac = rgb_color.blue || 0.0;
   var red = Math.floor(redFrac * 255);
   var green = Math.floor(greenFrac * 255);
   var blue = Math.floor(blueFrac * 255);

   if (!('alpha' in rgb_color)) {
      return rgbToCssColor(red, green, blue);
   }

   var alphaFrac = rgb_color.alpha.value || 0.0;
   var rgbParams = [red, green, blue].join(',');
   return ['rgba(', rgbParams, ',', alphaFrac, ')'].join('');
};

var rgbToCssColor = function(red, green, blue) {
  var rgbNumber = new Number((red << 16) | (green << 8) | blue);
  var hexString = rgbNumber.toString(16);
  var missingZeros = 6 - hexString.length;
  var resultBuilder = ['#'];
  for (var i = 0; i < missingZeros; i++) {
     resultBuilder.push('0');
  }
  resultBuilder.push(hexString);
  return resultBuilder.join('');
};

// ...
JSON 表現
{
  "red": number,
  "green": number,
  "blue": number,
  "alpha": number
}
フィールド
red

number

色の赤の量を [0, 1] の範囲内の値として表します。

green

number

カラーの緑色の量。区間 [0, 1] 内の値として示されます。

blue

number

カラーの青色の量。[0, 1] の範囲内の値として示されます。

alpha

number

ピクセルに適用する必要があるこのカラーの割合。つまり、最終的なピクセル色は次の式で定義されます。

pixel color = alpha * (this color) + (1.0 - alpha) * (background color)

つまり、値 1.0 はソリッドカラーに相当し、値 0.0 は透明色に相当します。これは、単純な浮動小数点スカラーではなくラッパー メッセージを使用します。これにより、デフォルト値が設定されたのか未設定値だったのかを区別できます。省略すると、このカラー オブジェクトはソリッド カラーとしてレンダリングされます(アルファ値を明示的に 1.0 に設定した場合と同様です)。

種類

省略可。ボタンのタイプ。条件 color フィールドが設定されている場合、 type 接続は強制的に FILLED

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

列挙型
TYPE_UNSPECIFIED 使用しないでください。指定されていません。
OUTLINED 枠線付きのボタンは、中強調のボタンです。通常は重要なアクションが含まれますが、Chat 用アプリやアドオンの主要アクションではありません。
FILLED 塗りつぶしボタンには単色のコンテナがあります。最も視覚的な効果があり、Chat アプリやアドオンの重要な主要な操作に使用することをおすすめします。
FILLED_TONAL 塗りつぶしの色調ボタンは、塗りつぶしボタンと枠線付きボタンの中間に位置します。この方法は、枠線ボタンよりも優先度の低いボタンを強調する必要がある場合に便利です。
BORDERLESS ボタンに、デフォルト状態の非表示のコンテナがありません。優先度が最も低いアクション、特に複数のオプションを提示する場合によく使用されます。

SwitchControl

切り替えスタイルのスイッチか、チェックボックスを decoratedText 追加します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

サポートされているのは decoratedText 追加します。

JSON 表現
{
  "name": string,
  "value": string,
  "selected": boolean,
  "onChangeAction": {
    object (Action)
  },
  "controlType": enum (ControlType)
}
フィールド
name

string

フォーム入力イベントでスイッチ ウィジェットが識別される名前。

フォーム入力の操作について詳しくは、以下をご覧ください。 フォームデータの受信

value

string

ユーザーが入力した値。フォーム入力イベントの一部として返されます。

フォーム入力の操作について詳しくは、以下をご覧ください。 フォームデータの受信

selected

boolean

日時 true の場合、スイッチは選択されています。

onChangeAction

object (Action)

実行する関数など、切り替え状態が変更されたときに実行するアクション。

controlType

enum (ControlType)

ユーザー インターフェースにスイッチがどのように表示されるか。

Google Chat アプリと Google Workspace アドオンで利用できます。

ControlType

ユーザー インターフェースにスイッチがどのように表示されるか。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

列挙型
SWITCH 切り替え式のスイッチ。
CHECKBOX 廃止により廃止 CHECK_BOX
CHECK_BOX チェックボックス。

ButtonList

横方向に並べられたボタンのリスト。Google Chat アプリの例については、 ボタンを追加する

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "buttons": [
    {
      object (Button)
    }
  ]
}
フィールド
buttons[]

object (Button)

ボタンの配列。

TextInput

ユーザーがテキストを入力できるフィールド。提案と変更時のアクションをサポートします。Google Chat アプリの例については、 ユーザーがテキストを入力できるフィールドを追加します

Chat アプリは、フォーム入力イベント中に入力されたテキストの値を受信して処理できます。フォーム入力の操作について詳しくは、以下をご覧ください。 フォームデータの受信

未定義または抽象的なデータをユーザーから収集する必要がある場合は、テキスト入力を使用します。定義済みまたは列挙データをユーザーから収集するには、 SelectionInput 追加します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "name": string,
  "label": string,
  "hintText": string,
  "value": string,
  "type": enum (Type),
  "onChangeAction": {
    object (Action)
  },
  "initialSuggestions": {
    object (Suggestions)
  },
  "autoCompleteAction": {
    object (Action)
  },
  "validation": {
    object (Validation)
  },
  "placeholderText": string
}
フィールド
name

string

フォーム入力イベントでテキスト入力を識別するための名前。

フォーム入力の操作について詳しくは、以下をご覧ください。 フォームデータの受信

label

string

ユーザー インターフェースのテキスト入力フィールドの上に表示されるテキスト。

アプリに必要な情報をユーザーが入力できるように、テキストを指定します。たとえば、誰かの名前を尋ねるが、特に姓が必要とされる場合は、次のように記述します。 surnamename

次の場合は必須 hintText は指定されていません。それ以外の場合は任意です。

hintText

string

テキスト入力フィールドの下に表示されるテキストで、ユーザーに特定の値を入力するよう促すために使用します。このテキストは常に表示されます。

label が指定されていない場合は必須です。それ以外の場合は任意です。

value

string

ユーザーが入力した値。フォーム入力イベントの一部として返されます。

フォーム入力の操作について詳しくは、以下をご覧ください。 フォームデータの受信

type

enum (Type)

テキスト入力フィールドがユーザー インターフェースにどのように表示されるか。たとえば、フィールドが 1 行か複数行かを示します。

onChangeAction

object (Action)

テキスト入力フィールドの変化があった場合の処理方法。(フィールドへの追加やテキストの削除など)。

実行するアクションの例としては、カスタム関数の実行や、Google Chat でダイアログを開くなどがあります。

initialSuggestions

object (Suggestions)

ユーザーが入力できる候補値。これらの値は、ユーザーがテキスト入力フィールドをクリックすると表示されます。ユーザーの入力に応じて、ユーザーの入力内容に合わせて候補の値が動的にフィルタリングされます。

たとえば、プログラミング言語のテキスト入力フィールドでは、Java、JavaScript、Python、C++ などが候補として表示されます。ユーザーが入力を開始したとき Jav、表示する候補フィルタのリスト Java および JavaScript

候補値により、アプリが理解できる値をユーザーが入力しやすくなります。JavaScript について言及する場合、 javascript など java scriptJavaScript を提案することで、ユーザーがアプリを操作する方法を標準化できます。

指定すると、 TextInput.type 常に SINGLE_LINE(以下の設定の場合も同様) MULTIPLE_LINE

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

autoCompleteAction

object (Action)

省略可。テキスト入力フィールドを操作するユーザーに候補が提示されたときに実行するアクションを指定します。

指定しない場合、候補は initialSuggestions クライアントによって処理されます

指定すると、ここで指定したアクション(カスタム関数の実行など)が実行されます。

Google Workspace アドオンで利用可能で、Google Chat アプリでは利用できません。

validation

object (Validation)

で確認できます。 このテキスト入力フィールドに必要な検証を指定します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

placeholderText

string

テキスト入力フィールドが空の場合に表示されるテキスト。このテキストを使用して、ユーザーに値の入力を促します。たとえば Enter a number from 0 to 100

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

種類

テキスト入力フィールドがユーザー インターフェースにどのように表示されるか。たとえば、入力欄が 1 行か複数行かなどです。条件 initialSuggestions 指定されている場合、 type 常に SINGLE_LINE(次の設定の場合も同様) MULTIPLE_LINE

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

列挙型
SINGLE_LINE テキスト入力フィールドの高さは 1 行に固定されています。
MULTIPLE_LINE テキスト入力フィールドの高さは複数行に固定されています。

RenderActions

カードにアクションの実行を指示する一連のレンダリング手順 アドオンのホストアプリまたは Chat アプリに、アプリ固有のアクションを実行するように指示します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

フィールド
action

Action

アクション

フィールド
navigations[]

Navigation

表示されたカードのプッシュまたは更新を行います。

グルーピングに新しいカードを追加します(前方に移動します)。Chat 用アプリの場合、アプリのホームでのみ使用できます。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

navigations: {
  pushCard: CARD
}

一番上のカードを新しいカードに置き換えます。Chat アプリの場合は、アプリのホームでのみ使用できます。

Google Chat アプリと Google Workspace アドオンで利用できます。

navigations: {
  updateCard: CARD
}

候補

ユーザーが入力できる候補値。これらの値は、ユーザーがテキスト入力フィールドをクリックすると表示されます。ユーザーの入力に応じて、ユーザーの入力内容に合わせて候補の値が動的にフィルタリングされます。

たとえば、プログラミング言語のテキスト入力フィールドでは、Java、JavaScript、Python、C++ などが候補として表示されます。ユーザーが入力を開始したとき Jav、表示する候補フィルタのリスト Java および JavaScript

候補値により、アプリが理解できる値をユーザーが入力しやすくなります。JavaScript について言及する場合、 javascript など java script。提案 JavaScript は、ユーザーによるアプリの操作方法を標準化できます。

指定すると、 TextInput.type 常に SINGLE_LINE(以下の設定の場合も同様) MULTIPLE_LINE

Google Chat アプリと Google Workspace アドオンで利用できます。

JSON 表現
{
  "items": [
    {
      object (SuggestionItem)
    }
  ]
}
フィールド
items[]

object (SuggestionItem)

テキスト入力フィールドのオートコンプリート候補に使用される候補のリスト。

SuggestionItem

ユーザーがテキスト入力フィールドに入力できる 1 つの推奨値。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{

  // Union field content can be only one of the following:
  "text": string
  // End of list of possible types for union field content.
}
フィールド

共用体フィールド content

content は次のいずれか 1 つのみを指定できます。

text

string

テキスト入力フィールドへの入力候補の値。ユーザーが自分で入力した値と同じです。

確認事項

で確認できます。 接続されているウィジェットを検証するために必要なデータを表します。

Google Chat アプリと Google Workspace アドオンで利用できます。

JSON 表現
{
  "characterLimit": integer,
  "inputType": enum (InputType)
}
フィールド
characterLimit

integer

で確認できます。 テキスト入力ウィジェットの文字数制限を指定します。これはテキスト入力にのみ使用され、他のウィジェットでは無視されます。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

inputType

enum (InputType)

で確認できます。 入力ウィジェットのタイプを指定します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

InputType

入力ウィジェットのタイプ。

列挙型
INPUT_TYPE_UNSPECIFIED 未指定のタイプ。使用しないでください。
TEXT すべての文字を使用できる通常のテキスト。
INTEGER 整数値。
FLOAT 浮動小数点値。
EMAIL メールアドレス。
EMOJI_PICKER システム提供の絵文字選択ツールから選択された絵文字。

SelectionInput

ユーザーが選択できる 1 つ以上の UI アイテムを作成するウィジェット。たとえば、プルダウン メニューやチェックボックスなどです。このウィジェットを使用して、予測や列挙が可能なデータを収集できます。Google Chat アプリの例については、 選択可能な UI 要素を追加します

Chat アプリは、ユーザーが選択または入力したアイテムの値を処理できます。フォーム入力の操作の詳細については、フォームデータを受け取るをご覧ください。

ユーザーから未定義のデータや抽象データを収集するには、 TextInput 追加します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "name": string,
  "label": string,
  "type": enum (SelectionType),
  "items": [
    {
      object (SelectionItem)
    }
  ],
  "onChangeAction": {
    object (Action)
  },
  "multiSelectMaxSelectedItems": integer,
  "multiSelectMinQueryLength": integer,
  "validation": {
    object (Validation)
  },

  // Union field multi_select_data_source can be only one of the following:
  "externalDataSource": {
    object (Action)
  },
  "platformDataSource": {
    object (PlatformDataSource)
  }
  // End of list of possible types for union field multi_select_data_source.
}
フィールド
name

string

必須。フォーム入力イベント内の選択入力を識別する名前。

フォーム入力の操作について詳しくは、以下をご覧ください。 フォームデータの受信

label

string

ユーザー インターフェースの選択入力フィールドの上に表示されるテキスト。

アプリに必要な情報を入力するのに役立つテキストを指定します。たとえば、ユーザーがプルダウン メニューから作業チケットの緊急度を選択する場合、ラベルは「緊急度」になります。または [緊急度を選択]を選択します

type

enum (SelectionType)

フォーマットでユーザーに表示されるアイテムのタイプ SelectionInput 追加します。選択タイプは、さまざまなタイプの操作に対応しています。たとえば、ユーザーは 1 つ以上のチェックボックスを選択できますが、プルダウン メニューから選択できるのは 1 つの値のみです。

items[]

object (SelectionItem)

選択可能な項目の配列。たとえば、ラジオボタンやチェックボックスの配列です。最大 100 個のアイテムをサポートします。

onChangeAction

object (Action)

指定すると、選択が変更されたときにフォームが送信されます。指定しない場合は、フォームを送信する個別のボタンを指定する必要があります。

フォーム入力の操作の詳細については、フォームデータを受け取るをご覧ください。

multiSelectMaxSelectedItems

integer

複数選択メニューの場合、ユーザーが選択できる項目の最大数。最小値は 1 アイテムです。指定しない場合のデフォルトは 3 項目です。

multiSelectMinQueryLength

integer

複数選択メニューの場合、アプリがクエリする前にユーザーが入力したテキスト文字数が予測入力され、メニューの候補アイテムが表示されます。

指定しない場合のデフォルトは、静的データソースでは 0 文字、外部データソースでは 3 文字です。

validation

object (Validation)

プルダウン メニューの場合、この選択入力フィールドの検証。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

共用体フィールド multi_select_data_source。複数選択メニューの場合は、選択項目に入力するデータソース。

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。 multi_select_data_source は次のいずれか 1 つのみを指定できます。

externalDataSource

object (Action)

リレーショナル データベースなどの外部データソース。

platformDataSource

object (PlatformDataSource)

Google Workspace のデータソース。

SelectionType

ユーザーが選択できるアイテムの形式。オプションによって、サポートされるインタラクションの種類が異なります。たとえば、ユーザーは複数のチェックボックスを選択できますが、プルダウン メニューから選択できるのは 1 つの項目のみです。

各選択入力は、1 種類の選択をサポートします。たとえば、チェックボックスとスイッチを混在させることはできません。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

列挙型
CHECK_BOX チェックボックスのセット。ユーザーは 1 つ以上のチェックボックスを選択できます。
RADIO_BUTTON ラジオボタンのセット。ユーザーはラジオボタンを 1 つ選択できます。
SWITCH スイッチのセット。ユーザーはスイッチを 1 つ以上有効にできます。
DROPDOWN プルダウン メニュー。メニューから 1 つのアイテムを選択できます。
MULTI_SELECT

静的データと動的データの複数選択メニュー。ユーザーはメニューバーから 1 つ以上のアイテムを選択します。ユーザーは値を入力して動的データを取り込むこともできます。たとえば、ユーザーが Google Chat スペースの名前の入力を開始すると、ウィジェットがスペースを自動的に提案します。

複数選択メニューのアイテムにデータを入力するには、次のいずれかのデータソースを使用します。

  • 静的データ: アイテムは、ウィジェットの SelectionItem オブジェクトとして指定されます。アイテム数の上限は 100 個です。
  • Google Workspace のデータ: アイテムは、Google Workspace ユーザー、Google Chat スペースなどの Google Workspace のデータを使用して入力されます。
  • 外部データ: アイテムは、Google Workspace の外部の外部データソースから入力されます。

複数選択メニューの実装例については、以下をご覧ください。 複数選択メニューを追加します

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

SelectionItem

チェックボックスやスイッチなど、ユーザーが選択入力で選択できる項目。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "text": string,
  "value": string,
  "selected": boolean,
  "startIconUri": string,
  "bottomText": string
}
フィールド
text

string

ユーザーが商品アイテムを識別または説明するテキスト。

value

string

このアイテムに関連付けられた値。クライアントはこれをフォームの入力値として使用する必要があります。

フォーム入力の操作の詳細については、フォームデータを受け取るをご覧ください。

selected

boolean

アイテムがデフォルトで選択されるかどうか。選択入力で 1 つの値のみが許可される場合(ラジオボタンやプルダウン メニューなど)、このフィールドは 1 つの項目にのみ設定します。

startIconUri

string

複数選択メニューの場合、アイテムの text フィールドの横に表示されるアイコンの URL。PNG ファイルと JPEG ファイルをサポートします。HTTPS URL にする必要があります。たとえば https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png

bottomText

string

複数選択メニューの場合、アイテムの text フィールドの下に表示されるテキストの説明またはラベル。

PlatformDataSource

1 つの SelectionInput Google Workspace のデータソースである複数選択メニューを使用するウィジェット。複数選択メニューの項目に入力するために使用します。

Google Chat アプリで利用可能で、Google Workspace アドオンでは利用できません。

JSON 表現
{

  // Union field data_source can be only one of the following:
  "commonDataSource": enum (CommonDataSource),
  "hostAppDataSource": {
    object (HostAppDataSourceMarkup)
  }
  // End of list of possible types for union field data_source.
}
フィールド
共用体フィールド data_source。データソース。 data_source は次のいずれか 1 つのみを指定できます。
commonDataSource

enum (CommonDataSource)

Google Workspace 組織内のユーザーなど、すべての Google Workspace アプリケーションで共有されるデータソース。

hostAppDataSource

object (HostAppDataSourceMarkup)

Google Workspace ホスト アプリケーションに固有のデータソース(Google Chat のスペースなど)。

このフィールドは Google API クライアント ライブラリをサポートしていますが、Cloud クライアント ライブラリでは使用できません。詳しくは、 クライアント ライブラリをインストールします

CommonDataSource

全員が共有するデータソース Google Workspace アプリケーション

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

列挙型
UNKNOWN デフォルト値。使用しないでください。
USER Google Workspace ユーザー。ユーザーは、各自の Google Workspace 組織のユーザーのみを表示および選択できます。

HostAppDataSourceMarkup

1 つの SelectionInput Google Workspace アプリケーションのデータソースである複数選択メニューを使用するウィジェット。データソースに、複数選択メニューの選択項目が入力されます。

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

JSON 表現
{

  // Union field data_source can be only one of the following:
  "chatDataSource": {
    object (ChatClientDataSourceMarkup)
  }
  // End of list of possible types for union field data_source.
}
フィールド
共用体フィールド data_source。複数選択メニューのアイテムを入力する Google Workspace アプリケーション。 data_source は次のいずれか 1 つのみを指定できます。
chatDataSource

object (ChatClientDataSourceMarkup)

Google Chat のデータソース。

ChatClientDataSourceMarkup

1 つの SelectionInput 複数選択メニューを使用するウィジェットです。Google Chat のデータソースです。データソースにより、複数選択メニューの選択項目が入力されます。たとえば、ユーザーは自分がメンバーとなっている Google Chat スペースを選択できます。

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

JSON 表現
{

  // Union field source can be only one of the following:
  "spaceDataSource": {
    object (SpaceDataSource)
  }
  // End of list of possible types for union field source.
}
フィールド
共用体フィールド source。Google Chat のデータソース。 source は次のいずれか 1 つのみを指定できます。
spaceDataSource

object (SpaceDataSource)

ユーザーがメンバーである Google Chat スペース。

SpaceDataSource

複数選択メニューの選択項目として Google Chat スペースにデータを入力するデータソース。ユーザーがメンバーであるスペースのみが入力されます。

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

JSON 表現
{
  "defaultToCurrentSpace": boolean
}
フィールド
defaultToCurrentSpace

boolean

true の場合、複数選択メニューでは、デフォルトで現在の Google Chat スペースがアイテムとして選択されます。

DateTimePicker

ユーザーが日付、時刻、または日付と時刻の両方を入力できるようにします。Google Chat アプリの例については、 ユーザーが日時を選択できるようにする

ユーザーはテキストを入力するか、選択ツールを使用して日付と時刻を選択できます。ユーザーが無効な日時を入力すると、選択ツールにエラーが表示され、情報を正しく入力するよう求められます。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "name": string,
  "label": string,
  "type": enum (DateTimePickerType),
  "valueMsEpoch": string,
  "timezoneOffsetDate": integer,
  "onChangeAction": {
    object (Action)
  },
  "validation": {
    object (Validation)
  }
}
フィールド
name

string

ファイアウォール ルールで DateTimePicker フォーム入力イベントで識別されます。

フォーム入力の操作の詳細については、フォームデータを受け取るをご覧ください。

label

string

日付、時刻、または日時の入力をユーザーに促すテキスト。たとえば、ユーザーが予約をスケジュールしている場合は、 Appointment date または Appointment date and time

type

enum (DateTimePickerType)

ウィジェットが日付、時刻、または日時の入力をサポートしているかどうか。

valueMsEpoch

string (int64 format)

ウィジェットに表示されるデフォルト値( Unix エポック時刻

選択ツールのタイプ( DateTimePickerType):

  • DATE_AND_TIME : カレンダーの日時(UTC)。たとえば、2023 年 1 月 1 日午後 12 時(UTC)を表すには、次のコマンドを使用します。 1672574400000
  • DATE_ONLY : UTC 00:00:00 のカレンダーの日付。たとえば、2023 年 1 月 1 日を表すには、 1672531200000
  • TIME_ONLY : UTC の時刻。たとえば、午後 12 時を示すには、43200000(または 12 * 60 * 60 * 1000)を使用します。
timezoneOffsetDate

integer

UTC からのタイムゾーン オフセットを表す数値(分単位)。設定すると、 valueMsEpoch 指定したタイムゾーンで表示されます。設定しない場合、値はデフォルトでユーザーのタイムゾーン設定になります。

onChangeAction

object (Action)

ユーザーがクリックするとトリガーされます 保存 または クリア 取得 DateTimePicker 行うことができます。

validation

object (Validation)

で確認できます。 省略可。この日時選択ツールに必要な検証を指定します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

DateTimePickerType

日時の形式は、 DateTimePicker 追加します。ユーザーが日付、時刻、または日付と時刻の両方を入力できるかどうかを指定します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

列挙型
DATE_AND_TIME ユーザーが日時を入力します。
DATE_ONLY ユーザーが日付を入力します。
TIME_ONLY ユーザーが時刻を入力します。

分割線

この型にはフィールドがありません。

ウィジェットを区切る線を水平線で表示します。Google Chat アプリの例については、 ウィジェット間に水平方向の分割線を追加する

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

たとえば、次の JSON は分割線を作成します。

"divider": {}

グリッド

アイテムのコレクションを含むグリッドを表示します。アイテムにはテキストまたは画像のみを含めることができます。レスポンシブな列の場合や、テキストや画像以外を含める場合は、Columns を使用します。Google Chat アプリの例については、アイテムのコレクションを含むグリッドを表示するをご覧ください。

グリッドは、任意の数の列とアイテムをサポートします。行数は、アイテムを列で割った値で決まります。10 個のアイテムと 2 列のグリッドが 5 行あります。11 個のアイテムと 2 列のグリッドは 6 行あります。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

たとえば、次の JSON は、1 つのアイテムを含む 2 列のグリッドを作成します。

"grid": {
  "title": "A fine collection of items",
  "columnCount": 2,
  "borderStyle": {
    "type": "STROKE",
    "cornerRadius": 4
  },
  "items": [
    {
      "image": {
        "imageUri": "https://www.example.com/image.png",
        "cropStyle": {
          "type": "SQUARE"
        },
        "borderStyle": {
          "type": "STROKE"
        }
      },
      "title": "An item",
      "textAlignment": "CENTER"
    }
  ],
  "onClick": {
    "openLink": {
      "url": "https://www.example.com"
    }
  }
}
JSON 表現
{
  "title": string,
  "items": [
    {
      object (GridItem)
    }
  ],
  "borderStyle": {
    object (BorderStyle)
  },
  "columnCount": integer,
  "onClick": {
    object (OnClick)
  }
}
フィールド
title

string

グリッドのヘッダーに表示されるテキスト。

items[]

object (GridItem)

グリッドに表示するアイテム。

borderStyle

object (BorderStyle)

各グリッド アイテムに適用する枠線のスタイル。

columnCount

integer

グリッドに表示する列の数。このフィールドが指定されていない場合はデフォルト値が使用されます。デフォルト値は、グリッドが表示される場所(ダイアログまたはコンパニオン)によって異なります。

onClick

object (OnClick)

このコールバックは個々のグリッド アイテムで再利用されますが、コールバックのパラメータにはアイテムリスト内のアイテムの識別子とインデックスが追加されます。

GridItem

グリッド レイアウト内のアイテムを表します。アイテムには、テキスト、画像、またはテキストと画像の両方を含めることができます。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "id": string,
  "image": {
    object (ImageComponent)
  },
  "title": string,
  "subtitle": string,
  "layout": enum (GridItemLayout)
}
フィールド
id

string

このグリッド アイテムのユーザー指定の識別子。この ID は、親グリッドの onClick コールバック パラメータで返されます。

image

object (ImageComponent)

グリッド アイテムに表示される画像。

title

string

グリッドアイテムのタイトル。

subtitle

string

グリッド アイテムのサブタイトル。

layout

enum (GridItemLayout)

グリッド アイテムに使用するレイアウト。

ImageComponent

画像を表します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "imageUri": string,
  "altText": string,
  "cropStyle": {
    object (ImageCropStyle)
  },
  "borderStyle": {
    object (BorderStyle)
  }
}
フィールド
imageUri

string

画像の URL。

altText

string

画像のユーザー補助ラベル。

cropStyle

object (ImageCropStyle)

画像に適用する切り抜きスタイル。

borderStyle

object (BorderStyle)

画像に適用する枠線のスタイル。

ImageCropStyle

画像に適用される切り抜きスタイルを表します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

たとえば、16:9 のアスペクト比を適用する方法は次のとおりです。

cropStyle {
 "type": "RECTANGLE_CUSTOM",
 "aspectRatio": 16/9
}
JSON 表現
{
  "type": enum (ImageCropType),
  "aspectRatio": number
}
フィールド
type

enum (ImageCropType)

切り抜きタイプ。

aspectRatio

number

切り抜きタイプが RECTANGLE_CUSTOM

たとえば、アスペクト比 16:9 を適用する方法は次のとおりです。

cropStyle {
 "type": "RECTANGLE_CUSTOM",
 "aspectRatio": 16/9
}

ImageCropType

画像に適用される切り抜きスタイルを表します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

列挙型
IMAGE_CROP_TYPE_UNSPECIFIED 使用しないでください。指定されていません。
SQUARE デフォルト値。正方形の切り抜きを適用します。
CIRCLE 円形の切り抜きを適用します。
RECTANGLE_CUSTOM カスタムのアスペクト比で長方形の切り抜きを適用します。カスタム アスペクト比を設定する aspectRatio
RECTANGLE_4_3 アスペクト比 4:3 の長方形の切り抜きを適用します。

BorderStyle

カードまたはウィジェットの枠線のスタイル オプション(枠線の種類や色など)。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

JSON 表現
{
  "type": enum (BorderType),
  "strokeColor": {
    object (Color)
  },
  "cornerRadius": integer
}
フィールド
type

enum (BorderType)

枠線の種類。

strokeColor

object (Color)

タイプが BORDER_TYPE_STROKE

ストロークの色を設定するには、 red, green blue 表示されます。この値は、RGB カラー値に基づく 0 ~ 1 の浮動小数点数にする必要があります。 0 (0/255)は無色を表し、 1 (255/255) は色の最大強度を表します。

たとえば、次のコードは、最大強度の赤色に設定します。

"color": {
   "red": 1,
   "green": 0,
   "blue": 0,
}

alpha フィールドはストローク色では使用できません。指定すると、このフィールドは無視されます。

cornerRadius

integer

枠線の角の半径です。

BorderType

ウィジェットに適用される枠線タイプを表します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

列挙型
BORDER_TYPE_UNSPECIFIED 使用しないでください。指定されていません。
NO_BORDER デフォルト値。枠線なし。
STROKE Outline。

GridItemLayout

グリッド アイテムで利用可能なさまざまなレイアウト オプションを表します。

Google Chat アプリと Google Workspace アドオンで利用できます。

列挙型
GRID_ITEM_LAYOUT_UNSPECIFIED 使用しないでください。未指定。
TEXT_BELOW タイトルとサブタイトルは、グリッド アイテムの画像の下に表示されます。
TEXT_ABOVE タイトルとサブタイトルは、グリッドアイテムの画像の上に表示されます。

Columns ウィジェットは、カードまたはダイアログに最大 2 つの列を表示します。各列にウィジェットを追加できます。ウィジェットは指定された順序で表示されます。Google Chat アプリの例については、 列内にカードとダイアログを表示する

各列の高さは、高さの大きい列によって決まります。たとえば、最初の列が 2 番目の列よりも高い場合、両方の列のサイズは最初の列のサイズになります。各列には異なる数のウィジェットを含めることができるため、行を定義したり、列間でウィジェットを並べたりすることはできません。

列は並べて表示されます。各列の幅は、 HorizontalSizeStyle 表示されます。ユーザーの画面幅が狭すぎると、2 番目の列が 1 番目の列の下に折り返されます。

  • ウェブでは、画面幅が 480 ピクセル以下の場合、2 列目が折り返します。
  • iOS デバイスでは、画面幅が 300 pt 以下の場合、2 列目が折り返します。
  • Android デバイスでは、画面の幅が 320 dp 以下の場合、2 番目の列が折り返します。

3 つ以上の列を含める、または行を使用する場合は、 Grid 追加します。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。列をサポートするアドオン UI には、次のようなものがあります。

  • ユーザーがメールの下書きからアドオンを開いたときに表示されるダイアログ。
  • ユーザーが 添付ファイルを追加 メニューを選択します。
JSON 表現
{
  "columnItems": [
    {
      object (Column)
    }
  ]
}
フィールド
columnItems[]

object (Column)

列の配列。カードまたはダイアログには最大 2 列を含めることができます。

Column

列。

Google Workspace アドオンと Chat アプリ

JSON 表現
{
  "horizontalSizeStyle": enum (HorizontalSizeStyle),
  "horizontalAlignment": enum (HorizontalAlignment),
  "verticalAlignment": enum (VerticalAlignment),
  "widgets": [
    {
      object (Widgets)
    }
  ]
}
フィールド
horizontalSizeStyle

enum (HorizontalSizeStyle)

カードの幅を列で埋める方法を指定します。

horizontalAlignment

enum (HorizontalAlignment)

ウィジェットの配置を、左、右、中央のいずれにするかを指定します。

verticalAlignment

enum (VerticalAlignment)

ウィジェットの配置を、列の上部、下部、中央のいずれにするかを指定します。

widgets[]

object (Widgets)

列に含まれるウィジェットの配列。ウィジェットは、指定された順序で表示されます。

HorizontalSizeStyle

列がカードの幅をどのように埋めるかを指定します。各列の幅は、 HorizontalSizeStyle 列内のウィジェットの幅などです

Google Workspace アドオンと Chat アプリ

列挙型
HORIZONTAL_SIZE_STYLE_UNSPECIFIED 使用しないでください。指定されていません。
FILL_AVAILABLE_SPACE デフォルト値。列は利用可能なスペース全体に表示されます(最大でカードの幅の 70% まで)。両方の列が FILL_AVAILABLE_SPACE: 各列がスペースの 50% を占めます。
FILL_MINIMUM_SPACE 列を埋めるスペースは可能な限り最小限で、カードの幅の 30% を超えないようにします。

HorizontalAlignment

ウィジェットの配置を、左、右、中央のいずれにするかを指定します。

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

列挙型
HORIZONTAL_ALIGNMENT_UNSPECIFIED 使用しないでください。指定されていません。
START デフォルト値。ウィジェットを列の開始位置に揃えます。左から右にレイアウトする場合、左揃えになります。右から左のレイアウトの場合は、右揃えになります。
CENTER ウィジェットを列の中央に揃えます。
END ウィジェットを列の末尾の位置に配置します。左から右のレイアウトの場合は、ウィジェットを右に揃えます。右から左のレイアウトの場合、ウィジェットを左側に配置します。

VerticalAlignment

ウィジェットの配置を、列の上部、下部、中央のいずれにするかを指定します。

Google Workspace アドオンと Chat アプリ

列挙型
VERTICAL_ALIGNMENT_UNSPECIFIED 使用しないでください。指定されていません。
CENTER デフォルト値。ウィジェットを列の中央に揃えます。
TOP ウィジェットを列の上部に配置します。
BOTTOM ウィジェットを列の下部に揃えます。

ウィジェット

列に含めることができるサポートされているウィジェット。

Google Workspace アドオンと Chat アプリ

JSON 表現
{

  // Union field data can be only one of the following:
  "textParagraph": {
    object (TextParagraph)
  },
  "image": {
    object (Image)
  },
  "decoratedText": {
    object (DecoratedText)
  },
  "buttonList": {
    object (ButtonList)
  },
  "textInput": {
    object (TextInput)
  },
  "selectionInput": {
    object (SelectionInput)
  },
  "dateTimePicker": {
    object (DateTimePicker)
  },
  "chipList": {
    object (ChipList)
  }
  // End of list of possible types for union field data.
}
フィールド

共用体フィールド data

data は次のいずれかになります。

textParagraph

object (TextParagraph)

TextParagraph 追加します。

image

object (Image)

Image 追加します。

decoratedText

object (DecoratedText)

DecoratedText 追加します。

buttonList

object (ButtonList)

ButtonList 追加します。

textInput

object (TextInput)

TextInput ウィジェットです。

selectionInput

object (SelectionInput)

SelectionInput ウィジェットです。

dateTimePicker

object (DateTimePicker)

DateTimePicker 追加します。

chipList

object (ChipList)

ChipList ウィジェットです。 Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

ChipList

横方向にレイアウトされたチップのリスト。横方向にスクロールするか、次の行に折り返すことができます。

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

JSON 表現
{
  "layout": enum (Layout),
  "chips": [
    {
      object (Chip)
    }
  ]
}
フィールド
layout

enum (Layout)

指定されたチップリストのレイアウト。

chips[]

object (Chip)

チップの配列。

レイアウト

チップリストのレイアウト。

列挙型
LAYOUT_UNSPECIFIED 使用しないでください。指定されていません。
WRAPPED デフォルト値。チップリストは水平方向に十分なスペースがない場合、次の行に折り返します。
HORIZONTAL_SCROLLABLE チップが使用可能なスペースに収まらない場合、チップは横方向にスクロールします。

チップ

ユーザーがクリックできるテキスト、アイコン、テキスト、アイコンチップ。

Google Chat アプリで利用でき、Google Workspace アドオンでは利用できません。

JSON 表現
{
  "icon": {
    object (Icon)
  },
  "label": string,
  "onClick": {
    object (OnClick)
  },
  "enabled": boolean,
  "disabled": boolean,
  "altText": string
}
フィールド
icon

object (Icon)

アイコン画像。icontext の両方を設定すると、テキストの前にアイコンが表示されます。

label

string

チップ内に表示されるテキスト。

onClick

object (OnClick)

省略可。ハイパーリンクを開く、カスタム関数を実行するなど、ユーザーがチップをクリックしたときに実行するアクション。

enabled
(deprecated)

boolean

チップがアクティブ状態にあり、ユーザーの操作に応答するかどうか。デフォルトは true。非推奨です。代わりに disabled を使用してください。

disabled

boolean

チップが非アクティブな状態にあり、ユーザーの操作を無視するかどうか。デフォルトは false

altText

string

ユーザー補助に使用される代替テキスト。

チップの機能をユーザーに示す説明テキストを設定します。たとえば、チップでハイパーリンクが開く場合は、「新しいブラウザタブを開き、次の場所にある Google Chat デベロッパー向けドキュメントに移動します。 https://developers.google.com/workspace/chat&quot;.

CollapseControl

展開と折りたたみのコントロールを表します。 Google Chat アプリで利用可能で、Google Workspace アドオンでは利用できません。

JSON 表現
{
  "horizontalAlignment": enum (HorizontalAlignment),
  "expandButton": {
    object (Button)
  },
  "collapseButton": {
    object (Button)
  }
}
フィールド
horizontalAlignment

enum (HorizontalAlignment)

展開ボタンと折りたたみボタンの水平方向の配置。

expandButton

object (Button)

省略可。セクションを展開するカスタマイズ可能なボタンを定義します。expandButton フィールドと collapseButton フィールドの両方を設定する必要があります。1 つのフィールド セットのみが有効になりません。このフィールドが設定されていない場合は、デフォルトのボタンが使用されます。

collapseButton

object (Button)

省略可。セクションを閉じるカスタマイズ可能なボタンを定義します。ExpandButton フィールドと expandButton フィールドの両方を設定する必要があります。1 つのフィールド セットのみが有効になりません。このフィールドが設定されていない場合は、デフォルトのボタンが使用されます。

DividerStyle

カードの分割線のスタイル。現在は、カード セクション間の分割線にのみ使用されます。

Google Chat アプリと Google Workspace アドオンでご利用いただけます。

列挙型
DIVIDER_STYLE_UNSPECIFIED 使用しないでください。指定されていません。
SOLID_DIVIDER デフォルトのオプション。無地の分割線をレンダリングします。
NO_DIVIDER 設定すると、分割線はレンダリングされません。このスタイルでは、レイアウトから分割線が完全に削除されます。結果は、分割線をまったく追加しないのと同じ結果になります。

CardAction

カード アクションとは、カードに関連付けられているアクションです。請求書カードには、請求書の削除、請求書のメール送信、ブラウザでの請求書の表示などの操作が含まれている場合があります。

Google Workspace アドオンでは利用でき、Google Chat アプリでは利用できません。

JSON 表現
{
  "actionLabel": string,
  "onClick": {
    object (OnClick)
  }
}
フィールド
actionLabel

string

操作メニュー項目として表示されるラベル。

onClick

object (OnClick)

このアクション アイテムの onClick アクション。

CardFixedFooter

カードの下部に表示される固定(固定)フッター。

設定 fixedFooter 指定せずに、 primaryButton または secondaryButton エラーが発生します。

Chat アプリでは、固定フッターを ダイアログで呼び出せますが、 カード メッセージです。Google Chat アプリの例については、永続的なフッターを追加するをご覧ください。

Google Chat アプリと Google Workspace アドオンで利用できます。

JSON 表現
{
  "primaryButton": {
    object (Button)
  },
  "secondaryButton": {
    object (Button)
  }
}
フィールド
primaryButton

object (Button)

固定フッターのメインボタン。ボタンは、テキストと色が設定されたテキストボタンであること。

secondaryButton

object (Button)

固定フッターのサブボタン。ボタンは、テキストと色が設定されたテキストボタンであること。条件 secondaryButton 次の値も設定する必要があります。 primaryButton

DisplayStyle

Google Workspace アドオンでのカードの表示方法を決定します。

Google Workspace アドオンで利用可能で、Google Chat アプリでは利用できません。

列挙型
DISPLAY_STYLE_UNSPECIFIED 使用しないでください。指定されていません。
PEEK カードのヘッダーは、サイドバーの下部に表示され、現在のスタックの一番上のカードを覆います。ヘッダーをクリックすると、カードがカード スタックにポップアップ表示されます。カードにヘッダーがない場合は、代わりに生成されたヘッダーが使用されます。
REPLACE デフォルト値。カードスタックの一番上のカードのビューが置き換えられてカードが表示されます。