Package google.apps.card.v1

string

ฟังก์ชันที่กำหนดเองที่จะเรียกใช้เมื่อมีการคลิกหรือเปิดใช้งานองค์ประกอบที่ประกอบ

ดูตัวอย่างการใช้งานได้ที่อ่านข้อมูลแบบฟอร์ม

ActionParameter

รายการพารามิเตอร์การดำเนินการ

LoadIndicator

ระบุตัวบ่งชี้การโหลดที่การดำเนินการแสดงขณะเรียกใช้การดำเนินการ

bool

ระบุว่าค่าแบบฟอร์มจะยังคงอยู่หลังจากการดำเนินการหรือไม่ ค่าเริ่มต้นคือ false

หากเป็น true ค่าแบบฟอร์มจะยังคงอยู่หลังจากทริกเกอร์การดำเนินการ หากต้องการให้ผู้ใช้ทำการเปลี่ยนแปลงในขณะที่ระบบกำลังประมวลผลการดำเนินการ ให้ตั้งค่า LoadIndicator เป็น NONE สำหรับข้อความการ์ดในแอปแชท คุณต้องตั้งค่า ResponseType ของการดำเนินการเป็น UPDATE_MESSAGE และใช้ card_id เดียวกันจากการ์ดที่มีการดำเนินการ

หากเป็น false ระบบจะล้างค่าแบบฟอร์มเมื่อทริกเกอร์การดำเนินการ หากต้องการป้องกันไม่ให้ผู้ใช้ทำการเปลี่ยนแปลงขณะที่ระบบกำลังประมวลผลการดำเนินการ ให้ตั้งค่า LoadIndicator เป็น SPINNER

Interaction

ไม่บังคับ ต้องระบุเมื่อเปิดกล่องโต้ตอบ

สิ่งที่ต้องทำเพื่อตอบสนองต่อการโต้ตอบกับผู้ใช้ เช่น ผู้ใช้คลิกปุ่มในข้อความการ์ด

หากไม่ได้ระบุ แอปจะตอบสนองด้วยการดำเนินการaction เช่น เปิดลิงก์หรือเรียกใช้ฟังก์ชัน ตามปกติ

การระบุ interaction จะช่วยให้แอปตอบสนองในรูปแบบอินเทอร์แอกทีฟพิเศษได้ เช่น การตั้งค่า interaction เป็น OPEN_DIALOG จะทำให้แอปเปิดกล่องโต้ตอบได้ เมื่อระบุไว้ ระบบจะไม่แสดงตัวบ่งชี้การโหลด หากระบุไว้สำหรับส่วนเสริม ระบบจะนำการ์ดทั้งหมดออกและไม่แสดงสิ่งใดในไคลเอ็นต์

ใช้ได้กับแอป Google Chat และใช้ไม่ได้กับส่วนเสริม Google Workspace

string

ไม่บังคับ กรอกรายการนี้ด้วยชื่อของวิดเจ็ตที่การดำเนินการนี้ต้องใช้สำหรับการส่งที่ถูกต้อง

หากวิดเจ็ตที่แสดงที่นี่ไม่มีค่าเมื่อเรียกใช้การดำเนินการนี้ ระบบจะยกเลิกการส่งแบบฟอร์ม

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace

bool

ไม่บังคับ หากเป็นจริง การดำเนินการนี้จะถือว่าวิดเจ็ตทั้งหมดเป็นวิดเจ็ตที่จำเป็น

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace

string

ชื่อพารามิเตอร์สำหรับสคริปต์การดำเนินการ

string

ค่าของพารามิเตอร์

BorderType

ประเภทเส้นขอบ

Color

สีที่จะใช้เมื่อประเภทเป็น BORDER_TYPE_STROKE

หากต้องการตั้งค่าสีเส้นขอบ ให้ระบุค่าสำหรับช่อง red, green และ blue ค่าต้องเป็นจำนวนทศนิยมระหว่าง 0 ถึง 1 โดยอิงตามค่าสี RGB ซึ่ง 0 (0/255) แสดงถึงไม่มีสี และ 1 (255/255) แสดงถึงความเข้มสูงสุดของสี

ตัวอย่างเช่น โค้ดต่อไปนี้จะตั้งค่าสีเป็นสีแดงที่ความเข้มสูงสุด

"color": {
   "red": 1,
   "green": 0,
   "blue": 0,
}

ฟิลด์ alpha ไม่พร้อมใช้งานสำหรับสีของเส้น หากระบุ ระบบจะไม่สนใจฟิลด์นี้

int32

รัศมีมุมของเส้นขอบ

string

ข้อความที่แสดงภายในปุ่ม

Icon

ไอคอนที่แสดงภายในปุ่ม หากตั้งค่าทั้ง icon และ text ไอคอนจะปรากฏก่อนข้อความ

Color

ไม่บังคับ สีของปุ่ม หากตั้งค่าไว้ ระบบจะตั้งค่าปุ่ม type เป็น FILLED และตั้งค่าสีของช่อง text และ icon เป็นสีที่ตัดกันเพื่อให้ข้อความอ่านง่าย เช่น หากตั้งค่าสีปุ่มเป็นสีน้ำเงิน ข้อความหรือไอคอนในปุ่มจะตั้งค่าเป็นสีขาว

หากต้องการตั้งค่าสีปุ่ม ให้ระบุค่าสำหรับช่อง red, green และ blue ค่าต้องเป็นจำนวนทศนิยมระหว่าง 0 ถึง 1 โดยอิงตามค่าสี RGB ซึ่ง 0 (0/255) แสดงถึงไม่มีสี และ 1 (255/255) แสดงถึงความเข้มสูงสุดของสี

ตัวอย่างเช่น โค้ดต่อไปนี้จะตั้งค่าสีเป็นสีแดงที่ความเข้มสูงสุด

"color": {
   "red": 1,
   "green": 0,
   "blue": 0,
}

ฟิลด์ alpha ใช้กับสีปุ่มไม่ได้ หากระบุ ระบบจะไม่สนใจฟิลด์นี้

OnClick

ต้องระบุ การดำเนินการที่จะทำเมื่อผู้ใช้คลิกปุ่ม เช่น การเปิดไฮเปอร์ลิงก์หรือการเรียกใช้ฟังก์ชันที่กำหนดเอง

bool

หากเป็น true ปุ่มจะแสดงในสถานะไม่ได้ใช้งานและไม่ตอบสนองต่อการกระทำของผู้ใช้

string

ข้อความแสดงแทนที่ใช้เพื่อการช่วยเหลือพิเศษ

