En esta página, se explican las diferencias entre los mensajes de texto y los mensajes de tarjeta.
Cuando las apps de Chat envían mensajes de texto Los mensajes aparecerán intercalados, tal como escriben las personas en Google Chat. mensajes nuevos. Para crear mensajes que contengan más de texto, o bien para crear con los que los usuarios pueden interactuar, las apps de Chat pueden usar tarjetas. Las apps de chat también pueden agregar un mensaje de texto con una tarjeta. Para Indicarles a los usuarios que finalicen procesos de varios pasos, como completar un formulario, Las apps de Chat también pueden crear tarjetas que se abren en una ventana nueva como diálogos
Anatomía de un mensaje de texto
En la API de Google Chat, los mensajes se representan como objetos JSON. Dentro de un mensaje,
un mensaje de texto se representa como un
text
.
En la siguiente Por ejemplo, una app de Chat crea un mensaje de texto en un espacio para un equipo de desarrolladores de software que se acerca una congelación de código:
{
"text": "Attention <users/all>: Code freeze starts at `11:59 am` Pacific Standard Time! If you need a little more time, type `/moreTime` and I'll push the code freeze back one hour."
}
JSON muestra el siguiente mensaje:
Anatomía de un mensaje de tarjeta
En la API de Google Chat, los mensajes se representan como objetos JSON. En un mensaje
una tarjeta se representa como un
cardsV2
array y consta de lo siguiente:
- Uno o más
Objetos
CardWithId
. - Una
cardId
, que se usa para identificar la tarjeta y su alcance dentro de un mensaje determinado (Las tarjetas en los mensajes diferentes pueden tener el mismo ID). Un objeto
card
, que consta de lo siguiente:- Un objeto
header
que especifica elementos como un título, un subtítulo o una imagen con estilo de avatar. - Uno o más
Objetos
section
que cada una contenga al menos un widget. - Uno o más
Objetos
widget
. Cada widget es un objeto compuesto que puede representar texto, imágenes, botones y otros tipos de objetos.
- Un objeto
A modo de ejemplo, el siguiente mensaje de tarjeta contiene
header
:
section
y
Objetos widget
:
El siguiente código representa el JSON del mensaje de la tarjeta:
JSON
{
"cardsV2": [
{
"cardId": "unique-card-id",
"card": {
"header": {
"title": "Sasha",
"subtitle": "Software Engineer",
"imageUrl": "https://developers.google.com/chat/images/quickstart-app-avatar.png",
"imageType": "CIRCLE",
"imageAltText": "Avatar for Sasha"
},
"sections": [
{
"header": "Contact Info",
"collapsible": true,
"uncollapsibleWidgetsCount": 1,
"widgets": [
{
"decoratedText": {
"startIcon": {
"knownIcon": "EMAIL"
},
"text": "sasha@example.com"
}
},
{
"decoratedText": {
"startIcon": {
"knownIcon": "PERSON"
},
"text": "<font color=\"#80e27e\">Online</font>"
}
},
{
"decoratedText": {
"startIcon": {
"knownIcon": "PHONE"
},
"text": "+1 (555) 555-1234"
}
},
{
"buttonList": {
"buttons": [
{
"text": "Share",
"onClick": {
"openLink": {
"url": "https://example.com/share"
}
}
},
{
"text": "Edit",
"onClick": {
"action": {
"function": "goToView",
"parameters": [
{
"key": "viewType",
"value": "EDIT"
}
]
}
}
}
]
}
}
]
}
]
}
}
]
}
Usa Card Builder para diseñar mensajes de tarjetas JSON y obtener una vista previa de ellos para apps de Chat:
Abre el Creador de tarjetas