Package google.apps.card.v1

索引

操作

用于描述表单提交时的行为的操作。例如,您可以调用 Apps 脚本来处理表单。如果触发该操作,系统会将表单值发送到服务器。

适用于 Google Chat 应用和 Google Workspace 插件。

字段
function

string

在包含元素被点击或以其他方式激活时调用的自定义函数。

如需查看用法示例,请参阅读取表单数据

parameters[]

ActionParameter

操作参数列表。

load_indicator

LoadIndicator

指定在调用操作时操作显示的加载指示器。

persist_values

bool

指示表单值在操作后是否保留。默认值为 false

如果为 true,则表单值会在触发操作后保留。如需允许用户在处理操作期间进行更改,请将 LoadIndicator 设置为 NONE。对于 Chat 应用中的卡片消息,您还必须将操作的 ResponseType 设置为 UPDATE_MESSAGE,并使用包含该操作的卡片中的相同 card_id

如果为 false,则在触发操作时清除表单值。如需防止用户在处理操作期间进行更改,请将 LoadIndicator 设置为 SPINNER

interaction

Interaction

可选。打开对话框时必须提供。

如何响应与用户的互动,例如用户点击卡片消息中的按钮。

如果未指定,应用会像往常一样执行 action(例如打开链接或运行函数)来响应。

通过指定 interaction,应用可以以特殊的互动方式做出响应。例如,通过将 interaction 设置为 OPEN_DIALOG,应用可以打开对话框。指定此属性后,系统不会显示加载指示器。如果为插件指定了此属性,系统会移除整个卡片,客户端中不会显示任何内容。

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

required_widgets[]

string

可选。在此列表中填写此 Action 需要在有效提交时使用的 widget 的名称。

如果在调用此 Action 时,此处列出的 widget 没有值,系统会中止表单提交。

适用于 Google Chat 应用和 Google Workspace 插件。

all_widgets_are_required

bool

可选。如果为 true,则系统会将所有 widget 都视为此操作所必需的。

适用于 Google Chat 应用和 Google Workspace 插件。

ActionParameter

调用操作方法时要提供的字符串参数列表。例如,假设有三个闹钟暂停按钮:“立即暂停”“暂停一天”或“暂停下周”。您可以使用 action method = snooze(),在字符串参数列表中传递闹钟暂停类型和暂停时间。

如需了解详情,请参阅 CommonEventObject

适用于 Google Chat 应用和 Google Workspace 插件。

字段
key

string

操作脚本的参数名称。

value

string

参数的值。

互动

可选。打开对话框时必须提供。

如何响应与用户的互动,例如用户点击卡片消息中的按钮。

如果未指定,应用会像往常一样执行 action(例如打开链接或运行函数)来响应。

通过指定 interaction,应用可以以特殊的互动方式做出响应。例如,通过将 interaction 设置为 OPEN_DIALOG,应用可以打开对话框

指定此属性后,系统不会显示加载指示器。如果为插件指定了此属性,系统会移除整个卡片,客户端中不会显示任何内容。

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

枚举
INTERACTION_UNSPECIFIED 默认值。action 会照常执行。
OPEN_DIALOG

打开对话框,这是一种基于窗口的卡片式界面,聊天应用会使用它与用户互动。

仅 Chat 应用支持,用于响应卡片消息中的按钮点击。如果为插件指定了此属性,系统会移除整个卡片,客户端中不会显示任何内容。

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

LoadIndicator

指定在调用操作时操作显示的加载指示器。

适用于 Google Chat 应用和 Google Workspace 插件。

枚举
SPINNER 显示旋转图标,表示内容正在加载。
NONE 系统不会显示任何内容。

BorderStyle

卡片或 widget 边框的样式选项,包括边框类型和颜色。

适用于 Google Chat 应用和 Google Workspace 插件。

字段
type

BorderType

边框类型。

stroke_color

Color

类型为 BORDER_TYPE_STROKE 时要使用的颜色。

如需设置描边颜色,请为 redgreenblue 字段指定值。该值必须是介于 0 和 1 之间的浮点数,基于 RGB 颜色值,其中 0 (0/255) 表示无颜色,1 (255/255) 表示颜色的最大强度。

例如,以下代码会将颜色设置为强度最高的红色:

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

alpha 字段不适用于描边颜色。如果指定,系统会忽略此字段。

corner_radius

int32

边框的圆角半径。

BorderType

表示应用于微件的边框类型。

适用于 Google Chat 应用和 Google Workspace 插件。

枚举
BORDER_TYPE_UNSPECIFIED 请勿使用。未指定。
NO_BORDER 默认值。无边框。
STROKE 大纲。

按钮

用户可以点击的文本、图标或文本和图标按钮。如需查看 Google Chat 应用中的示例,请参阅添加按钮

如需将图片设为可点击的按钮,请指定 Image(而非 ImageComponent)并设置 onClick 操作。

适用于 Google Chat 应用和 Google Workspace 插件。

字段
text

string

按钮内显示的文本。

icon

Icon

按钮内显示的图标。如果同时设置了 icontext,则图标会显示在文本前面。

color

Color

可选。按钮的颜色。如果已设置,按钮 type 会设置为 FILLEDtexticon 字段的颜色会设置为对比色,以提高可读性。例如,如果按钮颜色设置为蓝色,则按钮中的所有文本或图标都会设置为白色。

如需设置按钮颜色,请为 redgreenblue 字段指定值。该值必须是介于 0 和 1 之间的浮点数,基于 RGB 颜色值,其中 0 (0/255) 表示无颜色,1 (255/255) 表示颜色的最大强度。

例如,以下代码会将颜色设置为强度最高的红色:

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

alpha 字段不适用于按钮颜色。如果指定,系统会忽略此字段。

on_click

OnClick

必需。用户点击按钮时要执行的操作,例如打开超链接或运行自定义函数。

disabled

bool

如果为 true,则按钮显示为非活动状态,并且不会响应用户操作。

alt_text

string

用于确保可访问性的替代文本。