ตั้งค่าข้อความอธิบายที่ช่วยให้ผู้ใช้ทราบว่าปุ่มทำอะไร เช่น หากปุ่มเปิดไฮเปอร์ลิงก์ คุณอาจเขียนว่า "เปิดแท็บเบราว์เซอร์ใหม่และไปยังเอกสารสำหรับนักพัฒนาซอฟต์แวร์ Google Chat ที่ https://developers.google.com/workspace/chat"

Type

ไม่บังคับ ประเภทของปุ่ม หากไม่ได้ตั้งค่าไว้ ประเภทปุ่มจะมีค่าเริ่มต้นเป็น OUTLINED หากตั้งค่าฟิลด์ color ระบบจะบังคับให้ประเภทปุ่มเป็น FILLED และจะไม่สนใจค่าใดๆ ที่ตั้งไว้สำหรับฟิลด์นี้

Button

อาร์เรย์ของปุ่ม

CardHeader

ส่วนหัวของการ์ด โดยปกติแล้วส่วนหัวจะมีรูปภาพนำและชื่อ ส่วนหัวจะปรากฏที่ด้านบนของการ์ดเสมอ

Section

มีคอลเล็กชันวิดเจ็ต แต่ละส่วนมีส่วนหัวของตัวเองซึ่งไม่บังคับ ส่วนต่างๆ จะแยกกันด้วยเส้นแบ่ง ดูตัวอย่างในแอป Google Chat ได้ที่กำหนดส่วนของการ์ด

DividerStyle

รูปแบบเส้นแบ่งระหว่างส่วนหัว ส่วน และส่วนท้าย

CardAction

การดำเนินการของการ์ด ระบบจะเพิ่มการดำเนินการลงในเมนูแถบเครื่องมือของการ์ด

ใช้ได้กับส่วนเสริม Google Workspace และใช้ไม่ได้กับแอป Google Chat

ตัวอย่างเช่น JSON ต่อไปนี้จะสร้างเมนูการดำเนินการของการ์ดที่มีตัวเลือก Settings และ Send Feedback

"card_actions": [
  {
    "actionLabel": "Settings",
    "onClick": {
      "action": {
        "functionName": "goToView",
        "parameters": [
          {
            "key": "viewType",
            "value": "SETTING"
         }
        ],
        "loadIndicator": "LoadIndicator.SPINNER"
      }
    }
  },
  {
    "actionLabel": "Send Feedback",
    "onClick": {
      "openLink": {
        "url": "https://example.com/feedback"
      }
    }
  }
]

string

ชื่อของการ์ด ใช้เป็นตัวระบุการ์ดในการไปยังส่วนต่างๆ ของการ์ด

ใช้ได้กับส่วนเสริม Google Workspace และใช้ไม่ได้กับแอป Google Chat

CardFixedFooter

ส่วนท้ายแบบคงที่ที่แสดงที่ด้านล่างของการ์ดนี้

การตั้งค่า fixedFooter โดยไม่ระบุ primaryButton หรือ secondaryButton จะทำให้เกิดข้อผิดพลาด สำหรับแอปใน Chat คุณสามารถใช้ส่วนท้ายแบบคงที่ในกล่องโต้ตอบได้ แต่จะใช้ในข้อความการ์ดไม่ได้

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace

DisplayStyle

ในส่วนเสริมของ Google Workspace จะตั้งค่าพร็อพเพอร์ตี้การแสดงผลของ peekCardHeader

ใช้ได้กับส่วนเสริม Google Workspace และใช้ไม่ได้กับแอป Google Chat

CardHeader

เมื่อแสดงเนื้อหาตามบริบท ส่วนหัวของการ์ดแสดงตัวอย่างจะทำหน้าที่เป็นตัวยึดตำแหน่งเพื่อให้ผู้ใช้ไปยังการ์ดหน้าแรกและการ์ดตามบริบทได้

ใช้ได้กับส่วนเสริม Google Workspace และใช้ไม่ได้กับแอป Google Chat

string

ป้ายกำกับที่แสดงเป็นรายการเมนูการดำเนินการ

OnClick

onClick การดำเนินการสำหรับรายการการทำงานนี้

Button

ปุ่มหลักของส่วนท้ายแบบคงที่ ปุ่มต้องเป็นปุ่มข้อความที่มีการตั้งค่าข้อความและสี

Button

ปุ่มรองของส่วนท้ายแบบคงที่ ปุ่มต้องเป็นปุ่มข้อความที่มีการตั้งค่าข้อความและสี หากตั้งค่า secondaryButton คุณต้องตั้งค่า primaryButton ด้วย

string

ต้องระบุ ชื่อของส่วนหัวของการ์ด ส่วนหัวมีความสูงคงที่ หากระบุทั้งชื่อและคำบรรยาย แต่ละรายการจะใช้ 1 บรรทัด หากระบุเฉพาะชื่อ ระบบจะใช้ทั้ง 2 บรรทัด

string

คำบรรยายของส่วนหัวของการ์ด หากระบุไว้ จะปรากฏในบรรทัดของตัวเองใต้ title

ImageType

รูปร่างที่ใช้ครอบตัดรูปภาพ

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace

string

URL ของ HTTPS ของรูปภาพในส่วนหัวของการ์ด

string

ข้อความแสดงแทนของรูปภาพนี้ที่ใช้เพื่อการช่วยเหลือพิเศษ

TextParagraph

วิดเจ็ตย่อหน้าข้อความ

ButtonList

วิดเจ็ตรายการปุ่ม

Image

วิดเจ็ตรูปภาพ

string

ข้อความที่ปรากฏที่ด้านบนของส่วน รองรับข้อความที่จัดรูปแบบ HTML อย่างง่าย ดูข้อมูลเพิ่มเติมเกี่ยวกับการจัดรูปแบบข้อความได้ที่การจัดรูปแบบข้อความในแอป Google Chat และการจัดรูปแบบข้อความในส่วนเสริมของ Google Workspace

Widget

วิดเจ็ตทั้งหมดในส่วน ต้องมีวิดเจ็ตอย่างน้อย 1 รายการ

bool

ระบุว่ายุบส่วนนี้ได้หรือไม่

ส่วนที่ยุบได้จะซ่อนวิดเจ็ตบางส่วนหรือทั้งหมด แต่ผู้ใช้สามารถขยายส่วนเพื่อแสดงวิดเจ็ตที่ซ่อนไว้ได้โดยคลิกแสดงเพิ่มเติม ผู้ใช้สามารถซ่อนวิดเจ็ตอีกครั้งได้โดยคลิกแสดงน้อยลง

