Карта
Интерфейс карточки, отображаемый в сообщении Google Chat или дополнении Google Workspace.
Карточки поддерживают определённый макет, интерактивные элементы пользовательского интерфейса, такие как кнопки, и мультимедийные материалы, например, изображения. Используйте карточки для представления подробной информации, сбора информации от пользователей и подсказки им, как сделать следующий шаг.
Создавайте и просматривайте открытки с помощью Card Builder.
Откройте конструктор картЧтобы узнать, как создавать карты, ознакомьтесь со следующей документацией:
- Для приложений Google Chat см. раздел Разработка компонентов карточки или диалога .
- Информацию о дополнениях Google Workspace см. в разделе Интерфейсы на основе карт .
Примечание: Вы можете добавить до 100 виджетов на одну карточку. Любые виджеты, превышающие это ограничение, игнорируются. Это ограничение применяется как к сообщениям и диалогам в приложениях Google Chat, так и к карточкам в расширениях Google Workspace.
Пример: сообщение в карточке для приложения Google Chat
Чтобы создать пример сообщения-карточки в Google Chat, используйте следующий JSON:
{
"cardsV2": [
{
"cardId": "unique-card-id",
"card": {
"header": {
"title": "Sasha",
"subtitle": "Software Engineer",
"imageUrl":
"https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png",
"imageType": "CIRCLE",
"imageAltText": "Avatar for Sasha"
},
"sections": [
{
"header": "Contact Info",
"collapsible": true,
"uncollapsibleWidgetsCount": 1,
"widgets": [
{
"decoratedText": {
"startIcon": {
"knownIcon": "EMAIL"
},
"text": "sasha@example.com"
}
},
{
"decoratedText": {
"startIcon": {
"knownIcon": "PERSON"
},
"text": "<font color=\"#80e27e\">Online</font>"
}
},
{
"decoratedText": {
"startIcon": {
"knownIcon": "PHONE"
},
"text": "+1 (555) 555-1234"
}
},
{
"buttonList": {
"buttons": [
{
"text": "Share",
"onClick": {
"openLink": {
"url": "https://example.com/share"
}
}
},
{
"text": "Edit",
"onClick": {
"action": {
"function": "goToView",
"parameters": [
{
"key": "viewType",
"value": "EDIT"
}
]
}
}
}
]
}
}
]
}
]
}
}
]
}
JSON-представление |
---|
{ "header": { object ( |
Поля | |
---|---|
header | Заголовок карточки. Заголовок обычно содержит начальное изображение и название. Заголовки всегда располагаются в верхней части карточки. |
sections[] | Содержит набор виджетов. Каждый раздел имеет собственный заголовок (необязательно). Разделы визуально разделены линией-разделителем. Пример в приложениях Google Chat см. в разделе «Определение раздела карточки» . |
sectionDividerStyle | Стиль разделителя между заголовком, разделами и нижним колонтитулом. |
cardActions[] | Действия карты. Действия добавляются в меню панели инструментов карты.
Например, следующий JSON-код создает меню действий карточки с параметрами
|
name | Название карты. Используется как идентификатор карты при навигации по ней.
|
fixedFooter | Фиксированный нижний колонтитул, показанный внизу этой карточки. Установка
|
displayStyle | В надстройках Google Workspace задает свойства отображения
|
peekCardHeader | При отображении контекстного контента заголовок всплывающей карточки действует как заполнители, позволяя пользователю перемещаться между карточками домашней страницы и контекстными карточками.
|
CardHeader
Представляет заголовок карточки. Пример в приложениях Google Chat см. в разделе Добавление заголовка .
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{
"title": string,
"subtitle": string,
"imageType": enum ( |
Поля | |
---|---|
title | Обязательно. Название заголовка карточки. Заголовок имеет фиксированную высоту: если указаны и заголовок, и подзаголовок, каждый занимает одну строку. Если указан только заголовок, он занимает обе строки. |
subtitle | Подзаголовок заголовка карточки. Если указан, отображается на отдельной строке под |
imageType | Форма, используемая для обрезки изображения.
|
imageUrl | HTTPS-URL изображения в заголовке карточки. |
imageAltText | Альтернативный текст этого изображения, используемый для обеспечения доступности. |
Тип изображения
Форма, используемая для обрезки изображения.
Доступно для приложений Google Chat и дополнений Google Workspace.
Перечисления | |
---|---|
SQUARE | Значение по умолчанию. Применяет к изображению квадратную маску. Например, изображение размером 4x3 преобразуется в изображение размером 3x3. |
CIRCLE | Применяет к изображению круговую маску. Например, изображение размером 4x3 превращается в круг диаметром 3. |
Раздел
Раздел содержит коллекцию виджетов, которые отображаются вертикально в том порядке, в котором они указаны.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "header": string, "widgets": [ { object ( |
Поля | |
---|---|
header | Текст, отображаемый в верхней части раздела. Поддерживает простой текст в формате HTML. Подробнее о форматировании текста см. в разделах Форматирование текста в приложениях Google Chat и Форматирование текста в расширениях Google Workspace . |
widgets[] | Все виджеты в разделе. Должен содержать хотя бы один виджет. |
collapsible | Указывает, является ли этот раздел сворачиваемым. Сворачиваемые разделы скрывают некоторые или все виджеты, но пользователи могут развернуть раздел, чтобы отобразить скрытые виджеты, нажав «Показать больше» . Пользователи могут снова скрыть виджеты, нажав «Показать меньше» . Чтобы определить, какие виджеты скрыты, укажите |
uncollapsibleWidgetsCount | Количество несворачиваемых виджетов, которые остаются видимыми даже при свертывании раздела. Например, если раздел содержит пять виджетов, а значение |
collapseControl | Необязательно. Задайте кнопку развёртывания и свёртывания раздела. Эта кнопка будет отображаться только если раздел можно свернуть. Если это поле не задано, будет использоваться кнопка по умолчанию. |
Виджет
Каждая карточка состоит из виджетов.
Виджет — это составной объект, который может представлять собой текст, изображения, кнопки и другие типы объектов.
JSON-представление |
---|
{ "horizontalAlignment": enum ( |
Поля | |
---|---|
horizontalAlignment | Указывает, выравниваются ли виджеты по левому краю, правому краю или центру столбца. |
data поля объединения. Виджет может содержать только один из следующих элементов. Вы можете использовать несколько полей виджета для отображения большего количества элементов. data могут содержать только один из следующих элементов: | |
textParagraph | Отображает текстовый абзац. Поддерживает простой текст в формате HTML. Подробнее о форматировании текста см. в разделах Форматирование текста в приложениях Google Chat и Форматирование текста в расширениях Google Workspace . Например, следующий JSON-код создает полужирный текст:
|
image | Отображает изображение. Например, следующий JSON создает изображение с альтернативным текстом:
|
decoratedText | Отображает декорированный текстовый элемент. Например, следующий JSON-код создает декорированный текстовый виджет, отображающий адрес электронной почты:
|
buttonList | Список кнопок. Например, следующий JSON-код создаёт две кнопки. Первая — синяя текстовая кнопка, а вторая — кнопка-изображение, открывающая ссылку:
|
textInput | Отображает текстовое поле, в котором пользователи могут вводить текст. Например, следующий JSON-код создает текстовое поле для адреса электронной почты:
В качестве другого примера, следующий JSON создает текстовое поле ввода для языка программирования со статическими предложениями:
|
selectionInput | Отображает элемент управления, позволяющий пользователям выбирать элементы. Элементами управления могут быть флажки, переключатели, переключатели или раскрывающиеся меню. Например, следующий код JSON создает раскрывающееся меню, позволяющее пользователям выбрать размер:
|
dateTimePicker | Отображает виджет, позволяющий пользователям вводить дату, время или дату и время. Например, следующий JSON-код создает выбор даты и времени для планирования встречи:
|
divider | Отображает горизонтальную линию-разделитель между виджетами. Например, следующий JSON-код создает разделитель:
|
grid | Отображает сетку с коллекцией элементов. Сетка поддерживает любое количество столбцов и элементов. Количество строк определяется верхней границей числа элементов, делённой на количество столбцов. Сетка с 10 элементами и 2 столбцами имеет 5 строк. Сетка с 11 элементами и 2 столбцами имеет 6 строк.
Например, следующий JSON-код создает сетку из 2 столбцов с одним элементом:
|
columns | Отображает до 2 столбцов. Чтобы включить более 2 столбцов или использовать строки, используйте виджет Например, следующий JSON создает 2 столбца, каждый из которых содержит текстовые абзацы:
|
carousel | Карусель содержит набор вложенных виджетов. Например, это JSON-представление карусели, содержащей два текстовых абзаца.
|
chipList | Список фишек. Например, следующий JSON-код создаёт два чипа. Первый — текстовый, а второй — значок, открывающий ссылку:
|
Текстовый абзац
Абзац текста, поддерживающий форматирование. Пример в приложениях Google Chat см. в разделе Добавление абзаца форматированного текста . Дополнительные сведения о форматировании текста см. в разделах Форматирование текста в приложениях Google Chat и Форматирование текста в расширениях Google Workspace .
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{
"text": string,
"maxLines": integer,
"textSyntax": enum ( |
Поля | |
---|---|
text | Текст, отображаемый в виджете. |
maxLines | Максимальное количество строк текста, отображаемых в виджете. Если длина текста превышает указанное максимальное количество строк, лишний текст скрывается за кнопкой «Показать больше» . Если длина текста равна или короче указанного максимального количества строк, кнопка «Показать больше» не отображается. Значение по умолчанию — 0, в этом случае отображается весь контекст. Отрицательные значения игнорируются. |
textSyntax | Синтаксис текста. Если не задан, текст отображается как HTML.
|
TextSyntax
Синтаксис, используемый для форматирования текста.
Доступно для приложений Google Chat и недоступно для дополнений Google Workspace.
Перечисления | |
---|---|
TEXT_SYNTAX_UNSPECIFIED | Если не указано иное, текст отображается как HTML. |
HTML | Текст отображается как HTML. Это значение по умолчанию. |
MARKDOWN | Текст отображается в формате Markdown. |
Изображение
Изображение, заданное URL-адресом и допускающее действие onClick
. Пример см. в разделе «Добавление изображения» .
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{
"imageUrl": string,
"onClick": {
object ( |
Поля | |
---|---|
imageUrl | HTTPS-URL, на котором размещено изображение. Например:
|
onClick | Когда пользователь нажимает на изображение, щелчок запускает это действие. |
altText | Альтернативный текст этого изображения, используемый для обеспечения доступности. |
OnClick
Показывает, как реагировать, когда пользователи нажимают интерактивный элемент на карточке, например кнопку.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ // Union field |
Поля | |
---|---|
| |
action | Если указано, действие запускается этим |
openLink | Если указано, этот |
openDynamicLinkAction | Дополнение активирует это действие, когда ему требуется открыть ссылку. Оно отличается от описанного выше действия
|
card | Если указано, после щелчка новая карта помещается в стопку карт.
|
overflowMenu | Если указано, |
Действие
Действие, описывающее поведение при отправке формы. Например, вы можете вызвать скрипт Apps Script для обработки формы. При срабатывании действия значения формы отправляются на сервер.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "function": string, "parameters": [ { object ( |
Поля | |
---|---|
function | Пользовательская функция, вызываемая при щелчке по содержащему элементу или его активации. Пример использования см. в разделе Чтение данных формы . |
parameters[] | Список параметров действия. |
loadIndicator | Указывает индикатор загрузки, который действие отображает при вызове действия. |
persistValues | Указывает, сохраняются ли значения формы после действия. Значение по умолчанию — Если Если |
interaction | Необязательно. Требуется при открытии диалогового окна . Что делать в ответ на взаимодействие с пользователем, например, нажатие пользователем кнопки в сообщении карточки. Если не указано иное, приложение реагирует, выполняя Указав
|
requiredWidgets[] | Необязательно. Заполните этот список названиями виджетов, необходимых этому действию для корректной отправки. Если перечисленные здесь виджеты не имеют значения при вызове этого действия, отправка формы прерывается.
|
allWidgetsAreRequired | Необязательно. Если это так, то все виджеты считаются обязательными для этого действия.
|
ПараметрДействия
Список строковых параметров, которые необходимо передать при вызове метода действия. Например, рассмотрим три кнопки отсрочки: отложить сейчас, отложить на один день и отложить на следующую неделю. Вы можете использовать action method = snooze()
, передав тип и время отсрочки в списке строковых параметров.
Более подробную информацию см. в разделе CommonEventObject
.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "key": string, "value": string } |
Поля | |
---|---|
key | Имя параметра сценария действия. |
value | Значение параметра. |
Индикатор нагрузки
Указывает индикатор загрузки, который действие отображает при вызове действия.
Доступно для приложений Google Chat и дополнений Google Workspace.
Перечисления | |
---|---|
SPINNER | Отображает вращающийся индикатор, указывающий на загрузку контента. |
NONE | Ничего не отображается. |
Взаимодействие
Необязательно. Требуется при открытии диалогового окна .
Что делать в ответ на взаимодействие с пользователем, например, нажатие пользователем кнопки в сообщении карточки.
Если не указано иное, приложение реагирует, выполняя action
(например, открытие ссылки или запуск функции) как обычно.
Указав interaction
, приложение может реагировать особыми интерактивными способами. Например, установив interaction
в значение OPEN_DIALOG
, приложение может открыть диалог .
Если указано, индикатор загрузки не отображается. Если указано для дополнения, вся карта удаляется, и в клиенте ничего не отображается.
Доступно для приложений Google Chat и недоступно для дополнений Google Workspace.
Перечисления | |
---|---|
INTERACTION_UNSPECIFIED | Значение по умолчанию. action выполняется как обычно. |
OPEN_DIALOG | Открывает диалоговое окно — оконный карточный интерфейс, который приложения чата используют для взаимодействия с пользователями. Поддерживается только приложениями чата в ответ на нажатие кнопок в сообщениях карточек. Если указано для дополнения, вся карточка удаляется, и в клиенте ничего не отображается.
|
OpenLink
Представляет событие onClick
, которое открывает гиперссылку.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "url": string, "openAs": enum ( |
Поля | |
---|---|
url | URL-адрес для открытия. |
openAs | Как открыть ссылку.
|
onClose | Забывает ли клиент о ссылке после ее открытия или наблюдает за ней до тех пор, пока окно не закроется.
|
OpenAs
Когда действие OnClick
открывает ссылку, клиент может открыть её либо как полноразмерное окно (если клиент использует этот фрейм), либо как оверлей (например, всплывающее окно). Реализация зависит от возможностей клиентской платформы, и выбранное значение может быть проигнорировано, если клиент его не поддерживает. FULL_SIZE
поддерживается всеми клиентами.
Доступно для дополнений Google Workspace и недоступно для приложений Google Chat.
Перечисления | |
---|---|
FULL_SIZE | Ссылка открывается в полноразмерном окне (если клиент использует именно этот фрейм). |
OVERLAY | Ссылка открывается как наложение, например всплывающее окно. |
OnClose
Что делает клиент, когда ссылка, открытая действием OnClick
, закрывается.
Реализация зависит от возможностей клиентской платформы. Например, веб-браузер может открыть ссылку во всплывающем окне с обработчиком OnClose
.
Если установлены оба обработчика OnOpen
и OnClose
, а клиентская платформа не может поддерживать оба значения, приоритет имеет OnClose
.
Доступно для дополнений Google Workspace и недоступно для приложений Google Chat.
Перечисления | |
---|---|
NOTHING | Значение по умолчанию. Карта не перезагружается; ничего не происходит. |
RELOAD | Перезагружает карту после закрытия дочернего окна. При использовании совместно с |
OverflowMenu
Виджет, представляющий собой всплывающее меню с одним или несколькими действиями, которые могут быть вызваны пользователем. Например, отображение неосновных действий на карточке. Этот виджет можно использовать, когда действия не помещаются в доступное пространство. Чтобы использовать этот виджет, укажите его в действии OnClick
виджетов, которые его поддерживают. Например, в Button
.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{
"items": [
{
object ( |
Поля | |
---|---|
items[] | Обязательно. Список пунктов меню. |
OverflowMenuItem
Параметр, который пользователи могут вызвать в дополнительном меню.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "startIcon": { object ( |
Поля | |
---|---|
startIcon | Значок, отображаемый перед текстом. |
text | Обязательно. Текст, который идентифицирует или описывает элемент для пользователей. |
onClick | Обязательно. Действие, вызываемое при выборе пункта меню. Этот |
disabled | Отключён ли пункт меню. По умолчанию — false. |
Икона
Значок, отображаемый в виджете на карточке. Пример в приложениях Google Chat см. в разделе «Добавление значка» .
Поддерживает встроенные и пользовательские значки.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "altText": string, "imageType": enum ( |
Поля | |
---|---|
altText | Необязательно. Описание значка, используемого для обеспечения доступности. Если не указано иное, предоставляется значение по умолчанию Если значок установлен в |
imageType | Стиль кадрирования, применённый к изображению. В некоторых случаях применение обрезки |
icons полей объединения. Значок, отображаемый в виджете на карте. icons могут быть только одними из следующих: | |
knownIcon | Отобразите один из встроенных значков, предоставляемых Google Workspace. Например, чтобы отобразить значок самолёта, укажите Полный список поддерживаемых значков смотрите в разделе встроенные значки . |
iconUrl | Отображение пользовательского значка, размещенного по URL-адресу HTTPS. Например:
Поддерживаемые типы файлов включают |
materialIcon | Отобразите один из значков Google Material . Например, чтобы отобразить значок флажка , используйте
|
MaterialIcon
Значок Google Material , включающий более 2500 опций.
Например, чтобы отобразить значок флажка с настроенным весом и оценкой, напишите следующее:
{
"name": "check_box",
"fill": true,
"weight": 300,
"grade": -25
}
Доступно для приложений Google Chat и недоступно для дополнений Google Workspace.
JSON-представление |
---|
{ "name": string, "fill": boolean, "weight": integer, "grade": integer } |
Поля | |
---|---|
name | Имя значка, заданное в Google Material Icon , например, |
fill | Отображается ли значок как заполненный. Значение по умолчанию — false. Для предварительного просмотра различных настроек значков перейдите в раздел «Значки шрифтов Google» и измените параметры в разделе «Настройка» . |
weight | Толщина штриха значка. Выберите из {100, 200, 300, 400, 500, 600, 700}. Если значение отсутствует, по умолчанию используется значение 400. Если указано другое значение, используется значение по умолчанию. Для предварительного просмотра различных настроек значков перейдите в раздел «Значки шрифтов Google» и измените параметры в разделе «Настройка» . |
grade | Насыщенность и насыщенность влияют на толщину символа. Корректировка насыщенности более точна, чем корректировка насыщенности, и оказывает незначительное влияние на размер символа. Доступны значения {-25, 0, 200}. Если значение отсутствует, по умолчанию используется 0. Если указано другое значение, используется значение по умолчанию. Для предварительного просмотра различных настроек значков перейдите в раздел «Значки шрифтов Google» и измените параметры в разделе «Настройка» . |
DecoratedText
Виджет, отображающий текст с дополнительными элементами декора, такими как метка над или под текстом, значок перед текстом, виджет выбора или кнопка после текста. Пример в приложениях Google Chat см. в разделе Отображение текста с декоративным текстом .
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "icon": { object ( |
Поля | |
---|---|
icon | Устарело в пользу |
startIcon | Значок, отображаемый перед текстом. |
startIconVerticalAlignment | Необязательно. Вертикальное выравнивание значка «Пуск». Если не задано, значок будет выровнен по центру.
|
topLabel | Текст, отображаемый над |
topLabelText |
|
text | Обязательно. Основной текст. Поддерживает простое форматирование. Подробнее о форматировании текста см. в разделах Форматирование текста в приложениях Google Chat и Форматирование текста в расширениях Google Workspace . |
contentText |
|
wrapText | Настройка переноса текста. Если Применяется только к |
bottomLabel | Текст, отображаемый под |
bottomLabelText |
|
onClick | Это действие запускается, когда пользователи нажимают |
control полем объединения. Кнопка, переключатель, флажок или изображение, отображаемые справа от текста в виджете decoratedText . control может быть только одним из следующих: | |
button | Кнопка, которую пользователь может нажать, чтобы запустить действие. |
switchControl | Виджет-переключатель, на который пользователь может нажать, чтобы изменить его состояние и запустить действие. |
endIcon | Значок, отображаемый после текста. Поддерживает встроенные и пользовательские значки. |
Вертикальное выравнивание
Представляет атрибут вертикального выравнивания.
Перечисления | |
---|---|
VERTICAL_ALIGNMENT_UNSPECIFIED | Тип не указан. Не использовать. |
TOP | Выравнивание по верхнему положению. |
MIDDLE | Выравнивание по среднему положению. |
BOTTOM | Выравнивание по нижнему положению. |
Кнопка
Текст, значок или кнопка с текстом и значком, на которые могут нажимать пользователи. Пример в приложениях Google Chat см. в разделе «Добавить кнопку» .
Чтобы сделать изображение кнопкой, на которую можно нажать, укажите
(не Image
) и задайте действие ImageComponent
onClick
.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "text": string, "icon": { object ( |
Поля | |
---|---|
text | Текст, отображаемый внутри кнопки. |
icon | Значок, отображаемый внутри кнопки. Если заданы и |
color | Необязательный. Цвет кнопки. Если задано, Чтобы задать цвет кнопки, укажите значения для полей Например, следующий код устанавливает красный цвет с максимальной интенсивностью:
Поле |
onClick | Обязательно. Действие, которое необходимо выполнить при нажатии пользователем кнопки, например, открытие гиперссылки или запуск пользовательской функции. |
disabled | Если |
altText | Альтернативный текст, используемый для обеспечения доступности. Добавьте описательный текст, который даст пользователям понять, что делает кнопка. Например, если кнопка открывает гиперссылку, можно написать: «Открывает новую вкладку браузера и перенаправляет к документации разработчика Google Chat по адресу https://developers.google.com/workspace/chat» . |
type | Необязательный. Тип кнопки. Если не задано, тип кнопки по умолчанию — |
Цвет
Представляет цвет в цветовом пространстве RGBA. Это представление разработано для простоты преобразования между представлениями цветов в различных языках и из них, а не для компактности. Например, поля этого представления могут быть тривиально переданы конструктору java.awt.Color
в Java; их также можно тривиально передать методу +colorWithRed:green:blue:alpha
класса UIColor в iOS; и, приложив немного усилий, их можно легко отформатировать в строку CSS rgba()
в JavaScript.
На этой странице справки нет информации об абсолютном цветовом пространстве, которое следует использовать для интерпретации значения RGB, например, sRGB, Adobe RGB, DCI-P3 и BT.2020. По умолчанию приложения должны использовать цветовое пространство sRGB.
Если необходимо определить равенство цветов, реализации, если не указано иное, считают два цвета равными, если все их значения красного, зеленого, синего и альфа отличаются не более чем на 1e-5
.
Пример (Java):
import com.google.type.Color;
// ...
public static java.awt.Color fromProto(Color protocolor) {
float alpha = protocolor.hasAlpha()
? protocolor.getAlpha().getValue()
: 1.0;
return new java.awt.Color(
protocolor.getRed(),
protocolor.getGreen(),
protocolor.getBlue(),
alpha);
}
public static Color toProto(java.awt.Color color) {
float red = (float) color.getRed();
float green = (float) color.getGreen();
float blue = (float) color.getBlue();
float denominator = 255.0;
Color.Builder resultBuilder =
Color
.newBuilder()
.setRed(red / denominator)
.setGreen(green / denominator)
.setBlue(blue / denominator);
int alpha = color.getAlpha();
if (alpha != 255) {
result.setAlpha(
FloatValue
.newBuilder()
.setValue(((float) alpha) / denominator)
.build());
}
return resultBuilder.build();
}
// ...
Пример (iOS / Obj-C):
// ...
static UIColor* fromProto(Color* protocolor) {
float red = [protocolor red];
float green = [protocolor green];
float blue = [protocolor blue];
FloatValue* alpha_wrapper = [protocolor alpha];
float alpha = 1.0;
if (alpha_wrapper != nil) {
alpha = [alpha_wrapper value];
}
return [UIColor colorWithRed:red green:green blue:blue alpha:alpha];
}
static Color* toProto(UIColor* color) {
CGFloat red, green, blue, alpha;
if (![color getRed:&red green:&green blue:&blue alpha:&alpha]) {
return nil;
}
Color* result = [[Color alloc] init];
[result setRed:red];
[result setGreen:green];
[result setBlue:blue];
if (alpha <= 0.9999) {
[result setAlpha:floatWrapperWithValue(alpha)];
}
[result autorelease];
return result;
}
// ...
Пример (JavaScript):
// ...
var protoToCssColor = function(rgb_color) {
var redFrac = rgb_color.red || 0.0;
var greenFrac = rgb_color.green || 0.0;
var blueFrac = rgb_color.blue || 0.0;
var red = Math.floor(redFrac * 255);
var green = Math.floor(greenFrac * 255);
var blue = Math.floor(blueFrac * 255);
if (!('alpha' in rgb_color)) {
return rgbToCssColor(red, green, blue);
}
var alphaFrac = rgb_color.alpha.value || 0.0;
var rgbParams = [red, green, blue].join(',');
return ['rgba(', rgbParams, ',', alphaFrac, ')'].join('');
};
var rgbToCssColor = function(red, green, blue) {
var rgbNumber = new Number((red << 16) | (green << 8) | blue);
var hexString = rgbNumber.toString(16);
var missingZeros = 6 - hexString.length;
var resultBuilder = ['#'];
for (var i = 0; i < missingZeros; i++) {
resultBuilder.push('0');
}
resultBuilder.push(hexString);
return resultBuilder.join('');
};
// ...
JSON-представление |
---|
{ "red": number, "green": number, "blue": number, "alpha": number } |
Поля | |
---|---|
red | Количество красного в цвете как значение в интервале [0, 1]. |
green | Количество зеленого цвета в цвете как значение в интервале [0, 1]. |
blue | Количество синего в цвете как значение в интервале [0, 1]. |
alpha | Доля этого цвета, которая должна быть применена к пикселю. То есть, конечный цвет пикселя определяется уравнением: Это означает, что значение 1,0 соответствует сплошному цвету, тогда как значение 0,0 соответствует полностью прозрачному цвету. В этом случае используется сообщение-обёртка, а не простой скаляр с плавающей точкой, что позволяет различать значение по умолчанию и значение, которое не задано. Если этот параметр опущен, этот цветовой объект отображается как сплошной цвет (как если бы альфа-значению было явно присвоено значение 1,0). |
Тип
Необязательно. Тип кнопки. Если задано поле color
, type
принудительно устанавливается на FILLED
.
Доступно для приложений Google Chat и недоступно для дополнений Google Workspace.
Перечисления | |
---|---|
TYPE_UNSPECIFIED | Не использовать. Не указано. |
OUTLINED | Выделенные кнопки — кнопки средней важности. Они обычно содержат важные действия, но не являются основными в приложении чата или дополнении. |
FILLED | Заполненная кнопка представляет собой контейнер со сплошным цветом. Она производит наиболее визуальное впечатление и рекомендуется для важных и основных действий в приложении чата или дополнении. |
FILLED_TONAL | Кнопка с заливкой и тоновым оформлением — это альтернативный вариант между кнопками с заливкой и кнопками с контуром. Они полезны в ситуациях, когда кнопка с низким приоритетом требует чуть большего внимания, чем кнопка с контуром. |
BORDERLESS | По умолчанию кнопка не имеет невидимого контейнера. Она часто используется для действий с самым низким приоритетом, особенно при наличии нескольких вариантов выбора. |
SwitchControl
Либо переключатель в виде тумблера, либо флажок внутри виджета decoratedText
.
Доступно для приложений Google Chat и дополнений Google Workspace.
Поддерживается только в виджете decoratedText
.
JSON-представление |
---|
{ "name": string, "value": string, "selected": boolean, "onChangeAction": { object ( |
Поля | |
---|---|
name | Имя, по которому виджет-переключатель идентифицируется в событии ввода формы. Подробную информацию о работе с данными формы см. в разделе Получение данных формы . |
value | Значение, введенное пользователем, возвращается как часть события ввода формы. Подробную информацию о работе с данными формы см. в разделе Получение данных формы . |
selected | Если |
onChangeAction | Действие, которое следует выполнить при изменении состояния переключателя, например, какую функцию следует запустить. |
controlType | Как выглядит переключатель в пользовательском интерфейсе.
|
Тип управления
Как выглядит переключатель в пользовательском интерфейсе.
Доступно для приложений Google Chat и дополнений Google Workspace.
Перечисления | |
---|---|
SWITCH | Переключатель тумблерного типа. |
CHECKBOX | Устарело в пользу CHECK_BOX . |
CHECK_BOX | Флажок. |
ButtonList
Список кнопок, расположенных горизонтально. Пример в приложениях Google Chat см. в разделе «Добавление кнопки» .
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{
"buttons": [
{
object ( |
Поля | |
---|---|
buttons[] | Массив кнопок. |
TextInput
Поле, в которое пользователи могут вводить текст. Поддерживает предложения и действия при изменении. Поддерживает проверку отправки формы. Если Action.all_widgets_are_required
задано значение true
или этот виджет указан в Action.required_widgets
, отправка блокируется, если не введено значение. Пример в приложениях Google Chat см. в разделе Добавление поля, в котором пользователь может вводить текст .
Чат-приложения получают и могут обрабатывать текст, введённый во время событий ввода данных в форму. Подробнее о работе с данными формы см. в разделе Получение данных формы .
Если вам нужно собрать неопределённые или абстрактные данные от пользователей, используйте текстовый ввод. Для сбора определённых или перечисляемых данных от пользователей используйте виджет SelectionInput
.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "name": string, "label": string, "hintText": string, "value": string, "type": enum ( |
Поля | |
---|---|
name | Имя, по которому текстовый ввод идентифицируется в событии ввода формы. Подробную информацию о работе с данными формы см. в разделе Получение данных формы . |
label | Текст, который отображается над полем ввода текста в пользовательском интерфейсе. Укажите текст, который поможет пользователю ввести информацию, необходимую вашему приложению. Например, если вы спрашиваете чьё-то имя, но вам нужна именно фамилия, напишите Обязательно, если |
hintText | Текст, отображаемый под полем ввода текста, призван помочь пользователю ввести определённое значение. Этот текст виден всегда. Обязательно, если |
value | Значение, введенное пользователем, возвращается как часть события ввода формы. Подробную информацию о работе с данными формы см. в разделе Получение данных формы . |
type | Как поле ввода текста выглядит в пользовательском интерфейсе. Например, является ли поле однострочным или многострочным. |
onChangeAction | Что делать, если в поле ввода текста произошло изменение. Например, пользователь добавил текст в поле или удалил его. Примеры действий, которые можно выполнить, включают запуск пользовательской функции или открытие диалога в Google Chat. |
initialSuggestions | Предлагаемые значения, которые могут ввести пользователи. Эти значения появляются при щелчке внутри поля ввода текста. По мере ввода текста предлагаемые значения динамически фильтруются в соответствии с введенным пользователем текстом. Например, поле ввода текста для языка программирования может предлагать Java, JavaScript, Python и C++. Когда пользователи начинают вводить Предлагаемые значения помогают пользователям вводить значения, понятные вашему приложению. При использовании JavaScript одни пользователи могут вводить Если указано,
|
autoCompleteAction | Необязательно. Укажите, какое действие следует выполнять, когда поле ввода текста предлагает подсказки пользователям, взаимодействующим с ним. Если не указано иное, предложения задаются Если указано, приложение выполняет указанное здесь действие, например, запускает пользовательскую функцию.
|
validation | Укажите проверку формата ввода, необходимую для этого текстового поля.
|
placeholderText | Текст, который отображается в поле ввода, когда оно пустое. Используйте этот текст, чтобы предложить пользователям ввести значение. Например,
|
Тип
Как поле ввода текста отображается в пользовательском интерфейсе. Например, является ли оно однострочным или многострочным. Если указано initialSuggestions
, type
всегда SINGLE_LINE
, даже если задано MULTIPLE_LINE
.
Доступно для приложений Google Chat и дополнений Google Workspace.
Перечисления | |
---|---|
SINGLE_LINE | Поле ввода текста имеет фиксированную высоту в одну строку. |
MULTIPLE_LINE | Поле ввода текста имеет фиксированную высоту в несколько строк. |
RenderActions
Набор инструкций по отображению, который сообщает карте о необходимости выполнить действие или сообщает хост-приложению надстройки или приложению чата о необходимости выполнить действие, характерное для приложения.
Доступно для приложений Google Chat и дополнений Google Workspace.
Поля | |
---|---|
action |
Действие
Поля | |
---|---|
navigations[] | Вставляет, выталкивает или обновляет карту. |
Предложения
Рекомендуемые значения, которые могут ввести пользователи. Эти значения появляются, когда пользователи щелкают внутри поля ввода текста. По мере того, как пользователи вводят текст, предлагаемые значения динамически фильтруются в соответствии с тем, что набрали пользователи.
Например, поле ввода текста для языка программирования может предлагать Java, JavaScript, Python и C++. Когда пользователи начинают вводить Jav
, список предложений фильтруется для отображения Java
и JavaScript
.
Предлагаемые значения помогают пользователям вводить значения, понятные вашему приложению. Говоря о JavaScript, некоторые пользователи могут вводить javascript
, а другие java script
. Предложение JavaScript
может стандартизировать взаимодействие пользователей с вашим приложением.
Если указано, TextInput.type
всегда имеет SINGLE_LINE
, даже если для него установлено значение MULTIPLE_LINE
.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{
"items": [
{
object ( |
Поля | |
---|---|
items[] | Список предложений, используемых для автозаполнения рекомендаций в полях ввода текста. |
ПредложениеItem
Одно предлагаемое значение, которое пользователи могут ввести в поле ввода текста.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ // Union field |
Поля | |
---|---|
| |
text | Значение предлагаемого ввода в поле ввода текста. Это эквивалентно тому, что пользователи вводят сами. |
Проверка
Представляет необходимые данные для проверки виджета, к которому он прикреплен.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{
"characterLimit": integer,
"inputType": enum ( |
Поля | |
---|---|
characterLimit | Укажите ограничение на количество символов для виджетов ввода текста. Обратите внимание, что это используется только для ввода текста и игнорируется для других виджетов.
|
inputType | Укажите тип входных виджетов.
|
Тип ввода
Тип виджета ввода.
Перечисления | |
---|---|
INPUT_TYPE_UNSPECIFIED | Неопределенный тип. Не используйте. |
TEXT | Обычный текст, который принимает все символы. |
INTEGER | Целочисленное значение. |
FLOAT | Плавающее значение. |
EMAIL | Адрес электронной почты. |
EMOJI_PICKER | Эмодзи, выбранный из системного средства выбора эмодзи. |
ВыборВвод
Виджет, создающий один или несколько элементов пользовательского интерфейса, которые пользователи могут выбирать. Поддерживает проверку отправки формы только для dropdown
меню и меню multiselect
. Если для Action.all_widgets_are_required
установлено значение true
или этот виджет указан в Action.required_widgets
, действие отправки блокируется, если не выбрано значение. Например, выпадающее меню или флажки. Вы можете использовать этот виджет для сбора данных, которые можно прогнозировать или перечислять. Пример использования приложений Google Chat см. в разделе Добавление выбираемых элементов пользовательского интерфейса .
Приложения чата могут обрабатывать значения элементов, которые пользователи выбирают или вводят. Подробные сведения о работе с входными данными формы см. в разделе Получение данных формы .
Чтобы собирать неопределенные или абстрактные данные от пользователей, используйте виджет TextInput
.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "name": string, "label": string, "type": enum ( |
Поля | |
---|---|
name | Обязательно. Имя, которое идентифицирует ввод выбора в событии ввода формы. Подробные сведения о работе с входными данными формы см. в разделе Получение данных формы . |
label | Текст, который появляется над полем ввода выбора в пользовательском интерфейсе. Укажите текст, который поможет пользователю ввести информацию, необходимую вашему приложению. Например, если пользователи выбирают срочность рабочего билета из раскрывающегося меню, метка может быть «Срочность» или «Выбрать срочность». |
type | Тип элементов, которые отображаются пользователям в виджете |
items[] | Массив выбираемых элементов. Например, массив переключателей или флажков. Поддерживает до 100 элементов. |
onChangeAction | Если указано, форма отправляется при изменении выбора. Если не указано, необходимо указать отдельную кнопку, которая отправляет форму. Подробные сведения о работе с входными данными формы см. в разделе Получение данных формы . |
multiSelectMinQueryLength | Для меню с множественным выбором — количество текстовых символов, которые пользователь вводит перед тем, как меню вернет предлагаемые элементы выбора. Если этот параметр не установлен, в меню множественного выбора используются следующие значения по умолчанию:
|
multiSelectMaxSelectedItems | Для меню с множественным выбором — максимальное количество элементов, которые может выбрать пользователь. Минимальная стоимость — 1 шт. Если не указано, по умолчанию используется 3 элемента. |
Поле объединения
| |
externalDataSource | Внешний источник данных, например реляционная база данных. |
platformDataSource | Источник данных из Google Workspace. |
ТипВыбора
Формат элементов, которые могут выбирать пользователи. Различные варианты поддерживают разные типы взаимодействий. Например, пользователи могут установить несколько флажков, но выбрать только один элемент из раскрывающегося меню.
Каждый вход выбора поддерживает один тип выбора. Например, сочетание флажков и переключателей не поддерживается.
Доступно для приложений Google Chat и дополнений Google Workspace.
Перечисления | |
---|---|
CHECK_BOX | Набор флажков. Пользователи могут установить один или несколько флажков. |
RADIO_BUTTON | Набор радиокнопок. Пользователи могут выбрать один переключатель. |
SWITCH | Набор переключателей. Пользователи могут включить один или несколько переключателей. |
DROPDOWN | Выпадающее меню. Пользователи могут выбрать один пункт из меню. |
MULTI_SELECT | Меню с текстовым полем. Пользователи могут ввести и выбрать один или несколько элементов. Для надстроек Google Workspace необходимо заполнять элементы, используя статический массив объектов В приложениях Google Chat вы также можете заполнять элементы, используя динамический источник данных, и автоматически предлагать элементы по мере того, как пользователи вводят их в меню. Например, пользователи могут начать вводить название чат-группы Google, и виджет автоматически предложит это пространство. Чтобы динамически заполнять элементы меню с множественным выбором, используйте один из следующих типов источников данных:
Примеры реализации меню с множественным выбором для приложений чата см. в разделе Добавление меню с множественным выбором .
|
Элемент выбора
Элемент, который пользователи могут выбрать при вводе выбора, например флажок или переключатель. Поддерживает до 100 элементов.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "text": string, "value": string, "selected": boolean, "bottomText": string, // Union field |
Поля | |
---|---|
text | Текст, который идентифицирует или описывает элемент для пользователей. |
value | Значение, связанное с этим элементом. Клиент должен использовать это значение в качестве входного значения формы. Подробные сведения о работе с входными данными формы см. в разделе Получение данных формы . |
selected | Выбран ли элемент по умолчанию. Если входные данные выбора принимают только одно значение (например, для переключателей или раскрывающегося меню), установите это поле только для одного элемента. |
bottomText | Для меню с множественным выбором — текстовое описание или метка, отображаемая под |
Поле объединения start_icon . В меню с множественным выбором URL-адрес значка отображается рядом с text полем элемента. Поддерживает файлы PNG и JPEG. Должен быть URL-адрес HTTPS . Например, https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png . start_icon может быть только одним из следующих: | |
startIconUri | |
ПлатформаИсточник данных
Для виджета
, использующего меню с множественным выбором, — источник данных из Google Workspace. Используется для заполнения элементов в меню с множественным выбором. SelectionInput
Доступно для приложений Google Chat и недоступно для дополнений Google Workspace.
JSON-представление |
---|
{ // Union field |
Поля | |
---|---|
Поле объединения data_source . Источник данных. data_source может быть только одним из следующих: | |
commonDataSource | Источник данных, общий для всех приложений Google Workspace, например пользователей в организации Google Workspace. |
hostAppDataSource | Источник данных, уникальный для хост-приложения Google Workspace, например пространства в Google Chat. Это поле поддерживает клиентские библиотеки Google API, но недоступно в облачных клиентских библиотеках. Дополнительные сведения см. в разделе Установка клиентских библиотек . |
Общий источник данных
Источник данных, общий для всех приложений Google Workspace .
Доступно для приложений Google Chat и недоступно для дополнений Google Workspace.
Перечисления | |
---|---|
UNKNOWN | Значение по умолчанию. Не используйте. |
USER | Пользователи Google Workspace. Пользователь может просматривать и выбирать пользователей только из своей организации Google Workspace. |
HostAppDataSourceMarkup
Для виджета
, использующего меню с множественным выбором, — источник данных из приложения Google Workspace. Источник данных заполняет элементы выбора для меню множественного выбора. SelectionInput
Доступно для приложений Google Chat и недоступно для дополнений Google Workspace.
JSON-представление |
---|
{ // Union field |
Поля | |
---|---|
Поле объединения data_source . Приложение Google Workspace, которое заполняет элементы для меню с множественным выбором. data_source может быть только одним из следующих: | |
chatDataSource | Источник данных из Google Chat. |
ChatClientDataSourceMarkup
Для виджета
, использующего меню с множественным выбором, используется источник данных из Google Chat. Источник данных заполняет элементы выбора для меню множественного выбора. Например, пользователь может выбрать пространства Google Chat, участником которых он является. SelectionInput
Доступно для приложений Google Chat и недоступно для дополнений Google Workspace.
JSON-представление |
---|
{ // Union field |
Поля | |
---|---|
source поля Союза. Источник данных Google Chat. source может быть только одним из следующих: | |
spaceDataSource | Пространства Google Chat, участником которых является пользователь. |
ПространствоИсточник Данных
Источник данных, который заполняет пространства Google Chat в качестве элементов выбора для меню с множественным выбором. Заполняет только пространства, членом которых является пользователь.
Доступно для приложений Google Chat и недоступно для дополнений Google Workspace.
JSON-представление |
---|
{ "defaultToCurrentSpace": boolean } |
Поля | |
---|---|
defaultToCurrentSpace | Если установлено значение |
DateTimePicker
Позволяет пользователям вводить дату, время или дату и время одновременно. Поддерживает проверку отправки формы. Если Action.all_widgets_are_required
установлено значение true
или этот виджет указан в Action.required_widgets
, действие отправки блокируется, если не выбрано значение. Пример использования приложений Google Chat см. в разделе Разрешить пользователю выбирать дату и время .
Пользователи могут вводить текст или использовать средство выбора для выбора даты и времени. Если пользователи вводят неверную дату или время, средство выбора отображает ошибку, которая предлагает пользователям ввести информацию правильно.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "name": string, "label": string, "type": enum ( |
Поля | |
---|---|
name | Имя, по которому Подробные сведения о работе с входными данными формы см. в разделе Получение данных формы . |
label | Текст, предлагающий пользователям ввести дату, время или дату и время. Например, если пользователи планируют встречу, используйте метку, например |
type | Поддерживает ли виджет ввод даты, времени или даты и времени. |
valueMsEpoch | Значение по умолчанию, отображаемое в виджете, в миллисекундах с момента эпохи Unix . Укажите значение в зависимости от типа средства выбора (
|
timezoneOffsetDate | Число, представляющее смещение часового пояса от UTC в минутах. Если установлено, |
onChangeAction | Срабатывает, когда пользователь нажимает кнопку «Сохранить» или «Очистить» в интерфейсе |
DateTimePickerType
Формат даты и времени в виджете DateTimePicker
. Определяет, могут ли пользователи вводить дату, время или дату и время одновременно.
Доступно для приложений Google Chat и дополнений Google Workspace.
Перечисления | |
---|---|
DATE_AND_TIME | Пользователи вводят дату и время. |
DATE_ONLY | Пользователи вводят дату. |
TIME_ONLY | Пользователи вводят время. |
Разделитель
Этот тип не имеет полей.
Отображает разделитель между виджетами в виде горизонтальной линии. Пример использования приложений Google Chat см. в разделе «Добавление горизонтального разделителя между виджетами» .
Доступно для приложений Google Chat и дополнений Google Workspace.
Например, следующий JSON создает разделитель:
"divider": {}
Сетка
Отображает сетку с коллекцией элементов. Элементы могут включать только текст или изображения. Для адаптивных столбцов или для включения большего количества текста или изображений используйте
. Пример использования приложений Google Chat см. в разделе Отображение сетки с коллекцией элементов .Columns
Сетка поддерживает любое количество столбцов и элементов. Количество строк определяется элементами, разделенными столбцами. Сетка с 10 элементами и 2 столбцами имеет 5 строк. Сетка с 11 элементами и 2 столбцами имеет 6 строк.
Доступно для приложений Google Chat и дополнений Google Workspace.
Например, следующий JSON создает сетку из двух столбцов с одним элементом:
"grid": {
"title": "A fine collection of items",
"columnCount": 2,
"borderStyle": {
"type": "STROKE",
"cornerRadius": 4
},
"items": [
{
"image": {
"imageUri": "https://www.example.com/image.png",
"cropStyle": {
"type": "SQUARE"
},
"borderStyle": {
"type": "STROKE"
}
},
"title": "An item",
"textAlignment": "CENTER"
}
],
"onClick": {
"openLink": {
"url": "https://www.example.com"
}
}
}
JSON-представление |
---|
{ "title": string, "items": [ { object ( |
Поля | |
---|---|
title | Текст, который отображается в заголовке сетки. |
items[] | Элементы, отображаемые в сетке. |
borderStyle | Стиль границы, применяемый к каждому элементу сетки. |
columnCount | Количество столбцов, отображаемых в сетке. Значение по умолчанию используется, если это поле не указано, и это значение по умолчанию различается в зависимости от того, где отображается сетка (диалоговое окно или сопутствующий текст). |
onClick | Этот обратный вызов повторно используется каждым отдельным элементом сетки, но к параметрам обратного вызова добавляется идентификатор и индекс элемента в списке элементов. |
GridItem
Представляет элемент в макете сетки. Элементы могут содержать текст, изображение или и текст, и изображение.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "id": string, "image": { object ( |
Поля | |
---|---|
id | Заданный пользователем идентификатор для этого элемента сетки. Этот идентификатор возвращается в параметрах обратного вызова |
image | Изображение, которое отображается в элементе сетки. |
title | Название элемента сетки. |
subtitle | Подзаголовок элемента сетки. |
layout | Макет, используемый для элемента сетки. |
Компонент изображения
Представляет изображение.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "imageUri": string, "altText": string, "cropStyle": { object ( |
Поля | |
---|---|
imageUri | URL-адрес изображения. |
altText | Метка доступности изображения. |
cropStyle | Стиль обрезки, применяемый к изображению. |
borderStyle | Стиль границы, применяемый к изображению. |
СтильОбрезки Изображения
Представляет стиль обрезки, примененный к изображению.
Доступно для приложений Google Chat и дополнений Google Workspace.
Например, вот как применить соотношение сторон 16:9:
cropStyle {
"type": "RECTANGLE_CUSTOM",
"aspectRatio": 16/9
}
JSON-представление |
---|
{
"type": enum ( |
Поля | |
---|---|
type | Тип урожая. |
aspectRatio | Соотношение сторон, которое будет использоваться, если тип кадрирования — Например, вот как применить соотношение сторон 16:9:
|
ТипОбрезки Изображения
Представляет стиль обрезки, примененный к изображению.
Доступно для приложений Google Chat и дополнений Google Workspace.
Перечисления | |
---|---|
IMAGE_CROP_TYPE_UNSPECIFIED | Не используйте. Не указано. |
SQUARE | Значение по умолчанию. Применяет квадратную обрезку. |
CIRCLE | Применяет круговую обрезку. |
RECTANGLE_CUSTOM | Применяет прямоугольную обрезку с настраиваемым соотношением сторон. Установите пользовательское соотношение сторон с aspectRatio . |
RECTANGLE_4_3 | Применяет прямоугольную обрезку с соотношением сторон 4:3. |
BorderStyle
Параметры стиля границы карточки или виджета, включая тип и цвет границы.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "type": enum ( |
Поля | |
---|---|
type | Тип границы. |
strokeColor | Цвета, которые будут использоваться, если тип Чтобы задать цвет обводки, укажите значение для полей Например, следующий код устанавливает красный цвет с максимальной интенсивностью:
Поле |
cornerRadius | Угловой радиус границы. |
BorderType
Представляет типы границ, применяемые к виджетам.
Доступно для приложений Google Chat и дополнений Google Workspace.
Перечисления | |
---|---|
BORDER_TYPE_UNSPECIFIED | Не используйте. Не указано. |
NO_BORDER | Границы нет. |
STROKE | Значение по умолчанию. Схема. |
GridItemLayout
Представляет различные параметры макета, доступные для элемента сетки.
Доступно для приложений Google Chat и дополнений Google Workspace.
Перечисления | |
---|---|
GRID_ITEM_LAYOUT_UNSPECIFIED | Не используйте. Не указано. |
TEXT_BELOW | Заголовок и подзаголовок отображаются под изображением элемента сетки. |
TEXT_ABOVE | Заголовок и подзаголовок отображаются над изображением элемента сетки. |
Колонны
Виджет Columns
отображает до двух столбцов на карточке или в диалоговом окне. Вы можете добавлять виджеты в каждый столбец; виджеты отображаются в том порядке, в котором они указаны. Пример использования приложений Google Chat см. в разделе Отображение карточек и диалоговых окон в столбцах .
Высота каждого столбца определяется более высоким столбцом. Например, если первый столбец выше второго, оба столбца будут иметь высоту первого столбца. Поскольку каждый столбец может содержать разное количество виджетов, вы не можете определять строки или выравнивать виджеты между столбцами.
Столбцы отображаются рядом. Вы можете настроить ширину каждого столбца, используя поле HorizontalSizeStyle
. Если ширина экрана пользователя слишком узкая, второй столбец переносится ниже первого:
- В Интернете второй столбец переносится, если ширина экрана меньше или равна 480 пикселям.
- На устройствах iOS второй столбец переносится, если ширина экрана меньше или равна 300 pt.
- На устройствах Android второй столбец переносится, если ширина экрана меньше или равна 320 dp.
Чтобы включить более двух столбцов или использовать строки, используйте виджет
. Grid
Доступно для приложений Google Chat и дополнений Google Workspace. Дополнительные пользовательские интерфейсы, поддерживающие столбцы, включают:
- Диалоговое окно отображается, когда пользователи открывают надстройку из черновика электронного письма.
- Диалоговое окно, отображаемое, когда пользователи открывают надстройку из меню «Добавить вложение» в событии Календаря Google.
JSON-представление |
---|
{
"columnItems": [
{
object ( |
Поля | |
---|---|
columnItems[] | Массив столбцов. Вы можете включить до двух столбцов в карточку или диалог. |
Столбец
Колонка.
JSON-представление |
---|
{ "horizontalSizeStyle": enum ( |
Поля | |
---|---|
horizontalSizeStyle | Указывает, как столбец заполняет ширину карточки. |
horizontalAlignment | Указывает, выравниваются ли виджеты по левому, правому или центру столбца. |
verticalAlignment | Указывает, выравниваются ли виджеты по верху, низу или центру столбца. |
widgets[] | Массив виджетов, включенных в столбец. Виджеты отображаются в том порядке, в котором они указаны. |
Горизонтальныйразмерстиль
Указывает, как столбец заполняет ширину карточки. Ширина каждого столбца зависит как от HorizontalSizeStyle
, так и от ширины виджетов внутри столбца.
Перечисления | |
---|---|
HORIZONTAL_SIZE_STYLE_UNSPECIFIED | Не используйте. Не указано. |
FILL_AVAILABLE_SPACE | Значение по умолчанию. Столбец заполняет доступное пространство до 70 % ширины карты. Если для обоих столбцов установлено значение FILL_AVAILABLE_SPACE , каждый столбец заполняет 50 % пространства. |
FILL_MINIMUM_SPACE | Столбец занимает минимально возможное пространство и не более 30 % ширины карты. |
Горизонтальное выравнивание
Указывает, выравниваются ли виджеты по левому, правому или центру столбца.
Доступно для приложений Google Chat и недоступно для дополнений Google Workspace.
Перечисления | |
---|---|
HORIZONTAL_ALIGNMENT_UNSPECIFIED | Не используйте. Не указано. |
START | Значение по умолчанию. Выравнивает виджеты по начальному положению столбца. Для макетов слева направо — выравнивание по левому краю. Для макетов с направлением письма справа налево выравнивается по правому краю. |
CENTER | Выравнивает виджеты по центру столбца. |
END | Выравнивает виджеты по конечному положению столбца. Для макетов слева направо виджеты выравниваются по правому краю. Для макетов с направлением справа налево виджеты выравниваются по левому краю. |
Вертикальное выравнивание
Указывает, выравниваются ли виджеты по верху, низу или центру столбца.
Перечисления | |
---|---|
VERTICAL_ALIGNMENT_UNSPECIFIED | Не используйте. Не указано. |
CENTER | Значение по умолчанию. Выравнивает виджеты по центру столбца. |
TOP | Выравнивает виджеты по верху столбца. |
BOTTOM | Выравнивает виджеты по нижней части столбца. |
Виджеты
Поддерживаемые виджеты, которые можно включить в столбец.
JSON-представление |
---|
{ // Union field |
Поля | |
---|---|
| |
textParagraph | Виджет |
image | Виджет |
decoratedText | Виджет |
buttonList | Виджет |
textInput | Виджет |
selectionInput | Виджет |
dateTimePicker | Виджет |
chipList | Виджет |
Список чипов
Список фишек, расположенный горизонтально, который можно либо прокручивать по горизонтали, либо переносить на следующую строку.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "layout": enum ( |
Поля | |
---|---|
layout | Указанный макет списка микросхем. |
chips[] | Массив фишек. |
Макет
Схема списка чипов.
Перечисления | |
---|---|
LAYOUT_UNSPECIFIED | Не используйте. Не указано. |
WRAPPED | Значение по умолчанию. Список чипов переносится на следующую строку, если недостаточно места по горизонтали. |
HORIZONTAL_SCROLLABLE | Фишки прокручиваются горизонтально, если не помещаются в доступное пространство. |
Чип
Текст, значок или чип текста и значков, на который пользователи могут щелкнуть.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "icon": { object ( |
Поля | |
---|---|
icon | Изображение значка. Если установлены и |
label | Текст, отображаемый внутри чипа. |
onClick | Необязательно. Действие, которое необходимо выполнить, когда пользователь щелкает чип, например открытие гиперссылки или запуск пользовательской функции. |
enabled | Находится ли чип в активном состоянии и реагирует ли на действия пользователя. По умолчанию |
disabled | Находится ли чип в неактивном состоянии и игнорирует действия пользователя. По умолчанию установлено значение |
altText | Альтернативный текст, используемый для специальных возможностей. Установите описательный текст, который позволит пользователям узнать, что делает чип. Например, если чип открывает гиперссылку, напишите: «Открывает новую вкладку браузера и переходит к документации для разработчиков Google Chat по адресу https://developers.google.com/workspace/chat» . |
Карусель
Карусель, также известная как слайдер, вращается и отображает список виджетов в формате слайд-шоу с кнопками, позволяющими перейти к предыдущему или следующему виджету.
Например, это JSON-представление карусели, содержащей три виджета текстовых абзацев.
{
"carouselCards": [
{
"widgets": [
{
"textParagraph": {
"text": "First text paragraph in carousel",
}
}
]
},
{
"widgets": [
{
"textParagraph": {
"text": "Second text paragraph in carousel",
}
}
]
},
{
"widgets": [
{
"textParagraph": {
"text": "Third text paragraph in carousel",
}
}
]
}
]
}
Доступно для приложений Google Chat и недоступно для дополнений Google Workspace.
JSON-представление |
---|
{
"carouselCards": [
{
object ( |
Поля | |
---|---|
carouselCards[] | Список карточек в карусели. |
КарусельКарточка
Карточка, которую можно отображать в виде карусели. Доступно для приложений Google Chat и недоступно для дополнений Google Workspace.
JSON-представление |
---|
{ "widgets": [ { object ( |
Поля | |
---|---|
widgets[] | Список виджетов, отображаемых в карточке карусели. Виджеты отображаются в том порядке, в котором они указаны. |
footerWidgets[] | Список виджетов отображается внизу карточки карусели. Виджеты отображаются в том порядке, в котором они указаны. |
Вложенный виджет
Список виджетов, которые могут отображаться в содержащем макете, например CarouselCard
. Доступно для приложений Google Chat и недоступно для дополнений Google Workspace.
JSON-представление |
---|
{ // Union field |
Поля | |
---|---|
| |
textParagraph | Виджет текстового абзаца. |
buttonList | Виджет списка кнопок. |
image | Виджет изображения. |
СвернутьControl
Представляет элемент управления развертыванием и свертыванием.
Доступно для приложений Google Chat и дополнений Google Workspace.
JSON-представление |
---|
{ "horizontalAlignment": enum ( |
Поля | |
---|---|
horizontalAlignment | Горизонтальное выравнивание кнопки развернуть и свернуть. |
expandButton | Необязательно. Определите настраиваемую кнопку, чтобы развернуть раздел. Поле «expandButton» и «CrollButton» должно быть установлено. Только один набор полей не вступит в силу. Если это поле не задано, используется кнопка по умолчанию. |
collapseButton | Необязательно. Определите настраиваемую кнопку, чтобы свернуть раздел. Поле «expandButton» и «CrollButton» должно быть установлено. Только один набор полей не вступит в силу. Если это поле не задано, используется кнопка по умолчанию. |
РазделительСтиль
Стиль разделителя карты. В настоящее время используется только для разделителей между разделами карты.
Доступно для приложений Google Chat и дополнений Google Workspace.
Перечисления | |
---|---|
DIVIDER_STYLE_UNSPECIFIED | Не используйте. Не указано. |
SOLID_DIVIDER | Вариант по умолчанию. Создайте сплошной разделитель. |
NO_DIVIDER | Если установлено, разделитель не отображается. Этот стиль полностью удаляет разделитель из макета. Результат эквивалентен тому, что разделитель вообще не добавляется. |
КартаДействие
Действие карты — это действие, связанное с картой. Например, карточка счета-фактуры может включать в себя такие действия, как удаление счета, отправка счета по электронной почте или открытие счета в браузере.
Доступно для надстроек Google Workspace и недоступно для приложений Google Chat.
JSON-представление |
---|
{
"actionLabel": string,
"onClick": {
object ( |
Поля | |
---|---|
actionLabel | Метка, которая отображается как элемент меню действий. |
onClick | Действие |
DisplayStyle
В надстройках Google Workspace определяет, как отображается карточка.
Доступно для надстроек Google Workspace и недоступно для приложений Google Chat.
Перечисления | |
---|---|
DISPLAY_STYLE_UNSPECIFIED | Не используйте. Не указано. |
PEEK | Заголовок карты отображается внизу боковой панели, частично закрывая текущую верхнюю карту стопки. При нажатии на заголовок карточка помещается в стопку карточек. Если у карты нет заголовка, вместо него используется сгенерированный заголовок. |
REPLACE | Значение по умолчанию. Карта отображается путем замены вида верхней карты в стопке карт. |