设置描述性文本,让用户了解该按钮的用途。例如,如果某个按钮会打开超链接,您可以写“打开一个新的浏览器标签页,然后前往 https://developers.google.com/workspace/chat" 查看 Google Chat 开发者文档”。

type

Type

可选。按钮的类型。如果未设置,按钮类型默认为 OUTLINED。如果设置了 color 字段,系统会强制将按钮类型设为 FILLED,并忽略为此字段设置的任何值。

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

类型

可选。按钮的类型。如果设置了 color 字段,则 type 会强制设为 FILLED

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

枚举
TYPE_UNSPECIFIED 请勿使用。未指定。
OUTLINED 轮廓按钮是中强调度按钮。其中通常包含重要但不是 Chat 应用或插件中主要操作的操作。
FILLED 填充的按钮具有纯色的容器。这种按钮的视觉效果最强,建议用于 Chat 应用或插件中的重要主要操作。
FILLED_TONAL 填充色调按钮介于填充按钮和轮廓按钮之间。在某些情况下,优先级较低的按钮需要比轮廓按钮提供更明显的强调效果,这时就非常适合使用填充按钮。
BORDERLESS 按钮在默认状态下没有不可见的容器。它通常用于优先级最低的操作,尤其是在显示多个选项时。

ButtonList

水平排列的按钮列表。如需查看 Google Chat 应用中的示例,请参阅添加按钮

适用于 Google Chat 应用和 Google Workspace 插件。

字段
buttons[]

Button

按钮数组。

卡片

在 Google Chat 消息或 Google Workspace 插件中显示的卡片界面。

卡片支持定义的布局、按钮等交互式界面元素,以及图片等富媒体。使用卡片来呈现详细信息、从用户那里收集信息,以及引导用户执行后续步骤。

使用卡片制作工具设计和预览卡片。

打开卡片制作工具

如需了解如何构建卡片,请参阅以下文档:

注意:每张卡片最多可添加 100 个微件。超出此限制的所有微件都会被忽略。此限制同时适用于 Google Chat 应用中的卡片消息和对话,以及 Google Workspace 插件中的卡片。

示例: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"
                             }
                           ]
                         }
                       }
                     }
                   ]
                 }
               }
             ]
           }
         ]
       }
    }
  ]
}
字段
header

CardHeader

卡片的标题。标题通常包含一张前置图片和一个标题。标题始终显示在卡片顶部。

sections[]

Section

包含一组 widget。每个部分都有自己的可选标题。各部分之间用线条分隔。如需查看 Google Chat 应用中的示例,请参阅定义卡片的部分

section_divider_style

DividerStyle

标题、部分和页脚之间的分隔线样式。

card_actions[]

CardAction

卡片的操作。操作会添加到卡片的工具栏菜单中。

适用于 Google Workspace 插件,不适用于 Google Chat 应用。

例如,以下 JSON 会构建一个包含 SettingsSend Feedback 选项的卡片操作菜单:

