Card

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

卡片支持定义的布局、按钮等互动式界面元素以及图片等富媒体。使用卡片呈现详细信息、收集用户信息,并引导用户执行下一步操作。

使用卡片构建器设计和预览卡片。

打开卡片构建器

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

注意:每个卡片最多可添加 100 个微件。如果某个版块的小组件导致总数超过 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"
                             }
                           ]
                         }
                       }
                     }
                   ]
                 }
               }
             ]
           }
         ]
       }
    }
  ]
}
JSON 表示法
{
  "header": {
    object (CardHeader)
  },
  "sections": [
    {
      object (Section)
    }
  ],
  "sectionDividerStyle": enum (DividerStyle),
  "cardActions": [
    {
      object (CardAction)
    }
  ],
  "name": string,
  "fixedFooter": {
    object (CardFixedFooter)
  },
  "displayStyle": enum (DisplayStyle),
  "peekCardHeader": {
    object (CardHeader)
  },
  "expressionData": [
    {
      object (ExpressionData)
    }
  ]
}
字段
header

object (CardHeader)

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

sections[]

object (Section)

包含 widget 集合。每个部分都有自己的可选标头。各部分之间通过分隔线进行视觉分隔。如需查看 Google Chat 应用中的示例,请参阅定义卡片的版块。

sectionDividerStyle

enum (DividerStyle)

页眉、各部分和页脚之间的分隔线样式。

cardActions[]

object (CardAction)

卡片的操作。操作会添加到卡片的工具栏菜单中。最多支持 10 个 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

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

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

displayStyle

enum (DisplayStyle)

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

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

peekCardHeader

object (CardHeader)

显示情境内容时,资讯卡预览标题会充当占位符,以便用户在首页资讯卡和情境资讯卡之间向前导航。

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

expressionData[]

object (ExpressionData)

卡片的表达式数据。

适用于扩展 Google Workspace Studio 的 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

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

subtitle

string

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

imageType

enum (ImageType)

用于剪裁图片的形状。

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

imageUrl

string

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

imageAltText

string

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

部分

一个部分包含一系列微件,这些微件会按照指定的顺序垂直呈现。

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

JSON 表示法
{
  "header": string,
  "widgets": [
    {
      object (Widget)
    }
  ],
  "collapsible": boolean,
  "uncollapsibleWidgetsCount": integer,
  "id": string,
  "collapseControl": {
    object (CollapseControl)
  }
}
字段
header

string

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

widgets[]

object (Widget)

该部分中的所有 widget。必须包含至少一个 widget。一张卡片的所有部分最多可支持 100 个微件。

collapsible

boolean

指明此部分是否可收起。

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

如需确定哪些 widget 处于隐藏状态,请指定 uncollapsibleWidgetsCount。

uncollapsibleWidgetsCount

integer

即使在版块收起时也保持可见的不可收起微件的数量。

例如,如果某个部分包含五个 widget,并且 uncollapsibleWidgetsCount 设置为 2,则前两个 widget 始终会显示,后三个 widget 默认会收起。仅当 collapsible 为 true 时,系统才会考虑 uncollapsibleWidgetsCount。

id

string

分配给相应部分的唯一 ID,用于标识要更改的部分。ID 的字符数限制为 64 个字符,且应采用 [a-zA-Z0-9-]+ 格式。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

collapseControl

object (CollapseControl)

可选。定义该部分的展开和收起按钮。仅当相应部分可收起时,系统才会显示此按钮。如果未设置此字段,则使用默认按钮。

widget

每张卡片都由微件组成。

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

JSON 表示法
{
  "horizontalAlignment": enum (HorizontalAlignment),
  "id": string,
  "visibility": enum (Visibility),
  "eventActions": [
    {
      object (EventAction)
    }
  ],

  "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)
  },
  "carousel": {
    object (Carousel)
  },
  "chipList": {
    object (ChipList)
  }
}
字段
horizontalAlignment

enum (HorizontalAlignment)

指定微件是靠左、靠右还是居中对齐。

id

string

分配给 widget 的唯一 ID,用于标识要更改的 widget。ID 的字符数限制为 64 个字符,且应采用 [a-zA-Z0-9-]+ 格式。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

visibility