หากต้องการระบุวิดเจ็ตที่ซ่อน ให้ระบุ uncollapsibleWidgetsCount

int32

จำนวนวิดเจ็ตที่ยุบไม่ได้ซึ่งยังคงมองเห็นได้แม้ว่าจะยุบส่วนก็ตาม

เช่น เมื่อส่วนหนึ่งมีวิดเจ็ต 5 รายการและตั้งค่า uncollapsibleWidgetsCount เป็น 2 ระบบจะแสดงวิดเจ็ต 2 รายการแรกเสมอ และจะยุบ 3 รายการสุดท้ายโดยค่าเริ่มต้น ระบบจะพิจารณา uncollapsibleWidgetsCount เมื่อ collapsible เป็น true เท่านั้น

CollapseControl

ไม่บังคับ กำหนดปุ่มขยายและยุบของส่วน ปุ่มนี้จะแสดงก็ต่อเมื่อยุบส่วนได้เท่านั้น หากไม่ได้ตั้งค่าช่องนี้ ระบบจะใช้ปุ่มเริ่มต้น

CarouselCard

รายการการ์ดที่รวมอยู่ในภาพสไลด์

NestedWidget

รายการวิดเจ็ตที่แสดงในการ์ดภาพสไลด์ วิดเจ็ตจะแสดงตามลำดับที่ระบุ

NestedWidget

รายการวิดเจ็ตที่แสดงที่ด้านล่างของการ์ดภาพสไลด์ วิดเจ็ตจะแสดงตามลำดับที่ระบุ

Icon

รูปไอคอน หากตั้งค่าทั้ง icon และ text ไอคอนจะปรากฏก่อนข้อความ

string

ข้อความที่แสดงภายในชิป

OnClick

ไม่บังคับ การดำเนินการที่จะทำเมื่อผู้ใช้คลิกชิป เช่น การเปิดไฮเปอร์ลิงก์หรือการเรียกใช้ฟังก์ชันที่กำหนดเอง

bool

ไม่ว่าชิปจะอยู่ในสถานะที่ใช้งานอยู่และตอบสนองต่อการกระทำของผู้ใช้หรือไม่ ค่าเริ่มต้นคือ true เลิกใช้งานแล้ว โปรดใช้ disabled แทน

bool

ไม่ว่าชิปจะอยู่ในสถานะไม่ได้ใช้งานและไม่สนใจการกระทำของผู้ใช้หรือไม่ ค่าเริ่มต้นคือ false

string

ข้อความแสดงแทนที่ใช้เพื่อการช่วยเหลือพิเศษ

ตั้งค่าข้อความอธิบายเพื่อให้ผู้ใช้ทราบว่าชิปทำอะไร เช่น หากชิปเปิดไฮเปอร์ลิงก์ ให้เขียนว่า "เปิดแท็บเบราว์เซอร์ใหม่และไปยังเอกสารสำหรับนักพัฒนาแอป Google Chat ที่ https://developers.google.com/workspace/chat"

Layout

เลย์เอาต์รายการชิปที่ระบุ

Chip

อาร์เรย์ของชิป

HorizontalAlignment

การจัดแนวแนวนอนของปุ่มขยายและยุบ

Button

ไม่บังคับ กำหนดปุ่มที่ปรับแต่งได้เพื่อขยายส่วน ต้องตั้งค่าทั้งฟิลด์ expand_button และ collapse_button ชุดฟิลด์เดียวจะไม่มีผล หากไม่ได้ตั้งค่าช่องนี้ ระบบจะใช้ปุ่มเริ่มต้น

Button

ไม่บังคับ กำหนดปุ่มที่ปรับแต่งได้เพื่อยุบส่วน ต้องตั้งค่าทั้งฟิลด์ expand_button และ collapse_button ชุดฟิลด์เดียวจะไม่มีผล หากไม่ได้ตั้งค่าช่องนี้ ระบบจะใช้ปุ่มเริ่มต้น

Column

อาร์เรย์ของคอลัมน์ คุณใส่คอลัมน์ในการ์ดหรือกล่องโต้ตอบได้สูงสุด 2 คอลัมน์

HorizontalSizeStyle

ระบุวิธีที่คอลัมน์เติมความกว้างของการ์ด

HorizontalAlignment

ระบุว่าวิดเจ็ตจะจัดแนวไปทางซ้าย ขวา หรือกึ่งกลางของคอลัมน์

VerticalAlignment

ระบุว่าวิดเจ็ตจะจัดแนวไปที่ด้านบน ด้านล่าง หรือตรงกลางของคอลัมน์

Widgets

อาร์เรย์ของวิดเจ็ตที่รวมอยู่ในคอลัมน์ วิดเจ็ตจะปรากฏตามลำดับที่ระบุ

TextParagraph

วิดเจ็ต TextParagraph

Image

วิดเจ็ต Image

DecoratedText

วิดเจ็ต DecoratedText

ButtonList

วิดเจ็ต ButtonList

TextInput

วิดเจ็ต TextInput

SelectionInput

วิดเจ็ต SelectionInput

DateTimePicker

วิดเจ็ต DateTimePicker

ChipList

วิดเจ็ต ChipList

string

ชื่อที่ใช้ระบุ DateTimePicker ในเหตุการณ์อินพุตของแบบฟอร์ม

ดูรายละเอียดเกี่ยวกับการทำงานกับข้อมูลที่ป้อนในแบบฟอร์มได้ที่รับข้อมูลแบบฟอร์ม

string

ข้อความที่แจ้งให้ผู้ใช้ป้อนวันที่ เวลา หรือวันที่และเวลา เช่น หากผู้ใช้กําลังกําหนดเวลานัดหมาย ให้ใช้ป้ายกํากับ เช่น Appointment date หรือ Appointment date and time

DateTimePickerType

ระบุว่าวิดเจ็ตรองรับการป้อนวันที่ เวลา หรือทั้งวันที่และเวลาหรือไม่

int64

ค่าเริ่มต้นที่แสดงในวิดเจ็ตเป็นมิลลิวินาทีตั้งแต่เวลา Epoch ของ Unix

ระบุค่าตามประเภทเครื่องมือเลือก (DateTimePickerType)

• DATE_AND_TIME: วันที่และเวลาในปฏิทินในรูปแบบ UTC เช่น หากต้องการแสดงวันที่ 1 มกราคม 2023 เวลา 12:00 น. UTC ให้ใช้ 1672574400000
• DATE_ONLY: วันที่ในปฏิทินที่เวลา 00:00:00 UTC เช่น หากต้องการแสดงวันที่ 1 มกราคม 2023 ให้ใช้ 1672531200000
• TIME_ONLY: เวลาใน UTC เช่น หากต้องการแสดง 12:00 PM ให้ใช้ 43200000 (หรือ 12 * 60 * 60 * 1000)