"card_actions": [
  {
    "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

卡片的名称。在卡片导航中用作卡片标识符。

适用于 Google Workspace 插件,不适用于 Google Chat 应用。

display_style

DisplayStyle

在 Google Workspace 插件中,设置 peekCardHeader 的显示属性。

适用于 Google Workspace 插件,不适用于 Google Chat 应用。

peek_card_header

CardHeader

显示情境内容时,预览卡片标题会用作占位符,以便用户在首页卡片和情境卡片之间前进导航。

适用于 Google Workspace 插件,不适用于 Google Chat 应用。

CardAction

卡片操作是指与卡片关联的操作。例如,账单卡片可能包含删除账单、通过电子邮件发送账单或在浏览器中打开账单等操作。

适用于 Google Workspace 插件,不适用于 Google Chat 应用。

字段
action_label

string

显示为操作菜单项的标签。

on_click

OnClick

此操作项的 onClick 操作。

CardFixedFooter

显示在卡片底部的永久性(固定)页脚。

如果设置 fixedFooter 而不指定 primaryButtonsecondaryButton,则会导致错误。

对于 Chat 应用,您可以在对话框中使用固定页脚,但不能在卡片消息中使用。如需查看 Google Chat 应用中的示例,请参阅添加永久性页脚

适用于 Google Chat 应用和 Google Workspace 插件。

字段
primary_button

Button

固定页脚的主要按钮。该按钮必须是设置了文本和颜色的文本按钮。

secondary_button

Button

固定页脚的辅助按钮。该按钮必须是设置了文本和颜色的文本按钮。如果设置了 secondaryButton,则还必须设置 primaryButton

CardHeader

表示卡片标题。如需查看 Google Chat 应用中的示例,请参阅添加标题

适用于 Google Chat 应用和 Google Workspace 插件。

字段
title

string

必需。卡片标题的标题。标题的高度是固定的:如果同时指定了标题和副标题,则每个标题占一行。如果仅指定了标题,则标题会占据两行。

subtitle

string

卡片标题的副标题。如果已指定,则显示在 title 下方单独的一行中。

image_type

ImageType

用于剪裁图片的形状。

适用于 Google Chat 应用和 Google Workspace 插件。

image_url

string

卡片标题中图片的 HTTPS 网址。

image_alt_text

string

此图片的替代文本,用于实现无障碍功能。

DisplayStyle

在 Google Workspace 插件中,用于确定卡片的显示方式。

适用于 Google Workspace 插件,不适用于 Google Chat 应用。

枚举
DISPLAY_STYLE_UNSPECIFIED 请勿使用。未指定。
PEEK 卡片的标题会显示在侧边栏底部,部分覆盖堆叠的当前顶部卡片。点击标题即可将卡片弹出到卡片堆叠中。如果卡片没有标题,则系统会改用生成的标题。
REPLACE 默认值。系统会通过替换卡片堆叠中顶部卡片的视图来显示该卡片。

DividerStyle

卡片的分隔线样式。目前仅用于卡片部分之间的分隔线。

适用于 Google Chat 应用和 Google Workspace 插件。

枚举
DIVIDER_STYLE_UNSPECIFIED 请勿使用。未指定。
SOLID_DIVIDER 默认选项。渲染实心分隔线。
NO_DIVIDER 如果设置,则不会呈现分隔线。此样式会从布局中完全移除分隔线。结果等同于根本不添加分隔符。

NestedWidget

可在容器布局(例如 CarouselCard)中显示的 widget 的列表。适用于 Google Chat 应用,不适用于 Google Workspace 插件。

字段

联合字段 data

data 只能是下列其中一项:

text_paragraph

TextParagraph

文本段落微件。

button_list

ButtonList

一个按钮列表 widget。

image

Image

图片微件。

部分

版块包含一组微件,这些微件会按照指定的顺序垂直呈现。

适用于 Google Chat 应用和 Google Workspace 插件。

字段
header

string

显示在部分顶部的文字。支持简单的 HTML 格式文本。如需详细了解如何设置文本格式,请参阅在 Google Chat 应用中设置文本格式在 Google Workspace 插件中设置文本格式

widgets[]

Widget

该部分中的所有微件。必须包含至少一个 widget。

collapsible

bool

指示此部分是否可收起。

可收起的部分会隐藏部分或全部微件,但用户可以点击展开来展开该部分,以显示隐藏的微件。用户可以点击显示较少,再次隐藏这些微件。

如需确定要隐藏哪些 widget,请指定 uncollapsibleWidgetsCount

uncollapsible_widgets_count

int32

即使某个版块处于收起状态,仍会显示的不可收起微件的数量。

例如,当某个版块包含 5 个 widget 且 uncollapsibleWidgetsCount 设置为 2 时,前两个 widget 始终会显示,最后三个 widget 默认处于收起状态。只有在 collapsibletrue 时,系统才会考虑 uncollapsibleWidgetsCount

collapse_control

CollapseControl

可选。定义该部分的展开和收起按钮。只有当该部分可收起时,系统才会显示此按钮。如果未设置此字段,则使用默认按钮。适用于 Google Chat 应用,不适用于 Google Workspace 插件。

轮播界面(也称为滑块)会旋转并以幻灯片格式显示 widget 列表,并提供用于导航到上一个或下一个 widget 的按钮。

例如,下面是包含三个文本段落微件的轮播界面的 JSON 表示法。

{
  "carouselCards": [
    {
      "widgets": [
        {
          "textParagraph": {
            "text": "First text paragraph in carousel",
          }
        }
      ]
    },
    {
      "widgets": [
        {
          "textParagraph": {
            "text": "Second text paragraph in carousel",
          }
        }
      ]
    },
    {
      "widgets": [
        {
          "textParagraph": {
            "text": "Third text paragraph in carousel",
          }
        }
      ]
    }
  ]
}

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

字段
carousel_cards[]

CarouselCard

轮播界面中包含的卡片列表。

CarouselCard

可显示为轮播界面项的卡片。适用于 Google Chat 应用,不适用于 Google Workspace 插件。

字段
widgets[]

NestedWidget

轮播卡片中显示的微件列表。这些微件会按照指定的顺序显示。

footer_widgets[]

NestedWidget

轮播卡片底部显示的微件列表。这些微件会按照指定的顺序显示。

条状标签

用户可以点击的文本、图标或文本和图标条状标签。

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

字段
icon

Icon

图标图片。如果同时设置了 icontext,则图标会显示在文本前面。

label

string

条状标签中显示的文本。

on_click

OnClick

可选。用户点击条状标签时要执行的操作,例如打开超链接或运行自定义函数。

enabled
(deprecated)

bool

条状标签是否处于活动状态并响应用户操作。默认为 true。已弃用。请改用 disabled

disabled

bool

条状标签是否处于非活动状态并忽略用户操作。默认为 false

alt_text

string

用于确保可访问性的替代文本。

设置描述性文本,让用户知道条状标签的用途。例如,如果条状标签会打开超链接,请写“打开一个新的浏览器标签页,然后前往 https://developers.google.com/workspace/chat" 查看 Google Chat 开发者文档”。

ChipList

水平排列的条状标签列表,可水平滚动或换行。

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

字段
layout

Layout

指定的条状标签列表布局。

chips[]

Chip

条状标签数组。

布局

条状标签列表布局。

枚举
LAYOUT_UNSPECIFIED 请勿使用。未指定。
WRAPPED 默认值。如果横向空间不足,条状标签列表会换行到下一行。
HORIZONTAL_SCROLLABLE 如果条状标签无法放入可用空间,则会水平滚动。

CollapseControl

表示展开和收起控件。适用于 Google Chat 应用,不适用于 Google Workspace 插件。

字段
horizontal_alignment

HorizontalAlignment

展开和收起按钮的水平对齐方式。

expand_button

Button

可选。定义一个可自定义的按钮以展开该部分。必须设置 expand_button 和 collapse_button 字段。只有一个字段集不会生效。如果未设置此字段,则使用默认按钮。

collapse_button

Button

可选。定义一个可自定义的按钮来收起该部分。必须设置 expand_button 和 collapse_button 字段。只有一个字段集不会生效。如果未设置此字段,则使用默认按钮。

Columns widget 在卡片或对话框中最多可显示 2 列。您可以向每列添加微件;微件会按指定的顺序显示。如需查看 Google Chat 应用中的示例,请参阅在列中显示卡片和对话框

每列的高度由较高列决定。例如,如果第一列比第二列高,则这两列的高度都与第一列相同。由于每列可以包含不同数量的 widget,因此您无法定义行或在列之间对齐 widget。

列会并排显示。您可以使用 HorizontalSizeStyle 字段自定义各列的宽度。如果用户的屏幕宽度过窄,第二列会换行显示在第一列下方:

  • 在网站上,如果屏幕宽度小于或等于 480 像素,则第二列会换行。
  • 在 iOS 设备上,如果屏幕宽度小于或等于 300 pt,则第二列会换行。
  • 在 Android 设备上,如果屏幕宽度小于或等于 320 dp,则第二列会换行。

如需添加多于两列的列或使用行,请使用 Grid 微件。

适用于 Google Chat 应用和 Google Workspace 插件。支持列的插件界面包括:

  • 当用户从电子邮件草稿打开插件时显示的对话框。
  • 当用户从 Google 日历活动的添加附件菜单中打开插件时,系统会显示的对话框。
字段
column_items[]

Column

列数组。您最多可以在卡片或对话框中添加 2 列。

列。

Google Workspace 插件和 Chat 应用

字段
horizontal_size_style

HorizontalSizeStyle

指定列如何填充卡片的宽度。

horizontal_alignment

HorizontalAlignment

指定 widget 是沿列的左侧、右侧还是中间对齐。

vertical_alignment

VerticalAlignment

指定 widget 是与列的顶部、底部还是中心对齐。

widgets[]

Widgets

列中包含的微件数组。微件会按照指定的顺序显示。

HorizontalSizeStyle

指定列如何填充卡片的宽度。每列的宽度取决于 HorizontalSizeStyle 和列中 widget 的宽度。

Google Workspace 插件和 Chat 应用

枚举
HORIZONTAL_SIZE_STYLE_UNSPECIFIED 请勿使用。未指定。
FILL_AVAILABLE_SPACE 默认值。列会填满可用空间,占用空间不超过卡片宽度的 70%。如果将这两个列都设置为 FILL_AVAILABLE_SPACE,则每个列会占据 50% 的空间。
FILL_MINIMUM_SPACE 列占用的空间尽可能少,且不超过卡片宽度的 30%。

VerticalAlignment

指定 widget 是与列的顶部、底部还是中心对齐。

Google Workspace 插件和 Chat 应用

枚举
VERTICAL_ALIGNMENT_UNSPECIFIED 请勿使用。未指定。
CENTER 默认值。将微件对齐到列的中心。
TOP 将 widget 对齐到列顶部。
BOTTOM 将 widget 对齐到列底部。

widget

您可以在列中添加的受支持的微件。

Google Workspace 插件和 Chat 应用

字段

联合字段 data

data 只能是下列其中一项:

text_paragraph

TextParagraph

TextParagraph微件。

image

Image

Image微件。

decorated_text

DecoratedText

DecoratedText微件。

button_list

ButtonList

ButtonList微件。

text_input

TextInput

TextInput微件。

selection_input

SelectionInput

SelectionInput微件。

date_time_picker

DateTimePicker

DateTimePicker微件。

chip_list

ChipList

ChipList 微件。适用于 Google Chat 应用,不适用于 Google Workspace 插件。

DateTimePicker

让用户输入日期、时间或日期和时间。如需查看 Google Chat 应用中的示例,请参阅让用户选择日期和时间

用户可以输入文本,也可以使用选择器选择日期和时间。如果用户输入的日期或时间无效,选择器会显示错误消息,提示用户正确输入信息。

适用于 Google Chat 应用和 Google Workspace 插件。

字段
name

string

在表单输入事件中用于标识 DateTimePicker 的名称。

如需详细了解如何使用表单输入,请参阅接收表单数据

label

string

提示用户输入日期、时间或日期和时间的文本。例如,如果用户要安排预约,请使用 Appointment dateAppointment date and time 等标签。

type

DateTimePickerType

微件是否支持输入日期、时间或日期和时间。

value_ms_epoch

int64

微件中显示的默认值,以自 Unix 纪年时间算起的毫秒数表示。

根据选择器的类型 (DateTimePickerType) 指定值:

  • DATE_AND_TIME:世界协调时间 (UTC) 格式的日历日期和时间。例如,如需表示 2023 年 1 月 1 日世界协调时间 (UTC) 中午 12:00,请使用 1672574400000
  • DATE_ONLY:世界协调时间 (UTC) 00:00:00 的日历日期。例如,如需表示 2023 年 1 月 1 日,请使用 1672531200000
  • TIME_ONLY:世界协调时间 (UTC) 时间。例如,如需表示下午 12:00,请使用 43200000(或 12 * 60 * 60 * 1000)。
timezone_offset_date

int32

一个数字,表示相对于世界协调时间 (UTC) 的时区偏移量(以分钟为单位)。如果设置了此属性,value_ms_epoch 将显示在指定的时区。如果未设置,则值默认为用户的时区设置。

on_change_action

Action

当用户点击 DateTimePicker 界面中的保存清除时触发。

validation

Validation

可选。指定此日期选择器所需的验证。

适用于 Google Chat 应用和 Google Workspace 插件。

DateTimePickerType

DateTimePicker 微件中日期和时间的格式。确定用户能否输入日期、时间或同时输入日期和时间。

适用于 Google Chat 应用和 Google Workspace 插件。

枚举
DATE_AND_TIME 用户输入日期和时间。
DATE_ONLY 用户输入日期。
TIME_ONLY 用户输入时间。

DecoratedText

用于显示文本的 widget,可添加可选装饰,例如文本上方或下方的标签、文本前面的图标、文本后的选择 widget 或按钮。如需查看 Google Chat 应用中的示例,请参阅显示带有装饰文本的文本

适用于 Google Chat 应用和 Google Workspace 插件。

字段
icon
(deprecated)

Icon

已废弃,取而代之的是 startIcon

start_icon

Icon

显示在文本前面的图标。

top_label

string

显示在 text 上方的文本。始终截断。

text

string

必需。主要文本。

支持简单的格式设置。如需详细了解如何设置文本格式,请参阅在 Google Chat 应用中设置文本格式在 Google Workspace 插件中设置文本格式

wrap_text

bool

“文字环绕”设置。如果为 true,文本会换行显示。否则,系统会截断文本。

仅适用于 text,不适用于 topLabelbottomLabel

bottom_label

string

显示在 text 下方的文本。始终换行。

on_click

OnClick

当用户点击 topLabelbottomLabel 时,系统会触发此操作。

联合字段 control。显示在 decoratedText 微件中文本右侧的按钮、开关、复选框或图片。control 只能是下列其中一项:
button

Button

用户可以点击该按钮来触发操作。

switch_control

SwitchControl

开关 widget,用户可以点击该 widget 来更改其状态并触发操作。

end_icon

Icon

显示在文本后面的图标。

支持内置自定义图标。

开关控制

decoratedText widget 中的切换开关或复选框。

适用于 Google Chat 应用和 Google Workspace 插件。

仅在 decoratedText 微件中受支持。

字段
name

string

在表单输入事件中用于标识开关 widget 的名称。

如需详细了解如何使用表单输入,请参阅接收表单数据

value

string

用户输入的值,作为表单输入事件的一部分返回。

如需详细了解如何使用表单输入,请参阅接收表单数据

selected

bool

true 时,开关处于选中状态。

on_change_action

Action

在开关状态发生变化时要执行的操作,例如要运行的函数。

control_type

ControlType

开关在界面中的显示方式。

适用于 Google Chat 应用和 Google Workspace 插件。

ControlType

开关在界面中的显示方式。

适用于 Google Chat 应用和 Google Workspace 插件。

枚举
SWITCH 切换开关。
CHECKBOX 已废弃,取而代之的是 CHECK_BOX
CHECK_BOX 复选框。

隔离设施

此类型没有字段。

以水平线的形式在 widget 之间显示分隔线。如需查看 Google Chat 应用中的示例,请参阅在微件之间添加水平分隔线

适用于 Google Chat 应用和 Google Workspace 插件。

例如,以下 JSON 会创建一个分隔符:

"divider": {}

网格

显示包含一系列项的网格。项只能包含文字或图片。对于自适应列,或者要添加文本或图片以外的内容,请使用 Columns。如需查看 Google Chat 应用中的示例,请参阅显示包含一系列项的网格

网格支持任意数量的列和项。行数取决于项数除以列数。一个包含 10 项和 2 列的网格有 5 行。一个包含 11 项和 2 列的网格有 6 行。

适用于 Google Chat 应用和 Google Workspace 插件。

例如,以下 JSON 会创建一个包含单个项的 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"
    }
  }
}
字段
title

