หน้านี้อธิบายวิธีออกแบบและสร้างคอมโพเนนต์ UI หลักของข้อความการ์ดใน Google Chat
การ์ดรองรับเลย์เอาต์ที่กำหนดไว้ องค์ประกอบ UI แบบอินเทอร์แอกทีฟ เช่น ปุ่ม และริชมีเดียอย่างรูปภาพ คุณสามารถใช้การ์ดเพื่อนำเสนอข้อมูล รวบรวมข้อมูล หรือบอกขั้นตอนถัดไปแก่ผู้ใช้ผ่านข้อความในการ์ดและกล่องโต้ตอบ
ออกแบบและแสดงตัวอย่างการ์ดด้วยเครื่องมือสร้างการ์ด
เปิดเครื่องมือสร้างการ์ดโดยทั่วไปแล้วการ์ดและกล่องโต้ตอบจะมีองค์ประกอบดังต่อไปนี้
CardHeaderที่มีชื่อบัตรของคุณ- วิดเจ็ต
CardSectionอย่างน้อย 1 ชิ้นที่ประกอบเป็นเนื้อหาหลักของการ์ด - วิดเจ็ต
CardFixedFooterสำหรับกล่องโต้ตอบเท่านั้น
ข้อกำหนดเบื้องต้น
เพิ่มส่วนหัว
วิดเจ็ต CardHeader จะแสดงส่วนหัวของการ์ด ส่วนหัวสามารถประกอบด้วยชื่อ
ชื่อรอง และรูปโปรไฟล์สำหรับการ์ด
คุณใส่ CardHeader สำหรับข้อความในการ์ดและกล่องโต้ตอบได้
ต่อไปนี้คือตัวอย่างของ CardHeader
กำหนดส่วนของการ์ด
วิดเจ็ต CardSection เป็นคอนเทนเนอร์ระดับสูงภายในการ์ด คุณใช้ส่วนการ์ดเพื่อจัดกลุ่มวิดเจ็ตภายในการ์ดได้ สำหรับส่วนของการ์ดแต่ละส่วน
คุณสามารถใส่ส่วนหัวและวิดเจ็ตได้ตั้งแต่ 1 ชิ้นขึ้นไป
คุณใส่ CardSection สำหรับข้อความในการ์ดและกล่องโต้ตอบได้
ต่อไปนี้คือตัวอย่างของ CardSection ที่มีวิดเจ็ต textParagraph 2 รายการ
เพิ่มส่วนท้ายถาวร
วิดเจ็ต CardFixedFooter
แสดงส่วนท้ายของข้อความโต้ตอบที่ส่งโดยแอป Chat
ส่วนท้ายอาจมีปุ่มหลักและปุ่มรอง
วิดเจ็ต CardFixedFooter ใช้ได้กับกล่องโต้ตอบเท่านั้น
ต่อไปนี้เป็นตัวอย่างของวิดเจ็ต CardFixedFooter ที่มี 2 ปุ่ม
แก้ปัญหา
เมื่อแอป Google Chat หรือการ์ดแสดงผลข้อผิดพลาด อินเทอร์เฟซ Chat จะแสดงข้อความว่า "เกิดข้อผิดพลาด" หรือ "ดำเนินการตามคำขอของคุณไม่ได้" บางครั้ง UI ของ Chat ไม่แสดงข้อความแสดงข้อผิดพลาด แต่แอปหรือการ์ด Chat จะให้ผลลัพธ์ที่ไม่คาดคิด เช่น ข้อความการ์ดอาจไม่ปรากฏ
แม้ว่าข้อความแสดงข้อผิดพลาดอาจไม่แสดงใน UI ของ Chat แต่ก็จะมีข้อความแสดงข้อผิดพลาดที่สื่อความหมายและข้อมูลบันทึกที่จะช่วยคุณแก้ไขข้อผิดพลาดเมื่อเปิดการบันทึกข้อผิดพลาดสำหรับแอป Chat ไว้ หากต้องการความช่วยเหลือในการดู แก้ไขข้อบกพร่อง และแก้ไขข้อผิดพลาด โปรดดูหัวข้อแก้ปัญหาและแก้ไขข้อผิดพลาดของ Google Chat