int32

ตัวเลขที่แสดงค่าชดเชยเขตเวลาจาก UTC เป็นนาที หากตั้งค่าไว้ ระบบจะแสดง value_ms_epoch ในเขตเวลาที่ระบุ หากไม่ได้ตั้งค่าไว้ ค่าเริ่มต้นจะเป็นการตั้งค่าเขตเวลาของผู้ใช้

Action

ทริกเกอร์เมื่อผู้ใช้คลิกบันทึกหรือล้างจากอินเทอร์เฟซ DateTimePicker

Icon

เลิกใช้งานแล้วและแนะนำให้ใช้ startIcon แทน

Icon

ไอคอนที่แสดงหน้าข้อความ

VerticalAlignment

ไม่บังคับ การจัดแนวตั้งของไอคอนเริ่มต้น หากไม่ได้ตั้งค่าไว้ ไอคอนจะอยู่กึ่งกลางในแนวตั้ง

ใช้ได้กับแอป Google Chat และใช้ไม่ได้กับส่วนเสริม Google Workspace

string

ข้อความที่ปรากฏเหนือ text ตัดทอนเสมอ

TextParagraph

TextParagraph เทียบเท่ากับ top_label ตัดทอนเสมอ ช่วยให้จัดรูปแบบได้ซับซ้อนกว่า top_label

ใช้ได้กับแอป Google Chat และใช้ไม่ได้กับส่วนเสริม Google Workspace

string

ต้องระบุ ข้อความหลัก

รองรับการจัดรูปแบบอย่างง่าย ดูข้อมูลเพิ่มเติมเกี่ยวกับการจัดรูปแบบข้อความได้ที่การจัดรูปแบบข้อความในแอป Google Chat และการจัดรูปแบบข้อความในส่วนเสริมของ Google Workspace

TextParagraph

TextParagraph เทียบเท่ากับ text ช่วยให้จัดรูปแบบได้ซับซ้อนกว่า text

ใช้ได้กับแอป Google Chat และใช้ไม่ได้กับส่วนเสริม Google Workspace

bool

การตั้งค่าการตัดข้อความ หากเป็น true ข้อความจะขึ้นบรรทัดใหม่และแสดงในหลายบรรทัด ไม่เช่นนั้นข้อความจะถูกตัด

มีผลกับ text เท่านั้น ไม่ใช่ topLabel และ bottomLabel

string

ข้อความที่ปรากฏใต้ text ตัดคำเสมอ

TextParagraph

TextParagraph เทียบเท่ากับ bottom_label ตัดคำเสมอ ช่วยให้จัดรูปแบบได้ซับซ้อนกว่า bottom_label

ใช้ได้กับแอป Google Chat และใช้ไม่ได้กับส่วนเสริม Google Workspace

OnClick

ระบบจะทริกเกอร์การดำเนินการนี้เมื่อผู้ใช้คลิก topLabel หรือ bottomLabel

Button

ปุ่มที่ผู้ใช้คลิกเพื่อเรียกใช้การดำเนินการได้

SwitchControl

วิดเจ็ตสวิตช์ที่ผู้ใช้คลิกเพื่อเปลี่ยนสถานะและทริกเกอร์การดำเนินการได้

Icon

ไอคอนที่แสดงหลังข้อความ

รองรับไอคอนในตัวและที่กำหนดเอง

string

ชื่อที่ใช้ระบุวิดเจ็ตสวิตช์ในเหตุการณ์อินพุตของแบบฟอร์ม

ดูรายละเอียดเกี่ยวกับการทำงานกับข้อมูลที่ป้อนในแบบฟอร์มได้ที่รับข้อมูลแบบฟอร์ม

string

ค่าที่ผู้ใช้ป้อน ซึ่งจะแสดงเป็นส่วนหนึ่งของเหตุการณ์อินพุตแบบฟอร์ม

ดูรายละเอียดเกี่ยวกับการทำงานกับข้อมูลที่ป้อนในแบบฟอร์มได้ที่รับข้อมูลแบบฟอร์ม

bool

เมื่อ true จะเลือกสวิตช์

Action

การดำเนินการที่จะทำเมื่อสถานะของสวิตช์มีการเปลี่ยนแปลง เช่น ฟังก์ชันที่จะเรียกใช้

ControlType

ลักษณะของสวิตช์ในอินเทอร์เฟซผู้ใช้

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace

string

ข้อความที่แสดงในส่วนหัวของตารางกริด

GridItem

รายการที่จะแสดงในตารางกริด

BorderStyle

รูปแบบเส้นขอบที่จะใช้กับแต่ละรายการในตารางกริด

int32

จำนวนคอลัมน์ที่จะแสดงในตารางกริด ระบบจะใช้ค่าเริ่มต้นหากไม่ได้ระบุช่องนี้ และค่าเริ่มต้นจะแตกต่างกันไปขึ้นอยู่กับตำแหน่งที่แสดงตารางกริด (กล่องโต้ตอบเทียบกับโฆษณาที่แสดงร่วม)

OnClick

โดยแต่ละรายการในตารางกริดจะใช้การเรียกกลับนี้ซ้ำ แต่จะมีการเพิ่มตัวระบุและดัชนีของรายการในรายการสินค้าลงในพารามิเตอร์ของการเรียกกลับ

string

ตัวระบุที่ผู้ใช้ระบุสำหรับรายการตารางกริดนี้ ระบบจะแสดงตัวระบุนี้ในonClickพารามิเตอร์การเรียกกลับของตารางกริดหลัก

ImageComponent

รูปภาพที่แสดงในรายการตารางกริด

string

ชื่อของรายการในตารางกริด

string

ชื่อรองของรายการตารางกริด

GridItemLayout

เลย์เอาต์ที่จะใช้สำหรับรายการตารางกริด

string

ไม่บังคับ คำอธิบายของไอคอนที่ใช้สำหรับการช่วยเหลือพิเศษ หากไม่ได้ระบุ ระบบจะระบุค่าเริ่มต้น Button แนวทางปฏิบัติแนะนำคือคุณควรกำหนดคำอธิบายที่เป็นประโยชน์สำหรับสิ่งที่ไอคอนแสดง และสิ่งที่ไอคอนทำ (หากมี) เช่น A user's account portrait หรือ Opens a new browser tab and navigates to the Google Chat developer documentation at https://developers.google.com/workspace/chat