string

网格标题中显示的文本。

items[]

GridItem

要在网格中显示的项。

border_style

BorderStyle

要应用于每个网格项的边框样式。

column_count

int32

网格中要显示的列数。如果未指定此字段,系统会使用默认值,并且该默认值因显示网格的显示位置(对话框与配套应用)而异。

on_click

OnClick

此回调会由每个网格项重复使用,但会将项的标识符和项列表中的索引添加到回调的参数中。

GridItem

表示网格布局中的项。项可以包含文本、图片,也可以同时包含文本和图片。

适用于 Google Chat 应用和 Google Workspace 插件。

字段
id

string

此网格项的用户指定标识符。此标识符会在父级网格的 onClick 回调参数中返回。

image

ImageComponent

网格项中显示的图片。

title

string

网格项的标题。

subtitle

string

网格项的副标题。

layout

GridItemLayout

要为网格项使用的布局。

GridItemLayout

表示网格项可用的各种布局选项。

适用于 Google Chat 应用和 Google Workspace 插件。

枚举
GRID_ITEM_LAYOUT_UNSPECIFIED 请勿使用。未指定。
TEXT_BELOW 标题和副标题会显示在网格项的图片下方。
TEXT_ABOVE 标题和副标题会显示在网格项图片上方。

图标

卡片上 widget 中显示的图标。如需查看 Google Chat 应用中的示例,请参阅添加图标

