Grid

El widget Grid muestra una cuadrícula con una colección de elementos.

El widget admite sugerencias, que ayudan a los usuarios a ingresar datos uniformes, y acciones ante cambios, que son Actions, y se ejecutan cuando se produce un cambio en el campo de entrada de texto, como cuando un usuario agrega o borra texto.

Una cuadrícula admite cualquier cantidad de columnas y elementos. El número de filas está determinado por los elementos divididos por columnas. Una cuadrícula con 10 elementos y 2 columnas tiene 5 filas. Una cuadrícula con 11 elementos y 2 columnas tiene 6 filas.

Ejemplo: una cuadrícula de dos columnas con un solo elemento

A continuación, se muestra un diálogo que consta de un widget grid. Crea una cuadrícula de 2 columnas con un solo elemento.

Representación de JSON y campos

Representación JSON 
{
  "title": string,
  "items": [
    {
      object (GridItem)
    }
  ],
  "borderStyle": {
    object (BorderStyle)
  },
  "columnCount": integer,
  "onClick": {
    object (OnClick)
  }
}
Campos
title

string

El texto que se muestra en el encabezado de la cuadrícula.

items[]

object (GridItem)

Los elementos que se mostrarán en la cuadrícula.

borderStyle

object (BorderStyle)

El estilo de borde que se aplicará a cada elemento de la cuadrícula.

columnCount

integer

El número de columnas que se mostrarán en la cuadrícula. Si no se especifica este campo, se usa un valor predeterminado, que será diferente según el lugar en el que se muestre la cuadrícula (diálogo o complementario).

onClick

object (OnClick)

Cada elemento individual de la cuadrícula vuelve a usar esta devolución de llamada, pero con el identificador y el índice del elemento en la lista de elementos agregados a los parámetros de la devolución de llamada.

GridItem

Representación JSON 
{
  "id": string,
  "image": {
    object (ImageComponent)
  },
  "title": string,
  "subtitle": string,
  "layout": enum (GridItemLayout)
}
Campos
id

string

Un identificador especificado por el usuario para este elemento de la cuadrícula. Este identificador se muestra en los parámetros de devolución de llamada onClick de la cuadrícula superior.

image

object (ImageComponent)

Imagen que se muestra en el elemento de la cuadrícula.

title

string

Título del elemento de la cuadrícula.

subtitle

string

Subtítulo del elemento de la cuadrícula.

layout

enum (GridItemLayout)

Es el diseño que se usará para el elemento de cuadrícula.

BorderStyle

Representación JSON 
{
  "type": enum (BorderType),
  "strokeColor": {
    object (Color)
  },
  "cornerRadius": integer
}
Campos
type

enum (BorderType)

Es el tipo de borde.

strokeColor

object (Color)

Son los colores que se usarán cuando el tipo sea BORDER_TYPE_STROKE.

cornerRadius

integer

Radio de esquina del borde.

BorderType

Enumeradores
BORDER_TYPE_UNSPECIFIED No utilizar. No se especifica.
NO_BORDER Valor predeterminado Sin borde
STROKE Esquema

Color

Representación JSON 
{
  "red": number,
  "green": number,
  "blue": number,
  "alpha": number
}
Campos
red

number

La cantidad de rojo en el color como un valor en el intervalo [0, 1].

green

number

La cantidad de verde en el color como un valor en el intervalo [0, 1].

blue

number

La cantidad de azul en el color como un valor en el intervalo [0, 1].

alpha

number

La fracción de este color que se debe aplicar al píxel. Es decir, el color del píxel final se define mediante la siguiente ecuación:

pixel color = alpha * (this color) + (1.0 - alpha) * (background color)

Esto significa que el valor 1.0 corresponde a un color sólido, mientras que el valor 0.0 corresponde a un color completamente transparente. Esto utiliza un mensaje de wrapper en lugar de un escalar flotante simple, para que sea posible distinguir entre un valor predeterminado y el valor que no se configura. Si se omite, este objeto de color se representa como un color sólido (como si al valor alfa se le hubiera asignado explícitamente un valor de 1.0).