enum (Visibility)

指定 widget 是可见还是隐藏。默认值为 VISIBLE。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

eventActions[]

object (EventAction)

指定可对微件执行的事件操作。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

一个微件只能包含以下其中一项。您可以使用多个微件字段来显示更多内容。以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:
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 会创建一个显示电子邮件地址的修饰文本 widget:

"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 会创建两个按钮。第一个是蓝色文本按钮,第二个是可打开链接的图片按钮:

"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 会创建一个包含单个项的 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 列。

如需添加 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

object (Carousel)

包含 CarouselCard 项的集合,其中每项都包含嵌套 widget。例如,以下是一个轮播界面的 JSON 表示法,其中包含两张轮播卡片,每张卡片都包含一个文本段落:

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

object (ChipList)

条状标签列表。

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

"chipList": {
  "chips": [
    {
      "label": "Edit",
      "disabled": true
    },
    {
      "icon": {
        "knownIcon": "INVITE",
        "altText": "check calendar"
      },
      "onClick": {
        "openLink": {
          "url": "https://example.com/calendar"
        }
      }
    }
  ]
}
互斥字段结束。

TextParagraph

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

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

JSON 表示法
{
  "text": string,
  "maxLines": integer,
  "textSyntax": enum (TextSyntax)
}
字段
text

string

微件中显示的文本。

maxLines

integer

微件中显示的文本行数上限。如果文本超过指定的行数上限,多出的内容会隐藏在展开按钮后面。如果文本长度等于或短于指定的行数上限,则不会显示显示更多按钮。

默认值为 0,在这种情况下,系统会显示所有上下文。系统会忽略负值。

textSyntax

enum (TextSyntax)

文本的语法。如果未设置,文本将呈现为 HTML。

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

TextSyntax

用于设置文本格式的语法。

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

枚举
TEXT_SYNTAX_UNSPECIFIED 如果未指定,文本将呈现为 HTML。
HTML 文本会呈现为 HTML。这是默认值。
MARKDOWN 文本会呈现为 Markdown 格式。

映像

由网址指定且可以具有 onClick 操作的图片。如需查看示例,请参阅添加图片。

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

JSON 表示法
{
  "imageUrl": string,
  "onClick": {
    object (OnClick)
  },
  "altText": string
}
字段
imageUrl

string

托管图片的 HTTPS 网址。

例如:

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

object (OnClick)

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

altText

string

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

DecoratedText

一种微件,用于显示文本以及可选的修饰,例如文本上方或下方的标签、文本前面的图标、选择微件或文本后面的按钮。如需查看 Google Chat 应用中的示例,请参阅显示带有修饰性文本的文本。

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

JSON 表示法
{
  "icon": {
    object (Icon)
  },
  "startIcon": {
    object (Icon)
  },
  "startIconVerticalAlignment": enum (VerticalAlignment),
  "topLabel": string,
  "topLabelText": {
    object (TextParagraph)
  },
  "text": string,
  "contentText": {
    object (TextParagraph)
  },
  "wrapText": boolean,
  "bottomLabel": string,
  "bottomLabelText": {
    object (TextParagraph)
  },
  "onClick": {
    object (OnClick)
  },

  "button": {
    object (Button)
  },
  "switchControl": {
    object (SwitchControl)
  },
  "endIcon": {
    object (Icon)
  }
}
字段
icon
(deprecated)

object (Icon)

已弃用,取而代之的是 startIcon。

startIcon

object (Icon)

文本前面显示的图标。

startIconVerticalAlignment

enum (VerticalAlignment)

可选。开始图标的垂直对齐方式。如果未设置,图标将垂直居中。

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

topLabel

string

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

topLabelText

object (TextParagraph)

TextParagraph 相当于 topLabel。始终截断。支持比 topLabel 更复杂的格式。

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

text

string

必需。主要文本。

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

contentText

object (TextParagraph)

TextParagraph 相当于 text。支持比 text 更复杂的格式。

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

wrapText

boolean

文字环绕设置。如果为 true,文本会换行并显示在多行中。否则,文本会被截断。

仅适用于 text,不适用于 topLabel 和 bottomLabel。

bottomLabel

string

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

bottomLabelText

object (TextParagraph)