支持内置自定义图标。

适用于 Google Chat 应用和 Google Workspace 插件。

字段
alt_text

string

可选。用于无障碍功能的图标的说明。如果未指定,则系统会提供默认值 Button。最佳实践是,您应为图标显示的内容以及其用途(如果适用)设置有用的说明。例如 A user's account portraitOpens a new browser tab and navigates to the Google Chat developer documentation at https://developers.google.com/workspace/chat

如果图标是在 Button 中设置的,则当用户将鼠标悬停在按钮上时,altText 会显示为辅助文本。不过,如果按钮还设置了 text,系统会忽略图标的 altText

image_type

ImageType

应用于图片的剪裁样式。在某些情况下,应用 CIRCLE 剪裁会导致图片绘制尺寸大于内置图标。

联合字段 icons。卡片上 widget 中显示的图标。icons 只能是下列其中一项:
known_icon

string

显示 Google Workspace 提供的内置图标之一。

例如,如需显示飞机图标,请指定 AIRPLANE。对于公交车,请指定 BUS

如需查看支持的图标的完整列表,请参阅内置图标

icon_url

string

显示托管在 HTTPS 网址上的自定义图标。

例如:

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

支持的文件类型包括 .png.jpg

material_icon

MaterialIcon

显示某个 Google Material 图标

例如,如需显示复选框图标,请使用

"material_icon": {
  "name": "check_box"
}

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

Image

通过网址指定的图片,可以包含 onClick 操作。有关示例,请参阅添加图片

适用于 Google Chat 应用和 Google Workspace 插件。

字段
image_url

string

托管图片的 HTTPS 网址。

例如:

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

OnClick

当用户点击图片时,点击操作会触发此操作。

alt_text

string

此图片的替代文本,用于实现无障碍功能。

ImageComponent

表示图片。

适用于 Google Chat 应用和 Google Workspace 插件。

字段
image_uri

string

图片网址。

alt_text

string

图片的无障碍功能标签。

crop_style

ImageCropStyle

要应用于图片的剪裁样式。

border_style

BorderStyle

要应用于图片的边框样式。

ImageCropStyle

表示应用于图片的剪裁样式。

适用于 Google Chat 应用和 Google Workspace 插件。

例如,下面展示了如何应用 16:9 宽高比:

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

ImageCropType

剪裁类型。

aspect_ratio

double

如果剪裁类型为 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 的矩形剪裁。

MaterialIcon

Google Material 图标,包含 2500 多个选项。

例如,如需显示带有自定义权重和评分的复选框图标,请编写以下代码:

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

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

字段
name

string

Google Material 图标中定义的图标名称,例如 check_box。系统会舍弃所有无效名称并将其替换为空字符串,这会导致图标无法呈现。

fill

bool

图标是否以填充状态呈现。默认值为 false。

如需预览不同的图标设置,请前往 Google 字体图标,然后调整自定义下的设置。

weight

int32

图标的描边粗细。请从 {100, 200, 300, 400, 500, 600, 700} 中进行选择。如果不存在,默认值为 400。如果指定任何其他值,则使用默认值。

