Columns
ウィジェットは、カードまたはダイアログに最大 2 つの列を表示します。ウィジェットは
毎Column
。ウィジェットは指定された順序で表示されます。Google Chat アプリの例については、列をご覧ください。
各列の高さは列の高さによって決まります。たとえば、最初の列が が 2 列目より高い場合、どちらの列も 1 列目の高さになります。なぜなら、 列に異なる数のウィジェットを含めることができます。また、行を定義したり、ウィジェットを並べたりすることはできません。 指定します。
列は並べて表示されます。各列の幅は、
HorizontalSizeStyle
フィールド。ユーザーの画面幅が狭すぎる場合、2 番目の列は 1 番目の列の下に折り返されます。
- ウェブでは、画面の幅が 480 ピクセル以下の場合、2 番目の列が折り返されます。
- iOS デバイスでは、画面幅が 300 pt 未満の場合、2 列目が折り返されます。
- Android デバイスでは、画面幅が次の値以下になると 2 番目の列が折り返します。 320 dp。
Google Chat アプリと Google Workspace アドオンでご利用いただけます。サポートするアドオン UI は、 列の例:
- ユーザーがメールの下書きからアドオンを開いたときに表示されるダイアログ。
- ユーザーが [添付ファイルを追加] メニューからアドオンを開いたときに表示されるダイアログ クリックします。
// 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 | 列の折り返しスタイルを設定し、画面の幅に基づいて列をどのようにサイズ変更するかを制御します。 |