Tarjetas

Un complemento basado en tarjetas aparece como un panel en la barra lateral (o, en dispositivos móviles, como otra ventana de actividad a la que se llega desde el menú). El complemento tiene una barra de herramientas superior que identifica el complemento y muestra una tarjeta, es decir, una "página" de la IU del complemento. Apps Script representa tarjetas en el código del proyecto mediante objetos Card.

Anatomía de una tarjeta

Ejemplo de tarjeta de complemento

Una tarjeta es un grupo de elementos de la interfaz de usuario que diseñas. Una tarjeta consta de las siguientes secciones:

  • Un encabezado de tarjeta. Esto identifica las tarjetas. Tiene texto de título y, opcionalmente, un subtítulo y un ícono.
  • Una o más secciones de tarjetas. Estas son subdivisiones del área de la IU de la tarjeta. De manera opcional, una sección puede tener un encabezado de sección de texto. Las secciones de tarjetas están separadas entre sí en la tarjeta por una regla horizontal. Si la sección de una tarjeta es muy grande, se renderiza automáticamente como una sección que se puede contraer y que los usuarios pueden expandir o contraer según sea necesario. Una tarjeta no puede tener más de 100 secciones de tarjetas y debe tener solo algunas para lograr un mejor rendimiento.

  • Cada sección de tarjetas contiene uno o más widgets de la IU. Los widgets brindan al usuario información o controles interactivos. Las secciones de tarjetas y de tarjetas son widgets estructurales, por lo que no puedes agregarlos a una sección de tarjetas. Una sección de tarjetas no puede tener más de 100 widgets y debe ser lo más simple posible para obtener el mejor rendimiento.

Debes diseñar tarjetas en torno a actividades del usuario o conjuntos de datos particulares. Por ejemplo, un complemento de Google Workspace que muestra datos tomados de Hojas de cálculo de Google puede tener una tarjeta diferente para cada hoja de la que extrae datos.

Cómo usar varias tarjetas

Ejemplo de tarjeta de complemento

Por lo general, los complementos constan de más de una tarjeta. Puedes configurar estas tarjetas como una lista simple para la navegación básica con varias tarjetas o puedes configurar métodos de navegación más complejos para controlar cómo se mueve el usuario entre las tarjetas.

Si el complemento usa la navegación básica, cuando se abre por primera vez el complemento, la aplicación de Google Workspace extiende una lista de los encabezados de las tarjetas y se los presenta al usuario. Al hacer clic en el encabezado de la tarjeta, se abre. También se proporciona una flecha hacia atrás para volver a la lista de encabezados de tarjetas. No es necesario que codifiques la funcionalidad de encabezado y flecha hacia atrás, ya que esto se hace automáticamente cuando defines las tarjetas en tu complemento.

Cuando diseñas complementos, es mejor limitar la cantidad de tarjetas que se muestran a la vez, ya que deben compartir una cantidad limitada de espacio en pantalla. También se recomienda evitar la complejidad innecesaria en las tarjetas.