Class Columns

Столбцы

Виджет Columns отображает до двух столбцов на карточке или в диалоговом окне. Вы можете добавлять виджеты в каждый Column ; виджеты отображаются в том порядке, в котором они указаны. Пример использования приложений Google Chat см. в разделе «Столбцы» .

Высота каждого столбца определяется более высоким столбцом. Например, если первый столбец выше второго, оба столбца будут иметь высоту первого столбца. Поскольку каждый столбец может содержать разное количество виджетов, вы не можете определять строки или выравнивать виджеты между столбцами.

Столбцы отображаются рядом. Вы можете настроить ширину каждого столбца, используя поле HorizontalSizeStyle . Если ширина экрана пользователя слишком узкая, второй столбец переносится ниже первого:

  • В Интернете второй столбец переносится, если ширина экрана меньше или равна 480 пикселям.
  • На устройствах iOS второй столбец переносится, если ширина экрана меньше или равна 300 pt.
  • На устройствах Android второй столбец переносится, если ширина экрана меньше или равна 320 dp.

Доступно для приложений Google Chat и дополнений Google Workspace. Дополнительные пользовательские интерфейсы, поддерживающие столбцы, включают:

  • Диалоговое окно отображается, когда пользователи открывают надстройку из черновика электронного письма.
  • Диалоговое окно, отображаемое, когда пользователи открывают надстройку из меню «Добавить вложение» в событии Календаря 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 Устанавливает стиль переноса столбцов, контролирует изменение размера столбца в зависимости от ширины экрана.

Подробная документация

addColumn(column)

Добавляет Column в виджет «Столбцы». Столбцы отображаются в том порядке, в котором они добавлены. Вы можете добавить до двух столбцов.

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

Параметры

Имя Тип Описание
column Column Дочерний столбец, который нужно добавить в виджет «Столбцы».

Возвращаться

Columns — этот объект для цепочки.


setWrapStyle(wrapStyle)

Устанавливает стиль переноса столбцов, контролирует изменение размера столбца в зависимости от ширины экрана.

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

Параметры

Имя Тип Описание
wrapStyle WrapStyle Стиль переноса, устанавливаемый для столбцов.

Возвращаться

Columns — этот объект для цепочки.