Columns
小工具會在資訊卡或對話方塊中顯示最多 2 欄。您可以新增小工具
各 Column
;小工具會按指定順序顯示如需 Google Chat 應用程式的範例,請參閱「欄」。
每個資料欄的高度取決於較高資料欄。舉例來說,如果第一欄比第二欄高,則兩個欄的高度都會是第一欄的高度。由於每個資料欄可包含不同數量的小工具,因此您無法定義列或在資料欄之間對齊小工具。
這兩欄會並排顯示。您可以使用
「HorizontalSizeStyle
」欄位。如果使用者的螢幕寬度太窄,第二個資料欄會在第一個資料欄下方折行:
- 在網頁上,第二欄會在螢幕寬度小於或等於 480 像素時換行。
- 在 iOS 裝置上,如果螢幕寬度小於或等於 300,第二欄則會換行 第 篇
- 在 Android 裝置上,如果螢幕寬度小於或等於,第二欄則會納入 320 dp。
適用於 Google Chat 應用程式和 Google Workspace 外掛程式。支援的外掛程式 UI 的資料欄包括:
- 使用者從電子郵件草稿開啟外掛程式時顯示的對話方塊。
- 使用者透過視窗的 [新增附件] 選單開啟外掛程式時, Google 日曆活動。
// 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 | 設定資料欄的納入樣式,可控制資料欄如何根據螢幕寬度調整大小。 |