El widget Columns muestra hasta 2 columnas en una tarjeta o un diálogo. Puedes agregar widgets a cada Column. Los widgets aparecen en el orden en que se especifican. Para ver un ejemplo en las apps de Google Chat, consulta Columnas.
La altura de cada columna está determinada por la columna más alta. Por ejemplo, si la primera columna es más alta que la segunda, ambas columnas tendrán la altura de la primera. Como cada columna puede contener una cantidad diferente de widgets, no puedes definir filas ni alinear widgets entre las columnas.
Las columnas se muestran una al lado de la otra. Puedes personalizar el ancho de cada columna con el campo Horizontal. Si el ancho de la pantalla del usuario es demasiado estrecho, la segunda columna se ajusta debajo de la primera:
- En la Web, la segunda columna se ajusta si el ancho de la pantalla es menor o igual a 480 píxeles.
- En los dispositivos iOS, la segunda columna se ajusta si el ancho de la pantalla es menor o igual a 300 pt.
- En los dispositivos Android, la segunda columna se ajusta si el ancho de la pantalla es menor o igual a 320 dp.
Está disponible para las apps de Google Chat y los complementos de Google Workspace. Las IU de complementos que admiten columnas incluyen las siguientes:
- Es el diálogo que se muestra cuando los usuarios abren el complemento desde un borrador de correo electrónico.
- Es el diálogo que se muestra cuando los usuarios abren el complemento desde el menú Agregar adjunto en un evento de Google Calendar.
// Build a column that is aligned in the center and fills the space: const column = CardService.newColumn() .setHorizontalSizeStyle( CardService.HorizontalSizeStyle.FILL_AVAILABLE_SPACE) .setHorizontalAlignment(CardService.HorizontalAlignment.CENTER) .setVerticalAlignment(CardService.VerticalAlignment.CENTER); const columns = CardService.newColumns().addColumn(column).setWrapStyle( CardService.WrapStyle.WRAP);
Métodos
| Método | Tipo de datos que se muestra | Descripción breve |
|---|---|---|
add | Columns | Agrega un Column al widget Columns. |
add | Widget | Agrega la acción del evento que se puede realizar en el widget. |
set | Widget | Establece el ID único asignado que se usa para identificar el widget que se modificará. |
set | Widget | Establece la visibilidad del widget. |
set | Columns | Establece el estilo de ajuste de las columnas y controla cómo se redimensiona la columna según el ancho de la pantalla. |
Documentación detallada
add
Agrega un Column al widget Columns. Las columnas se muestran en el orden en que se agregan. Puedes agregar hasta dos columnas.
const columns = CardService.newColumns().addColumn(CardService.newColumn());
Parámetros
| Nombre | Tipo | Descripción |
|---|---|---|
column | Column | Es una columna secundaria que se agregará al widget de Columns. |
Volver
Columns: Este objeto, para encadenar.
add
Agrega la acción del evento que se puede realizar en el widget.
Parámetros
| Nombre | Tipo | Descripción |
|---|---|---|
event | Event | Es el Event que se agregará. |
Volver
Widget: El objeto, para encadenar.
set
Establece el ID único asignado que se usa para identificar el widget que se modificará. La mutación de widgets solo se admite en complementos.
Parámetros
| Nombre | Tipo | Descripción |
|---|---|---|
id | String | Es el ID del widget, con un límite de 64 caracteres y en formato de `[a-zA-Z0-9-]+`. |
Volver
Widget: Este objeto, para encadenar.
set
Establece la visibilidad del widget. El valor predeterminado es "VISIBLE".
Parámetros
| Nombre | Tipo | Descripción |
|---|---|---|
visibility | Visibility | Es el Visibility del widget. |
Volver
Widget: El objeto, para encadenar.
set
Establece el estilo de ajuste de las columnas y controla cómo se redimensiona la columna según el ancho de la pantalla.
const columns = CardService.newColumns() .addColumn(CardService.newColumn()) .setWrapStyle(CardService.WrapStyle.WRAP);
Parámetros
| Nombre | Tipo | Descripción |
|---|---|---|
wrap | Wrap | Es el estilo de ajuste que se establecerá para las columnas. |
Volver
Columns: Este objeto, para encadenar.