Class Columns

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

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

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

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

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

// Build a column that is aligned in the center and fills the space:
const column = CardService.newColumn()
    .setHorizontalSizeStyle(CardService.HorizontalSizeStyle.FILL_AVAILABLE_SPACE)
    .setHorizontalAlignment(CardService.HorizontalAlignment.CENTER)
    .setVerticalAlignment(CardService.VerticalAlignment.CENTER);
const columns = CardService.newColumns()
    .addColumn(column)
    .setWrapStyle(CardService.WrapStyle.WRAP);

方法

方法返回类型简介
addColumn(column)Columns向“列”微件添加 Column
setWrapStyle(wrapStyle)Columns设置列的换行样式,控制如何根据屏幕宽度调整列的大小。

详细文档

addColumn(column)

向“列”微件添加 Column。系统会按照列的添加顺序显示列。您最多可以添加两列。

const columns = CardService.newColumns()
    .addColumn(CardService.newColumn());

参数

名称类型说明
columnColumn要添加到“列”微件的子列。

弃踢回攻

Columns - 此对象,用于链接。


setWrapStyle(wrapStyle)

设置列的换行样式,控制如何根据屏幕宽度调整列的大小。

const columns = CardService.newColumns()
    .addColumn(CardService.newColumn())
    .setWrapStyle(CardService.WrapStyle.WRAP);

参数

名称类型说明
wrapStyleWrapStyle要为列设置的换行样式。

弃踢回攻

Columns - 此对象,用于链接。