Los complementos de Google Workspace presentan información y controles de usuario en la barra lateral de la IU de la aplicación host. Un complemento consiste en una barra de herramientas de identificación principal junto con una o más tarjetas.
Cada tarjeta representa una "página" particular de la IU de tu complemento y, por lo general, navegar a una tarjeta nueva es solo cuestión de crear esa tarjeta y enviarla a una pila de tarjetas interna. Puedes definir flujos de navegación entre tarjetas para brindar una experiencia de interacción enriquecida.
Las tarjetas pueden ser no contextuales o contextuales. Las tarjetas contextuales se presentan al usuario cuando la aplicación host se encuentra en un contexto específico. Por ejemplo, al abrir un mensaje de Gmail o un evento del Calendario. Las tarjetas no contextuales (como las páginas principales) se presentan al usuario fuera de un contexto específico del host. Por ejemplo, cuando el usuario ve su carpeta Recibidos de Gmail, la carpeta principal de Drive o el Calendario.
Los complementos de Google Workspace integrados en Apps Script usan el servicio de tarjeta para crear interfaces de usuario a partir de tarjetas. Los complementos compilados en otros lenguajes deben mostrar JSON con el formato correcto para que la interfaz se renderice como tarjetas.
Cada tarjeta consta de un encabezado y una o más secciones de tarjetas. Cada sección está compuesta por un conjunto de widgets. Los widgets muestran información al usuario o proporcionan controles de interacción, como botones.
Las interfaces basadas en tarjetas tienen los siguientes beneficios:
- No es necesario tener conocimientos de HTML o CSS para crear interfaces basadas en tarjetas.
- El estilo de las tarjetas y los widgets se ajusta automáticamente para que funcione bien con las aplicaciones de Google Workspace que extienden.
Las interfaces basadas en tarjetas funcionan tanto en computadoras de escritorio como en dispositivos móviles, pero solo debes definir la interfaz una vez.
Crea interfaces basadas en tarjetas
Cuando compilas complementos basados en tarjetas, es importante comprender ciertos conceptos y patrones de diseño. Las siguientes guías proporcionan la información que necesitas para compilar complementos eficaces basados en tarjetas:
- Tarjetas
- Páginas principales
- Widgets
- Actions
- Objetos de evento
- Cómo crear tarjetas
- Cómo crear tarjetas interactivas
- Cómo navegar entre tarjetas
- Cómo usar acciones universales
- Agrega Autocomplete a las entradas de texto
- Cómo acceder a la configuración regional y las zonas horarias del usuario
- Conexión a servicios que no son de Google
- Guía de estilo
- Prácticas recomendadas
Consulta estas páginas cuando crees tarjetas e implementes el comportamiento de la IU. Los siguientes ejemplos adicionales también pueden resultarte útiles como referencia cuando implementes tu complemento:
Guía de inicio rápido del complemento de Google Workspace “Gatos”
En este complemento de muestra, se muestra una IU simple de complemento de Google Workspace con varias páginas y páginas principales.
Complemento de Google Workspace: “Traducir”
En esta muestra, se presenta un complemento de Google Workspace que permite a los usuarios traducir texto de Documentos, Hojas de cálculo y Presentaciones.
Complemento de Google Workspace: “Lista de equipos”
En esta muestra, se presenta una muestra más compleja del complemento de Google Workspace, en la que se muestra información del usuario sobre los destinatarios de mensajes de Gmail, los editores de archivos de Drive o los asistentes a eventos de Calendario. Solo puedes usar este complemento dentro de un dominio, ya que usa la API de Directory para recuperar la información del usuario.