El widget DecoratedText
muestra texto con diseño opcional y funciones de funcionalidad. Por ejemplo:
- Muestra un
icon
delante del texto constartIcon
. - Muestra un título antes del texto con
topLabel
. - Agrega un botón en el que se puede hacer clic con
button
o un botón de activación conmutable conswitchControl
.
Usa el widget DecoratedText
cuando necesites presentar información de una manera interactiva y fácil de consumir. El widget es perfecto para tarjetas de contacto, actualizaciones del estado de pedidos y notificaciones de tickets de trabajo.
La siguiente es una tarjeta que consta de un widget DecoratedText
que se usa para mostrar detalles de contacto, como la dirección de correo electrónico, el estado en línea, el número de teléfono y el sitio web:
Dale formato al texto en un widget DecoratedText
El widget DecoratedText
admite el formato HTML de texto simple. Cuando configures el contenido de texto de estos widgets, solo incluye las etiquetas HTML correspondientes. Para obtener más información sobre las etiquetas HTML compatibles, consulta Formato del texto de la tarjeta.
Representación y campos JSON
Representación JSON |
---|
{ "icon": { object ( |
Campos | |
---|---|
icon
|
Se dio de baja y se reemplazó por |
startIcon
|
El ícono que se muestra delante del texto. |
topLabel
|
Es el texto que aparece sobre |
text
|
Obligatorio. Es el texto principal. Admite un formato simple. Para obtener más información sobre cómo dar formato al texto, consulta Da formato al texto en apps de Google Chat y Da formato al texto en complementos de Google Workspace. |
wrapText
|
El parámetro de configuración Ajustar texto Si es
Solo se aplica a |
bottomLabel
|
El texto que aparece debajo de |
onClick
|
Esta acción se activa cuando los usuarios hacen clic en |
Campo de unión control . Un botón, interruptor, casilla de verificación o imagen que aparece en el lado derecho del texto en el widget decoratedText
control solo puede ser una de las siguientes opciones:
|
|
button
|
Es un botón en el que un usuario puede hacer clic para activar una acción. |
switchControl
|
Es un widget de interruptor en el que un usuario puede hacer clic para cambiar su estado y activar una acción. |
endIcon
|
Un ícono que aparece después del texto. Admite íconos integrados y personalizados. |
Ícono
Un ícono que se muestra en un widget en una tarjeta. Para ver un ejemplo en las apps de Google Chat, consulta Ícono.
Admite íconos integrados y personalizados.
Representación JSON |
---|
{ "altText": string, "imageType": enum ( |
Campos | |
---|---|
altText
|
Opcional. Es una descripción del ícono que se usa con fines de accesibilidad. Si no se especifica, se proporciona el valor predeterminado
Si se establece el ícono en una |
imageType
|
El estilo de recorte aplicado a la imagen. En algunos casos, aplicar un recorte |
Campo de unión icons . El ícono que se muestra en el widget de la tarjeta.
icons solo puede ser una de las siguientes opciones:
|
|
knownIcon
|
Muestra uno de los íconos integrados que proporciona Google Workspace.
Por ejemplo, para mostrar un ícono de avión, especifica Para obtener una lista completa de los íconos compatibles, consulta íconos integrados. |
iconUrl
|
Muestra un ícono personalizado alojado en una URL HTTPS. Por ejemplo:
Entre los tipos de archivo admitidos, se incluyen |
Tipo de imagen
La forma que se usa para recortar la imagen.
Enumeradores | |
---|---|
SQUARE
|
Valor predeterminado Aplica una máscara cuadrada a la imagen. Por ejemplo, una imagen de 4 × 3 se convierte en 3 × 3. |
CIRCLE
|
Aplica una máscara circular a la imagen. Por ejemplo, una imagen de 4 x 3 se convierte en un círculo con un diámetro de 3. |
Al hacer clic
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 |
Campos | |
---|---|
Campo de unión
|
|
action
|
Si se especifica, este |
openLink
|
Si se especifica, este |
openDynamicLinkAction
|
Un complemento activa esta acción cuando la acción necesita abrir un vínculo. Esto difiere de |
card
|
Si se especifica, se envía una nueva tarjeta a la pila de tarjetas después de hacer clic. Compatible 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 ( |
Campos | |
---|---|
function
|
Es una función personalizada que se invoca cuando se hace clic en el elemento contenedor o se activa de forma manual. Para ver ejemplos de uso, consulta Cómo crear tarjetas interactivas. |
parameters[]
|
Lista de parámetros de acción. |
loadIndicator
|
Especifica el indicador de carga que muestra la acción mientras se realiza la llamada a la acción. |
persistValues
|
Indica si los valores del formulario persisten después de la acción. El valor predeterminado es
Si es
Si es |
interaction
|
Opcional. Es obligatorio cuando se abre 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 ejecutando un
Cuando se especifica un Compatible con las apps de Chat, pero no con los complementos de Google Workspace. Si se especifica para un complemento, se quita toda la tarjeta y no se muestra nada en el cliente. |
OpenLink
Representa un evento onClick
que abre un hipervínculo.
Representación JSON |
---|
{ "url": string, "openAs": enum ( |
Campos | |
---|---|
url
|
La URL que se abrirá. |
openAs
|
Cómo abrir un vínculo No es compatible con las apps de Chat. |
onClose
|
Si el cliente se olvida de un vínculo después de abrirlo o si lo observa hasta que se cierra la ventana. No es compatible con las apps de Chat. |
Botón
Es un texto, un ícono o un botón de texto y ícono en el que los usuarios pueden hacer clic. Para ver un ejemplo en las apps de Google Chat, consulta la Lista de botones.
Para convertir una imagen en un botón en el que se pueda hacer clic, especifica un
(no un Image
) y configura una acción ImageComponent
onClick
.
Representación JSON |
---|
{ "text": string, "icon": { object ( |
Campos | |
---|---|
text
|
Es el texto que se muestra dentro del botón. |
icon
|
Imagen del ícono Si se configuran |
color
|
Si se configura, el botón se rellena con un color de fondo sólido y el color de la fuente cambia para mantener el contraste con el color de fondo. Por ejemplo, si estableces un fondo azul, es probable que el resultado sea un texto blanco. Si no la estableces, el fondo de la imagen será blanco y el color de la fuente será azul.
Para el rojo, el verde y el azul, el valor de cada campo es un número
De manera opcional, configura
Para Por ejemplo, el siguiente color representa un rojo transparente medio:
|
onClick
|
Obligatorio. Es la acción que se realiza cuando un usuario hace clic en el botón, como abrir un hipervínculo o ejecutar una función personalizada. |
disabled
|
Si es |
altText
|
Texto alternativo que se utiliza para la accesibilidad. Establece un texto descriptivo que informe a los usuarios lo que hace el botón. Por ejemplo, si un botón abre un hipervínculo, puedes escribir lo siguiente: “Abre una nueva pestaña del navegador y navega a la documentación para desarrolladores de Google Chat en https://developers.google.com/chat”. |
SwitchControl
Un interruptor de estilo de activación o una casilla de verificación dentro de un widget decoratedText
Solo se admite en el widget decoratedText
.
Representación JSON |
---|
{ "name": string, "value": string, "selected": boolean, "onChangeAction": { object ( |
Campos | |
---|---|
name
|
El nombre con el que se identifica el widget de interruptor en un evento de entrada de formulario. Para obtener más información sobre cómo trabajar con entradas de formularios, consulta Recibe datos de formularios. |
value
|
Es el valor ingresado por un usuario, que se muestra como parte de un evento de entrada de un formulario. Para obtener más información sobre cómo trabajar con entradas de formularios, consulta Recibe datos de formularios. |
selected
|
Cuando es |
onChangeAction
|
La acción que se realiza cuando cambia el estado del interruptor, por ejemplo, qué función se debe ejecutar. |
controlType
|
Cómo aparece el interruptor en la interfaz de usuario |
Solución de problemas
Cuando una app de Google Chat o una tarjeta muestran un error, la interfaz de Chat muestra un mensaje que dice “Se produjo un error” o “No se pudo procesar la solicitud”. A veces, la IU de Chat no muestra ningún mensaje de error, pero la app o 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 para apps de chat. Si necesitas ayuda para ver, depurar y corregir errores, consulta Cómo solucionar problemas de Google Chat.