如需预览不同的图标设置,请前往 Google 字体图标,然后调整自定义下的设置。

grade

int32

Weight 和 Grade 会影响符号的粗细。调整 Grade 比调整 Weight 更精细,对符号大小的影响较小。请从 {-25, 0, 200} 中进行选择。如果不存在,默认值为 0。如果指定任何其他值,则使用默认值。

如需预览不同的图标设置,请前往 Google 字体图标,然后调整自定义下的设置。

OnClick

表示在用户点击卡片上的交互元素(例如按钮)时如何响应。

适用于 Google Chat 应用和 Google Workspace 插件。

字段

联合字段 data

data 只能是下列其中一项:

action

Action

如果指定,系统会通过此 onClick 触发操作。

card

Card

点击后,系统会将新卡片推送到卡片堆栈(如果指定)。

适用于 Google Workspace 插件,不适用于 Google Chat 应用。

overflow_menu

OverflowMenu

如果指定,此 onClick 会打开菜单。适用于 Google Chat 应用,不适用于 Google Workspace 插件。

OnClose

当通过 OnClick 操作打开的链接关闭时,客户端执行的操作。

具体实现取决于客户端平台功能。例如,网络浏览器可能会使用 OnClose 处理脚本在弹出式窗口中打开链接。

如果同时设置了 OnOpenOnClose 处理脚本,并且客户端平台无法支持这两个值,则以 OnClose 为准。

适用于 Google Workspace 插件,不适用于 Google Chat 应用。

枚举
NOTHING 默认值。卡片不会重新加载;系统不会执行任何操作。
RELOAD

在子窗口关闭后重新加载卡片。

如果与 OpenAs.OVERLAY 结合使用,子窗口会充当模态对话框,父级卡片会被屏蔽,直到子窗口关闭。

OpenAs

OnClick 操作打开链接时,客户端可以将其作为全尺寸窗口(如果这是客户端使用的框架)或叠加层(例如弹出式窗口)打开。具体实现取决于客户端平台功能,如果客户端不支持所选值,系统可能会忽略该值。所有客户端都支持 FULL_SIZE

适用于 Google Workspace 插件,不适用于 Google Chat 应用。

枚举
FULL_SIZE 链接会以全尺寸窗口的形式打开(如果客户端使用的是该框架)。
OVERLAY 链接会以叠加层(例如弹出式窗口)的形式打开。

OverflowMenu

此 widget 会显示一个包含用户可以调用的一项或多项操作的弹出式菜单。例如,在卡片中显示非主要操作。如果操作不适合放在可用空间中,您可以使用此微件。如需使用,请在支持此 widget 的 widget 的 OnClick 操作中指定此 widget。例如,在 Button 中。

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

字段
items[]

OverflowMenuItem

必需。菜单选项列表。

OverflowMenuItem

用户可以在菜单中调用的选项。

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

字段
start_icon

Icon

显示在文本前面的图标。

text

string

必需。用于向用户标识或描述项的文本。

on_click

OnClick

必需。选择菜单选项时调用的操作。此 OnClick 不能包含 OverflowMenu,系统会舍弃任何指定的 OverflowMenu 并停用菜单项。

disabled

bool

菜单选项是否已停用。默认值为 false。

SelectionInput

用于创建用户可选择的一个或多个界面项的 widget。例如,下拉菜单或复选框。您可以使用此微件收集可预测或枚举的数据。如需查看 Google Chat 应用中的示例,请参阅添加可选择的界面元素

聊天应用可以处理用户选择或输入的项的值。如需详细了解如何使用表单输入,请参阅接收表单数据

如需从用户收集未定义或抽象数据,请使用 TextInput widget。

适用于 Google Chat 应用和 Google Workspace 插件。

字段
name

string

必需。用于标识表单输入事件中的选择输入的名称。

如需详细了解如何使用表单输入,请参阅接收表单数据

label

string

界面中选择输入字段上方显示的文本。

指定有助于用户输入应用所需信息的文字。例如,如果用户要从下拉菜单中选择工单的紧急程度,则标签可能为“紧急程度”或“选择紧急程度”。

type

SelectionType

SelectionInput 微件中向用户显示的项的类型。选择类型支持不同类型的互动。例如,用户可以选择一个或多个复选框,但只能从下拉菜单中选择一个值。

items[]

SelectionItem

可选项的数组。例如,单选按钮或复选框的数组。最多支持 100 项内容。

on_change_action

Action

如果已指定,则在选择发生变化时提交表单。如果未指定,则必须指定单独用于提交表单的按钮。

如需详细了解如何使用表单输入,请参阅接收表单数据

multi_select_max_selected_items

int32

对于多选菜单,表示用户可选择的项数上限。最小值为 1 件。如果未指定,则默认为 3 项。

multi_select_min_query_length

int32

对于多选菜单,表示用户在菜单返回建议的选择项之前输入的文本字符数。

如果未设置,多选菜单将使用以下默认值:

  • 如果菜单使用 SelectionInput 项的静态数组,则默认为 0 个字符,并立即从数组中填充项。
  • 如果菜单使用动态数据源 (multi_select_data_source),则默认为 3 个字符,在查询数据源以返回建议内容之前。
validation

Validation

对于下拉菜单,此选择输入字段的验证。

适用于 Google Chat 应用和 Google Workspace 插件。

联合字段 multi_select_data_source。对于多选菜单,是一个用于动态填充选择项的数据源。

适用于 Google Chat 应用,不适用于 Google Workspace 插件。multi_select_data_source 只能是下列其中一项:

external_data_source

Action

外部数据源,例如关系型数据库。

platform_data_source

PlatformDataSource

Google Workspace 中的数据源。

PlatformDataSource

对于使用多选菜单的 SelectionInput 微件,请使用 Google Workspace 中的数据源。用于填充多选菜单中的项。

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

字段
联合字段 data_source。数据源。data_source 只能是下列其中一项:
common_data_source

CommonDataSource

所有 Google Workspace 应用共享的数据源,例如 Google Workspace 组织中的用户。

host_app_data_source

HostAppDataSourceMarkup