TextParagraph 相当于 bottomLabel。始终换行。支持比 bottomLabel 更复杂的格式。

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

onClick

object (OnClick)

当用户点击 DecoratedText widget 上的任意位置(包括 text、topLabel、bottomLabel 和图标)时,都会触发此操作,但点击单独的互动控件(button 或 switchControl)时除外。

decoratedText widget 中显示在文本右侧的按钮、开关、复选框或图片。以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:
button

object (Button)

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

switchControl

object (SwitchControl)

用户可以点击切换开关微件来更改其状态并触发操作。

endIcon

object (Icon)

文本后显示的图标。

支持内置和自定义图标。

互斥字段结束。

VerticalAlignment

表示垂直对齐属性。

枚举
VERTICAL_ALIGNMENT_UNSPECIFIED 未指定类型。请勿使用。
TOP 对齐到顶部位置。
MIDDLE 对齐到中间位置。
BOTTOM 对齐到底部位置。

开关控制

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

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

仅在 decoratedText widget 中受支持。

JSON 表示法
{
  "name": string,
  "value": string,
  "selected": boolean,
  "onChangeAction": {
    object (Action)
  },
  "controlType": enum (ControlType)
}
字段
name

string

在表单输入事件中用于标识切换开关 widget 的名称(作为 CommonEventObject.form_inputs 中的键)。

如需详细了解如何处理表单输入,请参阅接收表单数据。

value

string

选择开关后在 CommonEventObject.form_inputs[name].string_inputs 中返回的值(selected 为 true)。如果 selected 为 true 且 value 未设置,则在 stringInputs.value 中返回空字符串 ("")。当 selected 为 false 时,此值会从 stringInputs.value 中省略。

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

selected

boolean

当 true 时,开关处于选中状态,其 value 包含在 CommonEventObject.form_inputs[name].string_inputs.value 中。

onChangeAction

object (Action)

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

controlType

enum (ControlType)

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

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

ControlType

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

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

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

TextInput

用户可在其中输入文本的字段。支持建议和更改时操作。支持表单提交验证。如果 Action.all_widgets_are_required 设置为 true,或者此 widget 在 Action.required_widgets 中指定,则除非输入值,否则提交操作会被阻止。如需查看 Google Chat 应用中的示例,请参阅添加可供用户输入文本的字段。

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

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

适用于 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,

  "hostAppDataSource": {
    object (HostAppDataSourceMarkup)
  }
}
字段
name

string

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

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

label

string

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

指定可帮助用户输入应用所需信息的文本。例如,如果您要询问某人的姓名,但特别需要其姓氏,请写 surname,而不是 name。

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

hintText

string

显示在文本输入字段下方的文本,旨在通过提示用户输入特定值来协助用户。此文本始终可见。

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

value

string

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

如需详细了解如何处理表单输入,请参阅接收表单数据。

type

enum (Type)

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

onChangeAction

object (Action)

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

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

initialSuggestions

object (Suggestions)

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

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

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

指定后,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 插件。

以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:
hostAppDataSource

object (HostAppDataSourceMarkup)

Google Workspace 托管应用独有的数据源,例如 Gmail 邮件、Google 日历活动或 Google Chat 聊天消息。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

互斥字段结束。

类型

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

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

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

RenderActions

一组渲染指令,用于指示卡片执行某项操作,或指示插件宿主应用或 Chat 应用执行特定于应用的操作。

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

字段
action

Action

操作

字段
navigations[]

Navigation

推送、弹出或更新卡片。

Google Chat 中的插件。

向堆栈中添加新卡片(向前导航)。对于 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

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

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

JSON 表示法
{

  "text": string
}
字段
以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:
text

string

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

互斥字段结束。

验证

表示用于验证其所附加到的 widget 的必要数据。

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

JSON 表示法
{
  "characterLimit": integer,
  "inputType": enum (InputType)
}
字段
characterLimit

integer

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

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

inputType

enum (InputType)

指定输入 widget 的类型。

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

InputType

输入 widget 的类型。

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

HostAppDataSourceMarkup

来自 Google Workspace 应用的数据源。数据源会为 widget 填充可用项。