หากตั้งค่าไอคอนใน Button altText จะปรากฏเป็นข้อความช่วยเหลือเมื่อผู้ใช้วางเมาส์เหนือปุ่ม อย่างไรก็ตาม หากปุ่มตั้งค่า text ด้วย ระบบจะไม่สนใจ altText ของไอคอน

ImageType

รูปแบบการครอบตัดที่ใช้กับรูปภาพ ในบางกรณี การใช้CIRCLEครอบตัดจะทำให้รูปภาพมีขนาดใหญ่กว่าไอคอนในตัว

string

แสดงไอคอนในตัวรายการใดรายการหนึ่งที่ Google Workspace มีให้

เช่น หากต้องการแสดงไอคอนเครื่องบิน ให้ระบุ AIRPLANE สำหรับรถประจำทาง ให้ระบุ BUS

ดูรายการไอคอนที่รองรับทั้งหมดได้ที่ไอคอนในตัว

string

แสดงไอคอนที่กำหนดเองซึ่งโฮสต์ที่ HTTPS URL

เช่น

"iconUrl":
"https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png"

ประเภทไฟล์ที่รองรับ ได้แก่ .png และ .jpg

MaterialIcon

แสดงไอคอน Material ของ Google อย่างใดอย่างหนึ่ง

เช่น หากต้องการแสดงไอคอนช่องทําเครื่องหมาย ให้ใช้

"material_icon": {
  "name": "check_box"
}

ใช้ได้กับแอป Google Chat และใช้ไม่ได้กับส่วนเสริม Google Workspace

string

URL ของ HTTPS ที่โฮสต์รูปภาพ

เช่น

https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png

OnClick

เมื่อผู้ใช้คลิกรูปภาพ การคลิกจะทริกเกอร์การดำเนินการนี้

string

ข้อความแสดงแทนของรูปภาพนี้ที่ใช้เพื่อการช่วยเหลือพิเศษ

string

URL ของรูปภาพ

string

ป้ายกำกับการช่วยเหลือพิเศษสำหรับรูปภาพ

ImageCropStyle

รูปแบบการครอบตัดที่จะใช้กับรูปภาพ

BorderStyle

รูปแบบเส้นขอบที่จะใช้กับรูปภาพ

ImageCropType

ประเภทการครอบตัด

double

สัดส่วนภาพที่จะใช้หากประเภทการครอบตัดคือ RECTANGLE_CUSTOM

ตัวอย่างวิธีใช้สัดส่วนภาพ 16:9

cropStyle {
 "type": "RECTANGLE_CUSTOM",
 "aspectRatio": 16/9
}

string

ชื่อไอคอนที่กำหนดไว้ในไอคอน Material ของ Google เช่น check_box ระบบจะทิ้งชื่อที่ไม่ถูกต้องและแทนที่ด้วยสตริงว่าง ซึ่งจะทำให้ไอคอนแสดงผลไม่สำเร็จ

bool

ไอคอนแสดงผลเป็นแบบทึบไหม ค่าเริ่มต้นคือ false

หากต้องการดูตัวอย่างการตั้งค่าไอคอนต่างๆ ให้ไปที่ Google Font Icons แล้วปรับการตั้งค่าในส่วนปรับแต่ง

int32

ความหนาของเส้นไอคอน เลือกจาก {100, 200, 300, 400, 500, 600, 700} หากไม่มี ค่าเริ่มต้นคือ 400 หากระบุค่าอื่น ระบบจะใช้ค่าเริ่มต้น

หากต้องการดูตัวอย่างการตั้งค่าไอคอนต่างๆ ให้ไปที่ Google Font Icons แล้วปรับการตั้งค่าในส่วนปรับแต่ง

int32

น้ำหนักและเกรดจะส่งผลต่อความหนาของสัญลักษณ์ การปรับคะแนนจะละเอียดกว่าการปรับน้ำหนัก และมีผลเพียงเล็กน้อยต่อขนาดของสัญลักษณ์ เลือกจาก {-25, 0, 200} หากไม่มี ค่าเริ่มต้นจะเป็น 0 หากระบุค่าอื่น ระบบจะใช้ค่าเริ่มต้น

หากต้องการดูตัวอย่างการตั้งค่าไอคอนต่างๆ ให้ไปที่ Google Font Icons แล้วปรับการตั้งค่าในส่วนปรับแต่ง

Action

หากระบุไว้ onClick นี้จะทริกเกอร์การดำเนินการ

OpenLink

หากระบุไว้ onClick จะทริกเกอร์การดำเนินการเปิดลิงก์

Action

ส่วนเสริมจะทริกเกอร์การดำเนินการนี้เมื่อการดำเนินการต้องเปิดลิงก์ ซึ่งแตกต่างจาก open_link ด้านบนตรงที่ต้องสื่อสารกับเซิร์ฟเวอร์เพื่อรับลิงก์ ดังนั้นไคลเอ็นต์บนเว็บจึงต้องเตรียมการบางอย่างก่อนที่การตอบกลับการดำเนินการเปิดลิงก์จะกลับมา

ใช้ได้กับส่วนเสริม Google Workspace และใช้ไม่ได้กับแอป Google Chat

Card

ระบบจะพุชการ์ดใหม่ไปยังกองการ์ดหลังจากคลิกหากมีการระบุ

ใช้ได้กับส่วนเสริม Google Workspace และใช้ไม่ได้กับแอป Google Chat

OverflowMenu

หากระบุไว้ onClick จะเปิดเมนูรายการเพิ่มเติม

string

URL ที่จะเปิด

OpenAs

วิธีเปิดลิงก์

ใช้ได้กับส่วนเสริม Google Workspace และใช้ไม่ได้กับแอป Google Chat

OnClose

ไม่ว่าลูกค้าจะลืมลิงก์หลังจากเปิดแล้ว หรือสังเกตลิงก์จนกว่าหน้าต่างจะปิด

ใช้ได้กับส่วนเสริม Google Workspace และใช้ไม่ได้กับแอป Google Chat

OverflowMenuItem

ต้องระบุ รายการตัวเลือกเมนู

Icon

ไอคอนที่แสดงหน้าข้อความ

string

ต้องระบุ ข้อความที่ระบุหรืออธิบายสินค้าต่อผู้ใช้

OnClick

ต้องระบุ การดำเนินการที่เรียกใช้เมื่อเลือกตัวเลือกเมนู OnClick นี้ต้องไม่มี OverflowMenu ระบบจะทิ้ง OverflowMenu ที่ระบุและปิดใช้รายการเมนู

bool

ตัวเลือกเมนูถูกปิดใช้หรือไม่ ค่าเริ่มต้นคือ false