一个仅适用于 Google Workspace 托管应用(例如 Google Chat 中的聊天室)的数据源。

此字段支持 Google API 客户端库,但不适用于 Cloud 客户端库。如需了解详情,请参阅安装客户端库

CommonDataSource

所有 Google Workspace 应用共享的数据源。

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

枚举
UNKNOWN 默认值。请勿使用。
USER Google Workspace 用户。用户只能查看和选择其 Google Workspace 组织中的用户。

SelectionItem

用户可以在选择输入中选择的项,例如复选框或开关。最多支持 100 项内容。

适用于 Google Chat 应用和 Google Workspace 插件。

字段
text

string

用于向用户标识或描述项的文本。

value

string

与此项关联的值。客户端应将其用作表单输入值。

如需详细了解如何使用表单输入,请参阅接收表单数据

selected

bool

相应项是否默认处于选中状态。如果选择输入项仅接受一个值(例如单选按钮或下拉菜单),请仅为一个项设置此字段。

start_icon_uri

string

对于多选菜单,是显示在项的 text 字段旁边的图标的网址。支持 PNG 和 JPEG 文件。必须是 HTTPS 网址。例如 https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png

bottom_text

string

对于多选菜单,是显示在项的 text 字段下方的文本说明或标签。

SelectionType

用户可选择的项的格式。不同的选项支持不同的互动类型。例如,用户可以选择多个复选框,但只能从下拉菜单中选择一项。

每个选择输入都支持一种选择类型。例如,不支持混合使用复选框和开关。

适用于 Google Chat 应用和 Google Workspace 插件。

枚举
CHECK_BOX 一组复选框。用户可以选中一个或多个复选框。
RADIO_BUTTON 一组单选按钮。用户可以选择一个单选按钮。
SWITCH 一组开关。用户可以开启一个或多个开关。
DROPDOWN 下拉菜单。用户可以从菜单中选择一个项目。
MULTI_SELECT

包含文本框的菜单。用户可以输入内容并选择一项或多项。

对于 Google Workspace 插件,您必须使用 SelectionItem 对象的静态数组填充项。

对于 Google Chat 应用,您还可以使用动态数据源填充项,并在用户在菜单中输入内容时自动建议项。例如,用户可以开始输入 Google Chat 聊天室的名称,然后该 widget 会自动建议该聊天室。如需为多选菜单动态填充项,请使用以下某种类型的数据源:

  • Google Workspace 数据:系统会使用 Google Workspace 中的数据(例如 Google Workspace 用户或 Google Chat 聊天室)填充内容。
  • 外部数据:项目是从 Google Workspace 之外的外部数据源填充的。

如需查看如何为 Chat 应用实现多选菜单的示例,请参阅添加多选菜单

适用于 Google Chat 应用和 Google Workspace 插件。

建议

用户可以输入的建议值。当用户点击文本输入字段时,系统会显示这些值。用户输入内容时,系统会动态过滤建议的值,以匹配用户输入的内容。

例如,用于输入编程语言的文本字段可能会建议 Java、JavaScript、Python 和 C++。当用户开始输入 Jav 时,建议列表会过滤为显示 JavaJavaScript

建议值有助于引导用户输入您的应用可以理解的值。在提及 JavaScript 时,有些用户可能会输入 javascript,而有些用户可能会输入 java script。建议使用 JavaScript 可以规范用户与应用的互动方式。

指定后,TextInput.type 始终为 SINGLE_LINE,即使将其设置为 MULTIPLE_LINE 也是如此。

适用于 Google Chat 应用和 Google Workspace 插件。

字段
items[]

SuggestionItem

用于在文本输入字段中提供自动补全建议的建议列表。

SuggestionItem

用户可以在文本输入字段中输入的一个建议值。

适用于 Google Chat 应用和 Google Workspace 插件。

字段

联合字段 content

content 只能是下列其中一项:

text

string

文本输入字段的建议输入值。这相当于用户自行输入的内容。

TextInput

供用户输入文本的字段。支持建议和更改时执行的操作。如需查看 Google Chat 应用中的示例,请参阅添加供用户输入文本的字段

聊天应用会在表单输入事件期间接收并处理输入文本的值。如需详细了解如何使用表单输入,请参阅接收表单数据

当您需要从用户收集未定义或抽象数据时,请使用文本输入。如需从用户收集已定义或已枚举的数据,请使用 SelectionInput 微件。

适用于 Google Chat 应用和 Google Workspace 插件。

字段
name

string

在表单输入事件中用于标识文本输入的名称。

如需详细了解如何使用表单输入,请参阅接收表单数据

label

string

界面中文本输入字段上方显示的文字。

指定有助于用户输入应用所需信息的文字。例如,如果您要询问某人的姓名,但需要知道对方的姓氏,请写 surname,而不是 name

如果未指定 hintText,则必须提供此值。否则,可选。

hint_text

string

显示在文本输入字段下方的文本,用于提示用户输入特定值,从而帮助用户。此文本始终可见。

如果未指定 label,则必须提供此值。否则,可选。

value

string

用户输入的值,作为表单输入事件的一部分返回。

如需详细了解如何使用表单输入,请参阅接收表单数据

type

Type

文本输入字段在界面中的显示方式。例如,字段是单行还是多行。

on_change_action

Action

当文本输入字段发生更改时,应执行的操作。例如,用户在字段中添加或删除文本。

可执行的操作示例包括在 Google Chat 中运行自定义函数或打开对话框

initial_suggestions

Suggestions

用户可以输入的建议值。当用户点击文本输入字段时,系统会显示这些值。用户输入内容时,系统会动态过滤建议的值,以匹配用户输入的内容。

例如,用于输入编程语言的文本输入字段可能会建议 Java、JavaScript、Python 和 C++。当用户开始输入 Jav 时,建议列表会过滤为仅显示 JavaJavaScript

建议值有助于引导用户输入您的应用可以理解的值。在提及 JavaScript 时,有些用户可能会输入 javascript,而有些用户可能会输入 java script。建议使用 JavaScript 可以规范用户与应用的互动方式。

指定后,TextInput.type 始终为 SINGLE_LINE,即使将其设置为 MULTIPLE_LINE 也是如此。