JSON 表示法
{

  "chatDataSource": {
    object (ChatClientDataSourceMarkup)
  },
  "workflowDataSource": {
    object (WorkflowDataSourceMarkup)
  }
}
字段
用于填充微件可用内容的 Google Workspace 应用。以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:
chatDataSource

object (ChatClientDataSourceMarkup)

Google Chat 中的数据源。

workflowDataSource

object (WorkflowDataSourceMarkup)

来自 Google Workflow 的数据源。

互斥字段结束。

ChatClientDataSourceMarkup

对于使用多选菜单的 SelectionInput widget,数据源来自 Google Chat。数据源会为多选菜单填充选择项。例如,用户可以选择自己所属的 Google Chat 聊天室。

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

JSON 表示法
{

  "spaceDataSource": {
    object (SpaceDataSource)
  }
}
字段
Google Chat 数据源。以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:
spaceDataSource

object (SpaceDataSource)

用户所属的 Google Chat 聊天室。

互斥字段结束。

SpaceDataSource

一个数据源,用于将 Google Chat 聊天室填充为多选菜单的选择项。仅填充用户所属的聊天室。

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

JSON 表示法
{
  "defaultToCurrentSpace": boolean
}
字段
defaultToCurrentSpace

boolean

如果设置为 true,多选菜单会默认选择当前的 Google Chat 聊天室作为一项。

WorkflowDataSourceMarkup

* 仅受 Google Workspace 工作流支持,不受 Google Chat 应用或 Google Workspace 插件支持。

在 MULTI_SELECT 类型的 TextInput 或 SelectionInput widget 或 DateTimePicker 中,提供来自 Google 的数据源。

JSON 表示法
{
  "includeVariables": boolean,
  "type": enum (Type)
}
字段
includeVariables

boolean

是否在数据源中包含上一步中的变量。

type

enum (Type)

数据源的类型。

类型

一个枚举,表示工作流数据源的类型。

枚举
UNKNOWN 默认值。请勿使用。
USER Google Workspace 用户。用户只能查看和选择其 Google Workspace 组织中的用户。
SPACE 用户所属的 Google Chat 聊天室。
USER_WITH_FREE_FORM 用户可以选择查看并选择其 Google Workspace 组织中的现有成员,也可以手动输入邮箱或有效网域。

SelectionInput

一种微件,可创建一个或多个供用户选择的界面项。仅支持对 dropdown 和 multiselect 菜单进行表单提交验证。如果 Action.all_widgets_are_required 设置为 true,或者此 widget 在 Action.required_widgets 中指定,则除非选择了值,否则提交操作会被阻止。例如,下拉菜单或复选框。您可以使用此 widget 收集可预测或枚举的数据。如需查看 Google Chat 应用中的示例,请参阅添加可选择的界面元素。

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

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

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

JSON 表示法
{
  "name": string,
  "label": string,
  "type": enum (SelectionType),
  "items": [
    {
      object (SelectionItem)
    }
  ],
  "onChangeAction": {
    object (Action)
  },
  "multiSelectMinQueryLength": integer,
  "dataSourceConfigs": [
    {
      object (DataSourceConfig)
    }
  ],
  "multiSelectMaxSelectedItems": integer,
  "hintText": string,

  "externalDataSource": {
    object (Action)
  },
  "platformDataSource": {
    object (PlatformDataSource)
  }
}
字段
name

string

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

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

label

string

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

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

type

enum (SelectionType)

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

items[]

object (SelectionItem)

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

onChangeAction

object (Action)

如果指定了此属性,则在所选内容发生变化时,系统会提交表单。如果未指定,您必须指定一个单独的按钮来提交表单。

如需详细了解如何处理表单输入,请参阅接收表单数据。

multiSelectMinQueryLength

integer

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

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

  • 如果菜单使用 SelectionInput 项的静态数组,则默认为 0 个字符,并立即从数组中填充项。
  • 如果菜单使用动态数据源 (multi_select_data_source),则默认情况下,用户需要输入 3 个字符,系统才会查询数据源并返回建议的选项。
dataSourceConfigs[]

object (DataSourceConfig)

可选。选择控件的数据源配置。此字段可让您更精细地控制数据源。

