Надстройки Google Workspace представляют информацию и элементы управления пользователя на боковой панели пользовательского интерфейса хост-приложения . Надстройка состоит из главной идентификационной панели инструментов вместе с одной или несколькими карточками .
Каждая карточка представляет собой определенную «страницу» пользовательского интерфейса вашего дополнения, и переход к новой карточке обычно заключается в создании этой карточки и помещении ее во внутреннюю стопку карточек . Вы можете определить потоки навигации между карточками для более насыщенного взаимодействия.
Карточки могут быть неконтекстными или контекстными . Контекстные карточки отображаются для пользователя, когда хост-приложение находится в определенном контексте. Например, при открытии сообщения Gmail или события Календаря. Неконтекстные карточки (например, домашние страницы ) отображаются для пользователя вне определенного контекста хоста. Например, когда пользователь просматривает свой почтовый ящик Gmail, основную папку Диска или Календарь.
Надстройки Google Workspace, встроенные в Apps Script, используют службу Card для создания пользовательских интерфейсов из карточек . Надстройки, встроенные в другие языки, должны возвращать правильно отформатированный JSON для интерфейса, отображаемого как карточки.
Каждая карточка состоит из заголовка и одного или нескольких разделов карточки. Каждый раздел состоит из набора виджетов . Виджеты отображают информацию для пользователя или предоставляют элементы управления взаимодействием, такие как кнопки.
Интерфейсы на основе карт имеют следующие преимущества:
- Для создания карточных интерфейсов не требуется никаких знаний HTML или CSS.
- Карточки и виджеты автоматически стилизуются для оптимальной работы с приложениями Google Workspace, которые они расширяют.
Интерфейсы на основе карт работают как на настольных компьютерах, так и на мобильных устройствах, но вам нужно определить интерфейс только один раз.
Создание карточных интерфейсов
При создании дополнений на основе карточек важно понимать определенные концепции и шаблоны проектирования. Следующие руководства предоставляют информацию, необходимую для создания эффективных дополнений на основе карточек:
- Карты
- Домашние страницы
- Виджеты
- Действия
- Объекты событий
- Создание карт
- Создание интерактивных карточек
- Навигация между карточками
- Использование универсальных действий
- Добавление автозаполнения к текстовым полям
- Доступ к локациям и часовым поясам пользователей
- Подключение к сторонним сервисам
- Руководство по стилю
- Лучшие практики
Ссылайтесь на эти страницы при создании карточек и реализации поведения пользовательского интерфейса. Вы также можете найти следующие дополнительные примеры полезными для ссылки при реализации вашего дополнения:
Краткое руководство по дополнению Google Workspace «Кошки»
В этом примере надстройки показан простой пользовательский интерфейс надстройки Google Workspace с несколькими страницами и домашними страницами.
Дополнение Google Workspace: «Переводчик»
В этом примере показано дополнение Google Workspace, которое позволяет пользователям переводить текст из Документов, Таблиц и Презентаций.
Дополнение Google Workspace: «Список команд»
Этот пример надстройки показывает более сложный пример надстройки Google Workspace, которая показывает информацию о пользователях, получателях сообщений Gmail, редакторах файлов Drive или участниках событий Calendar. Вы можете использовать эту надстройку только внутри домена, так как она использует API каталога для получения информации о пользователях.