string

ต้องระบุ ชื่อที่ระบุอินพุตการเลือกในเหตุการณ์อินพุตของแบบฟอร์ม

ดูรายละเอียดเกี่ยวกับการทำงานกับข้อมูลที่ป้อนในแบบฟอร์มได้ที่รับข้อมูลแบบฟอร์ม

string

ข้อความที่ปรากฏเหนือช่องป้อนข้อมูลการเลือกในอินเทอร์เฟซผู้ใช้

ระบุข้อความที่จะช่วยให้ผู้ใช้ป้อนข้อมูลที่แอปของคุณต้องการ เช่น หากผู้ใช้เลือกความเร่งด่วนของคำขอแจ้งปัญหาจากเมนูแบบเลื่อนลง ป้ายกำกับอาจเป็น "ความเร่งด่วน" หรือ "เลือกความเร่งด่วน"

SelectionType

ประเภทของรายการที่แสดงต่อผู้ใช้ในSelectionInputวิดเจ็ต ประเภทการเลือกจะรองรับการโต้ตอบประเภทต่างๆ เช่น ผู้ใช้สามารถเลือกช่องทําเครื่องหมายได้มากกว่า 1 ช่อง แต่จะเลือกได้เพียง 1 ค่าจากเมนูแบบเลื่อนลง

SelectionItem

อาร์เรย์ของรายการที่เลือกได้ เช่น อาร์เรย์ของปุ่มตัวเลือกหรือช่องทำเครื่องหมาย รองรับรายการสูงสุด 100 รายการ

Action

หากระบุไว้ ระบบจะส่งแบบฟอร์มเมื่อมีการเปลี่ยนแปลงการเลือก หากไม่ได้ระบุ คุณต้องระบุปุ่มแยกต่างหากที่ส่งแบบฟอร์ม

ดูรายละเอียดเกี่ยวกับการทำงานกับข้อมูลที่ป้อนในแบบฟอร์มได้ที่รับข้อมูลแบบฟอร์ม

int32

สำหรับเมนูแบบหลายตัวเลือก จำนวนอักขระข้อความที่ผู้ใช้ป้อนก่อนที่เมนูจะแสดงรายการที่แนะนำ

หากไม่ได้ตั้งค่าไว้ เมนูแบบหลายตัวเลือกจะใช้ค่าเริ่มต้นต่อไปนี้

• หากเมนูใช้อาร์เรย์แบบคงที่ของรายการ SelectionInput ค่าเริ่มต้นจะเป็น 0 อักขระและจะป้อนข้อมูลรายการจากอาร์เรย์ทันที
• หากเมนูใช้แหล่งข้อมูลแบบไดนามิก (multi_select_data_source) ระบบจะตั้งค่าเริ่มต้นเป็น 3 อักขระก่อนที่จะค้นหาแหล่งข้อมูลเพื่อแสดงรายการที่แนะนำ

int32

สำหรับเมนูแบบเลือกหลายรายการ จำนวนสูงสุดของรายการที่ผู้ใช้เลือกได้ ค่าต่ำสุดคือ 1 รายการ หากไม่ได้ระบุไว้ ระบบจะใช้ 3 รายการเป็นค่าเริ่มต้น

Action

แหล่งข้อมูลภายนอก เช่น ฐานข้อมูลเชิงสัมพันธ์

PlatformDataSource

แหล่งข้อมูลจาก Google Workspace

CommonDataSource

แหล่งข้อมูลที่แอปพลิเคชัน Google Workspace ทั้งหมดใช้ร่วมกัน เช่น ผู้ใช้ในองค์กร Google Workspace

HostAppDataSourceMarkup

แหล่งข้อมูลที่มีเฉพาะในแอปพลิเคชันโฮสต์ของ Google Workspace เช่น พื้นที่ใน Google Chat

ฟิลด์นี้รองรับไลบรารีของไคลเอ็นต์ Google API แต่ไม่พร้อมใช้งานในไลบรารีของไคลเอ็นต์ระบบคลาวด์ ดูข้อมูลเพิ่มเติมได้ที่ติดตั้งไลบรารีของไคลเอ็นต์

string

ข้อความที่ระบุหรืออธิบายสินค้าต่อผู้ใช้

string

ค่าที่เชื่อมโยงกับรายการนี้ ไคลเอ็นต์ควรใช้ค่านี้เป็นค่าอินพุตของแบบฟอร์ม

ดูรายละเอียดเกี่ยวกับการทำงานกับข้อมูลที่ป้อนในแบบฟอร์มได้ที่รับข้อมูลแบบฟอร์ม

bool

มีการเลือกรายการโดยค่าเริ่มต้นหรือไม่ หากอินพุตการเลือกยอมรับค่าเดียวเท่านั้น (เช่น ปุ่มตัวเลือกหรือเมนูแบบเลื่อนลง) ให้ตั้งค่าช่องนี้สำหรับรายการเดียวเท่านั้น

string

สำหรับเมนูแบบเลือกหลายรายการ คำอธิบายข้อความหรือป้ายกำกับที่แสดงใต้ช่อง text ของรายการ

string

SuggestionItem

รายการคำแนะนำที่ใช้สำหรับคำแนะนำการเติมข้อความอัตโนมัติในช่องป้อนข้อความ

string

ค่าของอินพุตที่แนะนำไปยังช่องป้อนข้อความ ซึ่งเทียบเท่ากับสิ่งที่ผู้ใช้ป้อนด้วยตนเอง

string

ชื่อที่ใช้ระบุข้อความที่ป้อนในเหตุการณ์อินพุตของแบบฟอร์ม

ดูรายละเอียดเกี่ยวกับการทำงานกับข้อมูลที่ป้อนในแบบฟอร์มได้ที่รับข้อมูลแบบฟอร์ม

string

ข้อความที่ปรากฏเหนือช่องป้อนข้อความในอินเทอร์เฟซผู้ใช้

ระบุข้อความที่จะช่วยให้ผู้ใช้ป้อนข้อมูลที่แอปของคุณต้องการ เช่น หากคุณถามชื่อของใครบางคน แต่ต้องการทราบเฉพาะนามสกุล ให้เขียน surname แทน name

ต้องระบุหากไม่ได้ระบุ hintText หรือจะเว้นว่างไว้ก็ได้

string

ข้อความที่ปรากฏใต้ช่องป้อนข้อความซึ่งมีไว้เพื่อช่วยเหลือผู้ใช้โดยการแจ้งให้ป้อนค่าที่ต้องการ ข้อความนี้จะแสดงอยู่เสมอ