如果指定,则系统会忽略 multiSelectMaxSelectedItems 字段、multiSelectMinQueryLength 字段、externalDataSource 字段和 platformDataSource 字段。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。

适用于 Google Chat 应用中的 Dropdown widget。对于 Google Chat 应用中的 Dropdown widget,仅支持一个 DataSourceConfig。如果设置了多个 DataSourceConfig,则系统仅会使用第一个。

multiSelectMaxSelectedItems

integer

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

hintText

string

可选。显示在选择输入字段下方的文本,旨在通过提示用户输入特定值来帮助用户。此文本始终可见。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

对于多选菜单,指动态填充选择项的数据源。

适用于 Google Chat 应用,不适用于 Google Workspace 插件。以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:

externalDataSource

object (Action)

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

platformDataSource

object (PlatformDataSource)

Google Workspace 中的数据源。

互斥字段结束。

SelectionType

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

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

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

枚举
CHECK_BOX 一组复选框。用户可以选择一个或多个复选框。
RADIO_BUTTON 一组单选按钮。用户可以选择一个单选按钮。
SWITCH 一组开关。用户可以开启一个或多个开关。
DROPDOWN

下拉菜单。用户可以从菜单中选择一项。

对于 Google Chat 应用,您可以使用动态数据源填充选项,并在用户在菜单中输入内容时自动推荐选项。例如,用户可以开始输入 Google Chat 聊天室的名称,该微件会自动建议聊天室。如需为下拉菜单动态填充内容,请使用以下类型的数据源之一:

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

如需查看如何为 Chat 应用实现下拉菜单的示例,请参阅添加下拉菜单和动态填充下拉菜单。

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

MULTI_SELECT

一个包含文本框的菜单。用户可以输入并选择一项或多项。对于 Google Workspace 插件,您必须使用 SelectionItem 对象的静态数组填充内容。

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

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

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

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

PlatformDataSource

对于使用多选菜单的 SelectionInput widget,数据源来自 Google Workspace。用于填充多选菜单中的选项。

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

JSON 表示法
{

  "commonDataSource": enum (CommonDataSource),
  "hostAppDataSource": {
    object (HostAppDataSourceMarkup)
  }
}
字段
数据源。以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:
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 组织中的用户。

DataSourceConfig

一个配置对象,可帮助为 widget 配置数据源。

适用于扩展 Google Workspace Studio 的 Google Chat 应用和 Google Workspace 插件。

JSON 表示法
{

  "remoteDataSource": {
    object (Action)
  },
  "platformDataSource": {
    object (PlatformDataSource)
  }
  "minCharactersTrigger": integer
}
字段
数据源。以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:
remoteDataSource

object (Action)

数据来自远程数据提供程序。

platformDataSource

object (PlatformDataSource)

数据来自 Google Workspace 应用。

互斥字段结束。
minCharactersTrigger

integer

用户必须输入的字符数下限,达到该下限后,系统才会触发此数据提供程序(即开始返回结果)。

DateTimePicker

让用户可以输入日期、时间或日期和时间。支持表单提交验证。如果 Action.all_widgets_are_required 设置为 true,或者此 widget 在 Action.required_widgets 中指定,则除非选择了值,否则提交操作会被阻止。如需查看 Google Chat 应用中的示例,请参阅让用户选择日期和时间。

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

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

JSON 表示法
{
  "name": string,
  "label": string,
  "type": enum (DateTimePickerType),
  "valueMsEpoch": string,
  "timezoneOffsetDate": integer,
  "onChangeAction": {
    object (Action)
  },

  "hostAppDataSource": {
    object (HostAppDataSourceMarkup)
  }
}
字段
name

string

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

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

label

string

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

type

enum (DateTimePickerType)

该 widget 是否支持输入日期、时间或日期和时间。

valueMsEpoch

string (int64 format)

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

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

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

integer

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

注意:此字段以分钟为单位,而用户互动事件载荷通常以毫秒为单位提供时区偏移量(除以 60000 即可转换)。

onChangeAction

object (Action)

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

指定用于表示日期和时间的数据源。以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:
hostAppDataSource

object (HostAppDataSourceMarkup)

Google Workspace 托管应用独有的数据源,例如 Gmail 邮件、Google 日历活动或 Google Chat 聊天消息。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

