基于卡片的接口

Google Workspace 插件基于卡片。编辑器插件基于 HTML。

Google Workspace 插件卡片界面示例。

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

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

卡片可以是 非上下文卡片，也可以是 上下文卡片。当宿主应用处于特定上下文中时（例如打开 Gmail 邮件或 Google 日历活动时），系统会向用户显示上下文卡片。 非上下文卡片（例如 首页）会在宿主的特定上下文之外显示给用户，例如，当用户正在 查看其 Gmail 收件箱、主 Google 云端硬盘文件夹或 日历时。

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

每个卡片都包含一个标题以及一个或多个卡片部分。每个部分都 由一组 widget 组成。微件会向用户显示信息或提供互动控件（例如按钮）。

基于卡片的界面具有以下优点：

  • 创建基于卡片的界面无需了解 HTML 或 CSS。
  • 系统会自动为卡片和 widget 设置样式，以便它们与所扩展的 Google Workspace 应用完美搭配。
  • 基于卡片的界面可在桌面设备和移动设备上运行，但您只需定义一次界面。

Gmail 是唯一可以在移动设备上通过 Google Workspace 插件进行扩展的宿主应用。

创建基于卡片的界面

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

创建卡片和实现界面行为时，请参考这些页面。您可能还会发现以下其他示例在实现插件时很有用：