ต้องระบุหากไม่ได้ระบุ label หรือจะเว้นว่างไว้ก็ได้

string

ค่าที่ผู้ใช้ป้อน ซึ่งจะแสดงเป็นส่วนหนึ่งของเหตุการณ์อินพุตแบบฟอร์ม

ดูรายละเอียดเกี่ยวกับการทำงานกับข้อมูลที่ป้อนในแบบฟอร์มได้ที่รับข้อมูลแบบฟอร์ม

Type

ลักษณะที่ช่องป้อนข้อความปรากฏในอินเทอร์เฟซผู้ใช้ เช่น ฟิลด์เป็นแบบบรรทัดเดียวหรือหลายบรรทัด

Action

สิ่งที่ต้องทำเมื่อมีการเปลี่ยนแปลงในช่องป้อนข้อความ เช่น ผู้ใช้เพิ่มลงในช่องหรือลบข้อความ

ตัวอย่างการดำเนินการที่ทำได้ ได้แก่ การเรียกใช้ฟังก์ชันที่กำหนดเองหรือการเปิดกล่องโต้ตอบใน Google Chat

Suggestions

ค่าที่แนะนำซึ่งผู้ใช้ป้อนได้ ค่าเหล่านี้จะปรากฏเมื่อผู้ใช้คลิกภายในช่องป้อนข้อความ ขณะที่ผู้ใช้พิมพ์ ค่าที่แนะนำจะกรองแบบไดนามิกให้ตรงกับสิ่งที่ผู้ใช้พิมพ์

ตัวอย่างเช่น ช่องป้อนข้อความสำหรับภาษาโปรแกรมอาจแนะนำ Java, JavaScript, Python และ C++ เมื่อผู้ใช้เริ่มพิมพ์ Jav รายการคำแนะนำจะกรองเพื่อแสดงเฉพาะ Java และ JavaScript

ค่าที่แนะนำจะช่วยแนะนำให้ผู้ใช้ป้อนค่าที่แอปของคุณเข้าใจได้ เมื่อพูดถึง JavaScript ผู้ใช้บางรายอาจป้อน javascript และผู้ใช้รายอื่นๆ อาจป้อน java script การแนะนำ JavaScript จะช่วยกำหนดมาตรฐานวิธีที่ผู้ใช้โต้ตอบกับแอปของคุณ

เมื่อระบุ TextInput.type จะเป็น SINGLE_LINE เสมอ แม้ว่าจะตั้งค่าเป็น MULTIPLE_LINE ก็ตาม

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace

Action

ไม่บังคับ ระบุการดำเนินการที่จะทำเมื่อช่องป้อนข้อความแสดงคำแนะนำแก่ผู้ใช้ที่โต้ตอบกับช่อง

หากไม่ได้ระบุไว้ initialSuggestions จะเป็นผู้กำหนดคำแนะนำและไคลเอ็นต์จะเป็นผู้ประมวลผล

หากระบุไว้ แอปจะดำเนินการตามที่ระบุไว้ที่นี่ เช่น เรียกใช้ฟังก์ชันที่กำหนดเอง

ใช้ได้กับส่วนเสริม Google Workspace และใช้ไม่ได้กับแอป Google Chat

Validation

ระบุการตรวจสอบรูปแบบอินพุตที่จำเป็นสำหรับช่องข้อความนี้

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace

string

ข้อความที่ปรากฏในช่องป้อนข้อความเมื่อช่องว่างเปล่า ใช้ข้อความนี้เพื่อแจ้งให้ผู้ใช้ป้อนค่า เช่น Enter a number from 0 to 100

ใช้ได้กับแอป Google Chat และใช้ไม่ได้กับส่วนเสริม Google Workspace

string

ข้อความที่แสดงในวิดเจ็ต

int32

จำนวนบรรทัดข้อความสูงสุดที่แสดงในวิดเจ็ต หากข้อความเกินจำนวนบรรทัดสูงสุดที่ระบุไว้ ระบบจะซ่อนเนื้อหาส่วนเกินไว้หลังปุ่มแสดงเพิ่มเติม หากข้อความมีความยาวเท่ากับหรือสั้นกว่าจำนวนบรรทัดสูงสุดที่ระบุ ระบบจะไม่แสดงปุ่มแสดงเพิ่มเติม

ค่าเริ่มต้นคือ 0 ซึ่งในกรณีนี้ระบบจะแสดงบริบททั้งหมด ระบบจะไม่สนใจค่าที่เป็นลบ

TextSyntax

ไวยากรณ์ของข้อความ หากไม่ได้ตั้งค่าไว้ ระบบจะแสดงข้อความเป็น HTML

ใช้ได้กับแอป Google Chat และใช้ไม่ได้กับส่วนเสริม Google Workspace

int32

ระบุขีดจำกัดอักขระสำหรับวิดเจ็ตการป้อนข้อความ โปรดทราบว่าระบบจะใช้ตัวเลือกนี้สำหรับการป้อนข้อความเท่านั้น และจะละเว้นวิดเจ็ตอื่นๆ

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace

InputType

ระบุประเภทของวิดเจ็ตอินพุต

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace

HorizontalAlignment

ระบุว่าวิดเจ็ตจะจัดแนวไปทางซ้าย ขวา หรือกึ่งกลางของคอลัมน์

TextParagraph

แสดงย่อหน้าข้อความ รองรับข้อความที่จัดรูปแบบ HTML อย่างง่าย ดูข้อมูลเพิ่มเติมเกี่ยวกับการจัดรูปแบบข้อความได้ที่การจัดรูปแบบข้อความในแอป Google Chat และการจัดรูปแบบข้อความในส่วนเสริมของ Google Workspace

ตัวอย่างเช่น JSON ต่อไปนี้จะสร้างข้อความตัวหนา

"textParagraph": {
  "text": "  <b>bold text</b>"
}

Image

แสดงรูปภาพ

ตัวอย่างเช่น JSON ต่อไปนี้จะสร้างรูปภาพที่มีข้อความแสดงแทน

"image": {
  "imageUrl":
  "https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png",
  "altText": "Chat app avatar"
}

DecoratedText

แสดงรายการข้อความที่ตกแต่ง

ตัวอย่างเช่น JSON ต่อไปนี้จะสร้างวิดเจ็ตข้อความที่ตกแต่งแล้วซึ่งแสดงอีเมล

"decoratedText": {
  "icon": {
    "knownIcon": "EMAIL"
  },
  "topLabel": "Email Address",
  "text": "sasha@example.com",
  "bottomLabel": "This is a new Email address!",
  "switchControl": {
    "name": "has_send_welcome_email_to_sasha",
    "selected": false,
    "controlType": "CHECKBOX"
  }
}

