基于卡片的接口

插件卡片示例

Google Workspace 加载项会在宿主应用的界面侧边栏中显示信息和用户控件。插件由一个主要识别工具栏以及一个或多个卡片组成。

每张卡片都代表插件界面的特定“页面”,而导航到新卡片通常只需创建该卡片并将其推送到内部卡片堆栈即可。您可以定义卡片之间的导航流程,以实现丰富的互动体验。

卡片可以是非情境化的,也可以是情境化的。当宿主应用处于特定情境时,系统会向用户显示情境卡片。例如,打开 Gmail 邮件或日历活动时。非情境化卡片(例如首页)会在宿主应用的特定情境之外呈现给用户。例如,当用户查看其 Gmail 收件箱、云端硬盘主文件夹或日历时。

使用 Apps 脚本构建的 Google Workspace 插件使用卡片服务通过卡片创建用户界面。以其他语言构建的插件必须返回格式正确的 JSON,才能使界面呈现为卡片。

每张卡片都包含一个标题和一个或多个卡片部分。每个部分都由一组微件组成。微件可向用户显示信息或提供按钮等互动控件。

基于卡片的界面具有以下优势:

  • 无需具备 HTML 或 CSS 知识即可创建基于卡片的界面。
  • 卡片和 widget 会自动设置样式,以便与它们扩展的 Google Workspace 应用搭配使用。
  • 基于卡片的界面可在桌面设备和移动设备上运行,但您只需定义一次界面。

创建卡片式界面

在构建基于卡片的插件时,请务必了解某些概念和设计模式。以下指南提供了构建有效的卡片式插件所需的信息:

在创建卡片和实现界面行为时,请参考这些页面。您可能还会发现以下其他示例有助于您在实现插件时进行参考: