Class Columns

列

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

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

列が並べて表示されます。HorizontalSizeStyle フィールドを使用して、各列の幅をカスタマイズできます。ユーザーの画面幅が狭すぎると、2 列目が 1 列目の下に折り返されます。

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

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 を追加します。
addEventAction(eventAction)Widgetウィジェットで実行できるイベント アクションを追加します。
setId(id)Widget変更するウィジェットの識別に使用される一意の ID を設定します。
setVisibility(visibility)Widgetウィジェットの可視性を設定します。
setWrapStyle(wrapStyle)Columns列の折り返しスタイルを設定し、画面の幅に基づいて列のサイズを変更する方法を制御します。

詳細なドキュメント

addColumn(column)

[列] ウィジェットに Column を追加します。列は追加された順序で表示されます。列は 2 つまで追加できます。

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

パラメータ

名前型説明
columnColumnColumns ウィジェットに追加する子列。

戻る

Columns - チェーン用のこのオブジェクト。

addEventAction(eventAction)

ウィジェットで実行できるイベント アクションを追加します。

パラメータ

名前型説明
eventActionEventAction追加する EventAction。

戻る

Widget - チェーン用の Object。

setId(id)

変更するウィジェットの識別に使用される一意の ID を設定します。ウィジェットの変更はアドオンでのみサポートされています。

パラメータ

名前型説明
idStringウィジェットの ID。64 文字以内で、`[a-zA-Z0-9-]+` の形式で指定します。

戻る

Widget - チェーン用のこのオブジェクト。

setVisibility(visibility)

ウィジェットの可視性を設定します。デフォルト値は `VISIBLE` です。

パラメータ

名前型説明
visibilityVisibilityウィジェットの Visibility。

戻る

Widget - チェーン用の Object。

setWrapStyle(wrapStyle)

列の折り返しスタイルを設定し、画面の幅に基づいて列のサイズを変更する方法を制御します。

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

パラメータ

名前型説明
wrapStyleWrapStyle列に設定する折り返しスタイル。

戻る

Columns - チェーン用のこのオブジェクト。