ButtonList

รายการปุ่ม

ตัวอย่างเช่น JSON ต่อไปนี้จะสร้างปุ่ม 2 ปุ่ม ปุ่มแรกเป็นปุ่มข้อความสีน้ำเงิน และปุ่มที่ 2 เป็นปุ่มรูปภาพที่เปิดลิงก์

"buttonList": {
  "buttons": [
    {
      "text": "Edit",
      "color": {
        "red": 0,
        "green": 0,
        "blue": 1,
      },
      "disabled": true,
    },
    {
      "icon": {
        "knownIcon": "INVITE",
        "altText": "check calendar"
      },
      "onClick": {
        "openLink": {
          "url": "https://example.com/calendar"
        }
      }
    }
  ]
}

TextInput

แสดงช่องข้อความที่ผู้ใช้พิมพ์ได้

ตัวอย่างเช่น JSON ต่อไปนี้จะสร้างช่องป้อนข้อความสำหรับอีเมล

"textInput": {
  "name": "mailing_address",
  "label": "Mailing Address"
}

อีกตัวอย่างหนึ่งคือ JSON ต่อไปนี้จะสร้างช่องป้อนข้อความสำหรับภาษาโปรแกรมที่มีคำแนะนำแบบคงที่

"textInput": {
  "name": "preferred_programing_language",
  "label": "Preferred Language",
  "initialSuggestions": {
    "items": [
      {
        "text": "C++"
      },
      {
        "text": "Java"
      },
      {
        "text": "JavaScript"
      },
      {
        "text": "Python"
      }
    ]
  }
}

SelectionInput

แสดงตัวควบคุมการเลือกที่ช่วยให้ผู้ใช้เลือกรายการได้ ตัวควบคุมการเลือกอาจเป็นช่องทำเครื่องหมาย ปุ่มตัวเลือก สวิตช์ หรือเมนูแบบเลื่อนลง

ตัวอย่างเช่น JSON ต่อไปนี้จะสร้างเมนูแบบเลื่อนลงที่ให้ผู้ใช้เลือกขนาด

"selectionInput": {
  "name": "size",
  "label": "Size"
  "type": "DROPDOWN",
  "items": [
    {
      "text": "S",
      "value": "small",
      "selected": false
    },
    {
      "text": "M",
      "value": "medium",
      "selected": true
    },
    {
      "text": "L",
      "value": "large",
      "selected": false
    },
    {
      "text": "XL",
      "value": "extra_large",
      "selected": false
    }
  ]
}

DateTimePicker

แสดงวิดเจ็ตที่ให้ผู้ใช้ป้อนวันที่ เวลา หรือวันที่และเวลา

ตัวอย่างเช่น JSON ต่อไปนี้จะสร้างเครื่องมือเลือกวันที่และเวลาเพื่อนัดหมาย

"dateTimePicker": {
  "name": "appointment_time",
  "label": "Book your appointment at:",
  "type": "DATE_AND_TIME",
  "valueMsEpoch": 796435200000
}

Divider

แสดงเส้นแบ่งแนวนอนระหว่างวิดเจ็ต

ตัวอย่างเช่น JSON ต่อไปนี้จะสร้างตัวคั่น

"divider": {
}

Grid

แสดงตารางกริดที่มีคอลเล็กชันของรายการ

กริดรองรับคอลัมน์และรายการได้ทุกจำนวน จำนวนแถวจะกำหนดโดยขอบเขตบนของจำนวนรายการหารด้วยจำนวนคอลัมน์ ตารางกริดที่มี 10 รายการและ 2 คอลัมน์จะมี 5 แถว ตารางกริดที่มี 11 รายการและ 2 คอลัมน์จะมี 6 แถว

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace

ตัวอย่างเช่น JSON ต่อไปนี้จะสร้างตารางกริด 2 คอลัมน์ที่มีรายการเดียว

"grid": {
  "title": "A fine collection of items",
  "columnCount": 2,
  "borderStyle": {
    "type": "STROKE",
    "cornerRadius": 4
  },
  "items": [
    {
      "image": {
        "imageUri": "https://www.example.com/image.png",
        "cropStyle": {
          "type": "SQUARE"
        },
        "borderStyle": {
          "type": "STROKE"
        }
      },
      "title": "An item",
      "textAlignment": "CENTER"
    }
  ],
  "onClick": {
    "openLink": {
      "url": "https://www.example.com"
    }
  }
}

Columns

แสดงได้สูงสุด 2 คอลัมน์

หากต้องการรวมคอลัมน์มากกว่า 2 คอลัมน์หรือใช้แถว ให้ใช้วิดเจ็ต Grid

ตัวอย่างเช่น JSON ต่อไปนี้จะสร้าง 2 คอลัมน์ซึ่งแต่ละคอลัมน์มีย่อหน้าข้อความ

"columns": {
  "columnItems": [
    {
      "horizontalSizeStyle": "FILL_AVAILABLE_SPACE",
      "horizontalAlignment": "CENTER",
      "verticalAlignment": "CENTER",
      "widgets": [
        {
          "textParagraph": {
            "text": "First column text paragraph"
          }
        }
      ]
    },
    {
      "horizontalSizeStyle": "FILL_AVAILABLE_SPACE",
      "horizontalAlignment": "CENTER",
      "verticalAlignment": "CENTER",
      "widgets": [
        {
          "textParagraph": {
            "text": "Second column text paragraph"
          }
        }
      ]
    }
  ]
}

Carousel

ภาพสไลด์มีคอลเล็กชันของวิดเจ็ตที่ซ้อนกัน ตัวอย่างเช่น นี่คือการแสดงภาพ JSON ของภาพสไลด์ที่มีย่อหน้าข้อความ 2 ย่อหน้า

{
  "widgets": [
    {
      "textParagraph": {
        "text": "First text paragraph in the carousel."
      }
    },
    {
      "textParagraph": {
        "text": "Second text paragraph in the carousel."
      }
    }
  ]
}

ChipList

รายการชิป

ตัวอย่างเช่น JSON ต่อไปนี้จะสร้างชิป 2 รายการ ชิปแรกเป็นชิปข้อความ ส่วนชิปที่ 2 เป็นชิปไอคอนที่เปิดลิงก์

"chipList": {
  "chips": [
    {
      "text": "Edit",
      "disabled": true,
    },
    {
      "icon": {
        "knownIcon": "INVITE",
        "altText": "check calendar"
      },
      "onClick": {
        "openLink": {
          "url": "https://example.com/calendar"
        }
      }
    }
  ]
}