互斥字段结束。

DateTimePickerType

DateTimePicker 微件中日期和时间的格式。确定用户可以输入日期、时间,还是同时输入日期和时间。

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

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

隔离设施

此类型没有字段。

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

适用于 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"
    }
  }
}
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)

每个网格项都会重复使用此回调,但会将该项的标识符添加到回调的参数中(在键 "grid_item_identifier" 下)。

GridItem

表示网格布局中的一项。内容可以包含文字、图片,或同时包含文字和图片。

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

JSON 表示法
{
  "id": string,
  "image": {
    object (ImageComponent)
  },
  "title": string,
  "subtitle": string,
  "layout": enum (GridItemLayout)
}
字段
id

string

此网格项的用户指定标识符。此标识符会在父级网格的 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

图片网址。

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 字段指定值。该值必须是介于 0 和 1 之间的浮点数(基于 RGB 颜色值),其中 0 (0/255) 表示没有颜色,1 (255/255) 表示颜色的最大强度。

例如,以下代码会将颜色设置为红色,并将其强度设置为最大:

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

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

cornerRadius

integer

边框的圆角半径。

BorderType

表示应用于 widget 的边框类型。

适用于 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 widget 最多可在卡片或对话框中显示 2 列。您可以向每列添加 widget;widget 会按照指定的顺序显示。如需查看 Google Chat 应用中的示例,请参阅在列中显示卡片和对话框。

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

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

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

如需添加两列以上或使用行,请使用 Grid widget。

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

  • 用户从电子邮件草稿中打开插件时显示的对话框。
  • 用户从 Google 日历活动中的添加附件菜单打开插件时显示的对话框。
JSON 表示法
{
  "columnItems": [
    {
      object (Column)
    }
  ]
}
字段
columnItems[]

object (Column)

列数组。卡片或对话框中最多可以包含 2 列。

列

一列。

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)

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

HorizontalSizeStyle

指定列如何填充卡片的宽度。每列的宽度取决于 HorizontalSizeStyle 以及列内 widget 的宽度。

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 默认值。将 widget 与列的起始位置对齐。对于从左到右的布局,向左对齐。对于从右到左的布局,则向右对齐。
CENTER 将 widget 与列的中心对齐。
END 将 widget 与列的结束位置对齐。对于从左到右的布局,将微件向右对齐。对于从右到左的布局,将微件向左对齐。

VerticalAlignment

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

Google Workspace 插件和 Chat 应用

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

微件

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

Google Workspace 插件和 Chat 应用

JSON 表示法
{

  "textParagraph": {
    object (TextParagraph)
  },
  "image": {
    object (Image)
  },
  "decoratedText": {
    object (DecoratedText)
  },
  "buttonList": {
    object (ButtonList)
  },
  "textInput": {
    object (TextInput)
  },
  "selectionInput": {
    object (SelectionInput)
  },
  "dateTimePicker": {
    object (DateTimePicker)
  },
  "chipList": {
    object (ChipList)
  }
}
字段
以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:
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微件。

互斥字段结束。

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)

图标图片。如果同时设置了 icon 和 label,则图标会显示在标签前面。

label

string

条状标签内显示的文本。

onClick

object (OnClick)

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

enabled
(deprecated)

boolean

已弃用:请改用 disabled。

条状标签是否处于活跃状态并响应用户操作。

disabled

boolean

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

altText

string

用于无障碍功能的替代文本。

设置描述性文字,让用户了解条状标签的作用。例如,如果某个条状标签会打开超链接,请写下:“打开新的浏览器标签页,并前往 Google Chat 开发者文档,网址为 https://developers.google.com/workspace/chat"。

CarouselCard

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

JSON 表示法
{
  "widgets": [
    {
      object (NestedWidget)
    }
  ],
  "footerWidgets": [
    {
      object (NestedWidget)
    }
  ]
}
字段
widgets[]

object (NestedWidget)

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

footerWidgets[]

object (NestedWidget)

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

NestedWidget

可在包含布局(例如 CarouselCard)中显示的一系列 widget。 适用于 Google Chat 应用,不适用于 Google Workspace 插件。