OnClick

Representa cómo responder cuando los usuarios hacen clic en un elemento interactivo en una tarjeta, como un botón.

Representación JSON 
{

  // Union field data can be only one of the following:
  "action": {
    object (Action)
  },
  "openLink": {
    object (OpenLink)
  },
  "openDynamicLinkAction": {
    object (Action)
  },
  "card": {
    object (Card)
  }
  // End of list of possible types for union field data.
}
Campos

Campo de unión data.

data solo puede ser una de las siguientes opciones:

action

object (Action)

Si se especifica, esta onClick activa una acción.

card

object (Card)

Si se especifica, se envía una nueva tarjeta a la pila de tarjetas después de hacer clic.

Son compatibles con los complementos de Google Workspace, pero no con las apps de Google Chat.

Acción

Una acción que describe el comportamiento cuando se envía el formulario. Por ejemplo, puedes invocar una secuencia de comandos de Apps Script para controlar el formulario. Si se activa la acción, los valores del formulario se envían al servidor.

Representación JSON 
{
  "function": string,
  "parameters": [
    {
      object (ActionParameter)
    }
  ],
  "loadIndicator": enum (LoadIndicator),
  "persistValues": boolean,
  "interaction": enum (Interaction)
}
Campos
function

string

Es una función personalizada que se invoca cuando se hace clic en el elemento contenedor o se activa de otro modo.

Para ver ejemplos de uso, consulta Cómo crear tarjetas interactivas.

parameters[]

object (ActionParameter)

Lista de parámetros de acción.

loadIndicator

enum (LoadIndicator)

Especifica el indicador de carga que muestra la acción mientras se realiza la llamada a la acción.

persistValues

boolean

Indica si los valores del formulario persisten después de la acción. El valor predeterminado es false.

Si es true, los valores del formulario permanecen después de que se activa la acción. Para permitir que el usuario realice cambios mientras se procesa la acción, configura LoadIndicator como NONE. Para los mensajes de tarjetas en las apps de Chat, también debes configurar el ResponseType de la acción en UPDATE_MESSAGE y usar el mismo cardId de la tarjeta que contenía la acción.

Si es false, los valores del formulario se borran cuando se activa la acción. Para evitar que el usuario haga cambios mientras se procesa la acción, establece LoadIndicator en SPINNER.

interaction

enum (Interaction)

Opcional. Es obligatorio al abrir un diálogo.

Qué hacer en respuesta a una interacción con un usuario, como cuando un usuario hace clic en un botón en un mensaje de tarjeta.

Si no se especifica, la app responde con la ejecución normal de un elemento action, como abrir un vínculo o ejecutar una función.

Cuando se especifica un interaction, la app puede responder de maneras interactivas especiales. Por ejemplo, si estableces interaction en OPEN_DIALOG, la app podrá abrir un diálogo. Cuando se especifica, no se muestra un indicador de carga.

Son compatibles con las apps de Chat, pero no los complementos de Google Workspace. Si se especifica para un complemento, se quitará toda la tarjeta y no se mostrará nada en el cliente.

Solución de problemas

Cuando una app o tarjeta de Google Chat devuelve un error, la interfaz de Chat muestra un mensaje que dice “Se produjo un error” o “No se pudo procesar tu solicitud”. A veces, la IU de Chat no muestra ningún mensaje de error, pero la app o la tarjeta de Chat producen un resultado inesperado; por ejemplo, es posible que no aparezca un mensaje de tarjeta.

Aunque es posible que no se muestre un mensaje de error en la IU de Chat, hay mensajes de error descriptivos y datos de registro disponibles para ayudarte a corregir errores cuando se activa el registro de errores de las apps de chat. Si necesitas ayuda para ver, depurar y corregir errores, consulta Cómo solucionar y corregir errores de Google Chat.