适用于 Google Chat 应用和 Google Workspace 插件。

auto_complete_action

Action

可选。指定当文本输入字段向与其互动的用户提供建议时要执行的操作。

如果未指定,则建议由 initialSuggestions 设置并由客户端处理。

如果指定,应用会执行此处指定的操作,例如运行自定义函数。

适用于 Google Workspace 插件,不适用于 Google Chat 应用。

validation

Validation

指定此文本输入字段所需的验证。

适用于 Google Chat 应用和 Google Workspace 插件。

placeholder_text

string

文本输入字段为空时显示的文本。使用此文本提示用户输入值。例如 Enter a number from 0 to 100

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

类型

文本输入字段在界面中的显示方式。例如,它是单行输入字段还是多行输入。如果指定了 initialSuggestions,则 type 始终为 SINGLE_LINE,即使将其设置为 MULTIPLE_LINE 也是如此。

适用于 Google Chat 应用和 Google Workspace 插件。

枚举
SINGLE_LINE 文本输入字段的高度固定为 1 行。
MULTIPLE_LINE 文本输入字段的高度固定为多行。

TextParagraph

支持格式的文本段落。如需查看 Google Chat 应用中的示例,请参阅添加一段格式设置的文本。如需详细了解如何设置文本格式,请参阅在 Google Chat 应用中设置文本格式在 Google Workspace 插件中设置文本格式

适用于 Google Chat 应用和 Google Workspace 插件。

字段
text

string

微件中显示的文本。

max_lines

int32

在 widget 中显示的文本行数上限。如果文本超过指定的行数上限,则多余的内容会隐藏在展开按钮后面。如果文本等于或短于指定的行数上限,系统不会显示展开按钮。

默认值为 0,在这种情况下,系统会显示所有上下文。系统会忽略负值。适用于 Google Chat 应用,不适用于 Google Workspace 插件。

验证

表示验证其所附加的 widget 所需的数据。

适用于 Google Chat 应用和 Google Workspace 插件。

字段
character_limit

int32

指定文本输入 widget 的字符数限制。请注意,此属性仅用于文本输入,其他 widget 会忽略此属性。

适用于 Google Chat 应用和 Google Workspace 插件。

input_type

InputType

指定输入 widget 的类型。

适用于 Google Chat 应用和 Google Workspace 插件。

InputType

输入 widget 的类型。

枚举
INPUT_TYPE_UNSPECIFIED 未指定类型。请勿使用。
TEXT 接受所有字符的常规文本。
INTEGER 整数值。
FLOAT 浮点值。
EMAIL 电子邮件地址。
EMOJI_PICKER 从系统提供的表情符号选择器中选择的表情符号。

微件

每张卡片都由微件组成。

widget 是一种复合对象,可以表示文本、图片、按钮和其他对象类型之一。

字段
horizontal_alignment

HorizontalAlignment

指定 widget 是沿列的左侧、右侧还是中间对齐。

联合字段 data。一个 widget 只能包含以下各项之一。您可以使用多个 widget 字段来显示更多项。data 只能是下列其中一项:
text_paragraph

TextParagraph

显示文本段落。支持简单的 HTML 格式文本。如需详细了解如何设置文本格式,请参阅在 Google Chat 应用中设置文本格式在 Google Workspace 插件中设置文本格式

例如,以下 JSON 会创建粗体文本:

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

Image

显示图片。

例如,以下 JSON 会创建带替代文本的图片:

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

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"
  }
}
button_list

ButtonList

按钮列表。

例如,以下 JSON 会创建两个按钮。第一种是蓝色的文本按钮,第二种是用于打开链接的图片按钮:

"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"
        }
      }
    }
  ]
}
text_input

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"
      }
    ]
  }
}
selection_input

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
    }
  ]
}
date_time_picker

DateTimePicker

显示一个微件,供用户输入日期、时间或日期和时间。

例如,以下 JSON 会创建一个日期时间选择器来安排预约:

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

Divider

在微件之间显示水平线分隔符。

例如,以下 JSON 会创建一个分隔符:

"divider": {
}
grid

Grid

显示包含一组项的网格。

网格支持任意数量的列和项。行数由项数上限除以列数决定。一个包含 10 项和 2 列的网格有 5 行。一个包含 11 项和 2 列的网格有 6 行。

适用于 Google Chat 应用和 Google Workspace 插件。

例如,以下 JSON 会创建一个包含单个项的 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

Columns

最多显示 2 列。

如需添加超过 2 列或使用行,请使用 Grid widget。

例如,以下 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"
          }
        }
      ]
    }
  ]
}
carousel

Carousel

轮播界面包含一系列嵌套的微件。例如,以下是包含两个文本段落的轮播界面的 JSON 表示法。

{
  "widgets": [
    {
      "textParagraph": {
        "text": "First text paragraph in the carousel."
      }
    },
    {
      "textParagraph": {
        "text": "Second text paragraph in the carousel."
      }
    }
  ]
}
chip_list

ChipList

条状标签列表。

例如,以下 JSON 会创建两个条状标签。第一个是文本条状标签,第二个是用于打开链接的图标条状标签:

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

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

HorizontalAlignment

指定 widget 是沿列的左侧、右侧还是中间对齐。

适用于 Google Chat 应用,不适用于 Google Workspace 插件。

枚举
HORIZONTAL_ALIGNMENT_UNSPECIFIED 请勿使用。未指定。
START 默认值。将 widget 对齐到列的起始位置。对于从左到右的布局,请对齐到左侧。对于从右到左的布局,请靠右对齐。
CENTER 将微件对齐到列的中心。
END 将 widget 对齐到列的末尾位置。对于从左到右的布局,将微件对齐到右侧。对于从右到左的布局,将微件对齐到左侧。

ImageType

用于剪裁图片的形状。

适用于 Google Chat 应用和 Google Workspace 插件。

枚举
SQUARE 默认值。向图片应用方形蒙版。例如,4x3 图片会变成 3x3。
CIRCLE 对图片应用圆形蒙版。例如,4x3 图片会变成直径为 3 的圆形。