หน้านี้จะอธิบายความแตกต่างระหว่างข้อความตัวอักษรและการ์ด
เมื่อแอป Chat ส่งข้อความเพื่อสื่อสารข้อมูลพื้นฐาน ข้อความดังกล่าวจะปรากฏในบรรทัดในลักษณะเดียวกับที่ผู้ใช้ใน Google Chat เขียนข้อความ หากต้องการสร้างข้อความที่มีมากกว่า SMS หรือสร้างข้อความที่ให้ผู้ใช้โต้ตอบด้วยได้ แอปใน Chat จะใช้การ์ดได้ แอปแชทยังเพิ่มข้อความต่อท้ายได้ด้วย นอกจากนี้ แอป Chat ยังสร้างการ์ดที่เปิดในหน้าต่างใหม่เป็นกล่องโต้ตอบเพื่อแจ้งให้ผู้ใช้ดำเนินการตามขั้นตอนต่างๆ ให้เสร็จสิ้นได้ เช่น การกรอกแบบฟอร์ม
โครงสร้างของข้อความ
ใน Google Chat API ข้อความจะแสดงเป็นออบเจ็กต์ JSON ภายในข้อความ
ข้อความตัวอักษรจะแสดงเป็นออบเจ็กต์
text
ในตัวอย่างต่อไปนี้ แอป Chat จะสร้างข้อความในพื้นที่ทำงานให้กับทีมนักพัฒนาซอฟต์แวร์ที่ระบุว่ากำลังจะเกิดการตรึงโค้ด
{
"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 แสดงข้อความต่อไปนี้
โครงสร้างของข้อความในการ์ด
ใน Google Chat API ข้อความจะแสดงเป็นออบเจ็กต์ JSON ภายในข้อความ การ์ดจะแสดงเป็นอาร์เรย์ cardsV2
และประกอบด้วยสิ่งต่อไปนี้
- ออบเจ็กต์
CardWithId
รายการอย่างน้อย 1 รายการ cardId
ที่ใช้เพื่อระบุการ์ดและกำหนดขอบเขตภายในข้อความที่ระบุ (การ์ดในข้อความที่ต่างกันอาจมีรหัสเดียวกัน)ออบเจ็กต์
card
ซึ่งประกอบด้วยองค์ประกอบต่อไปนี้header
ออบเจ็กต์ที่ระบุสิ่งต่างๆ เช่น ชื่อ ชื่อรอง และรูปภาพแบบอวาตาร์- มีออบเจ็กต์
section
รายการอย่างน้อย 1 รายการ โดยแต่ละรายการมีวิดเจ็ตอย่างน้อย 1 รายการ - ออบเจ็กต์
widget
รายการอย่างน้อย 1 รายการ วิดเจ็ตแต่ละรายการเป็นออบเจ็กต์ผสมที่สามารถแสดงถึงข้อความ รูปภาพ ปุ่ม และออบเจ็กต์ประเภทอื่นๆ
เช่น ข้อความในการ์ดต่อไปนี้ประกอบด้วยออบเจ็กต์
header
,
section
และ
widget
รหัสต่อไปนี้แสดง JSON ของข้อความการ์ด
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"
}
]
}
}
}
]
}
}
]
}
]
}
}
]
}
ออกแบบและแสดงตัวอย่างการ์ดด้วยเครื่องมือสร้างการ์ด
เปิดเครื่องมือสร้างการ์ด