JSON 表示法
{

  "textParagraph": {
    object (TextParagraph)
  },
  "buttonList": {
    object (ButtonList)
  },
  "image": {
    object (Image)
  }
}
字段
以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:
textParagraph

object (TextParagraph)

文本段落 widget。

buttonList

object (ButtonList)

按钮列表 widget。

image

object (Image)

图片微件。

互斥字段结束。

公开范围

指定界面元素是可见还是隐藏。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

枚举
VISIBILITY_UNSPECIFIED 未指定可见性。请勿使用。
VISIBLE 界面元素可见。
HIDDEN 界面元素处于隐藏状态。

EventAction

表示可对界面元素执行的操作。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

JSON 表示法
{
  "actionRuleId": string,
  "postEventTriggers": [
    {
      object (Trigger)
    }
  ],

  "commonWidgetAction": {
    object (CommonWidgetAction)
  }
}
字段
actionRuleId

string

ActionRule 的唯一标识符。

postEventTriggers[]

object (Trigger)

EventAction 执行后将触发的触发器列表。

要执行的操作。以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:
commonWidgetAction

object (CommonWidgetAction)

常见 widget 操作。

互斥字段结束。

触发器

代表触发器。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

JSON 表示法
{
  "actionRuleId": string
}
字段
actionRuleId

string

ActionRule 的唯一标识符。

CommonWidgetAction

表示不特定于微件的操作。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

JSON 表示法
{

  "updateVisibilityAction": {
    object (UpdateVisibilityAction)
  }
}
字段
要执行的操作。以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:
updateVisibilityAction

object (UpdateVisibilityAction)

用于更新 widget 可见性的操作。

互斥字段结束。

UpdateVisibilityAction

表示更新 widget 可见性的操作。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

JSON 表示法
{
  "visibility": enum (Visibility)
}
字段
visibility

enum (Visibility)

新的公开范围。

CollapseControl

表示展开和收起控件。

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

JSON 表示法
{
  "horizontalAlignment": enum (HorizontalAlignment),
  "expandButton": {
    object (Button)
  },
  "collapseButton": {
    object (Button)
  }
}
字段
horizontalAlignment

enum (HorizontalAlignment)

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

expandButton

object (Button)

可选。定义一个自定义按钮,用于展开该部分。必须同时设置 expandButton 和 collapseButton 字段。仅设置一个字段不会生效。如果未设置此字段,则使用默认按钮。

collapseButton

object (Button)

可选。定义一个自定义按钮,用于收起该部分。必须同时设置 expandButton 和 collapseButton 字段。仅设置一个字段不会生效。如果未设置此字段,则使用默认按钮。

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 默认值。该卡片会替换卡片堆叠中顶部卡片的视图。

ExpressionData

表示用于评估表达式的数据。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

JSON 表示法
{
  "id": string,
  "expression": string,
  "conditions": [
    {
      object (Condition)
    }
  ],
  "eventActions": [
    {
      object (EventAction)
    }
  ]
}
字段
id

string

ExpressionData 的唯一标识符。

expression

string

未编译的表达式。

conditions[]

object (Condition)

由表达式求值结果确定的条件列表。

eventActions[]

object (EventAction)

可使用 ExpressionData 的操作列表。

条件

表示可用于触发操作的条件。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

JSON 表示法
{
  "actionRuleId": string,

  "expressionDataCondition": {
    object (ExpressionDataCondition)
  }
}
字段
actionRuleId

string

ActionRule 的唯一标识符。

条件。以下是互斥字段的列表。在响应中,最多只能设置以下字段之一:
expressionDataCondition

object (ExpressionDataCondition)

由表达式数据确定的条件。

互斥字段结束。

ExpressionDataCondition

表示使用 CEL 评估的条件。

适用于扩展 Google Workspace Studio 的 Google Workspace 插件。不适用于 Google Chat 应用。

JSON 表示法
{
  "conditionType": enum (ConditionType)
}
字段
conditionType

enum (ConditionType)

条件的类型。

ConditionType

条件的类型。

枚举
CONDITION_TYPE_UNSPECIFIED 未指定的条件类型。
EXPRESSION_EVALUATION_SUCCESS 表达式评估成功。
EXPRESSION_EVALUATION_FAILURE 表达式求值失败。