Cards v2

การ์ด

อินเทอร์เฟซของการ์ดที่แสดงในข้อความ Google Chat หรือส่วนเสริมของ Google Workspace

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

ออกแบบและแสดงตัวอย่างการ์ดด้วยเครื่องมือสร้างการ์ด

เปิดเครื่องมือสร้างการ์ด

หากต้องการดูวิธีสร้างการ์ด โปรดดูเอกสารประกอบต่อไปนี้

ตัวอย่าง: ข้อความในการ์ดสำหรับแอป Google Chat

ตัวอย่างการ์ดรายชื่อติดต่อ

หากต้องการสร้างข้อความการ์ดตัวอย่างใน Google Chat ให้ใช้ JSON ต่อไปนี้ 

{
  "cardsV2": [
    {
      "cardId": "unique-card-id",
      "card": {
        "header": {
           "title": "Sasha",
           "subtitle": "Software Engineer",
           "imageUrl":
           "https://developers.google.com/workspace/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"
                             }
                           ]
                         }
                       }
                     }
                   ]
                 }
               }
             ]
           }
         ]
       }
    }
  ]
}
การแสดง JSON 
{
  "header": {
    object (CardHeader)
  },
  "sections": [
    {
      object (Section)
    }
  ],
  "sectionDividerStyle": enum (DividerStyle),
  "cardActions": [
    {
      object (CardAction)
    }
  ],
  "name": string,
  "fixedFooter": {
    object (CardFixedFooter)
  },
  "displayStyle": enum (DisplayStyle),
  "peekCardHeader": {
    object (CardHeader)
  }
}
ช่อง
header

object (CardHeader)

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

sections[]

object (Section)

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

sectionDividerStyle

enum (DividerStyle)

รูปแบบตัวแบ่งระหว่างส่วนต่างๆ

cardActions[]

object (CardAction)

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

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

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

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

string

ชื่อบัตร ใช้เป็นตัวระบุการ์ดในการนำทางการ์ด

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

displayStyle

enum (DisplayStyle)

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

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

peekCardHeader

object (CardHeader)

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

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

CardHeader

แสดงส่วนหัวของการ์ด ดูตัวอย่างในแอป Google Chat ได้ที่เพิ่มส่วนหัว

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

การแสดง JSON 
{
  "title": string,
  "subtitle": string,
  "imageType": enum (ImageType),
  "imageUrl": string,
  "imageAltText": string
}
ช่อง
title

string

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

subtitle

string

ชื่อรองของส่วนหัวของการ์ด หากระบุ จะแสดงในบรรทัดของตัวเองใต้ title

imageType

enum (ImageType)

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

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

imageUrl

string

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

imageAltText

string

ข้อความสำรองของรูปภาพนี้ที่ใช้สำหรับการเข้าถึง

ImageType

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

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

Enum
SQUARE ค่าเริ่มต้น ใช้มาสก์สี่เหลี่ยมจัตุรัสกับรูปภาพ เช่น รูปภาพขนาด 4x3 จะกลายเป็น 3x3
CIRCLE ใช้มาสก์รูปวงกลมกับรูปภาพ เช่น รูปภาพขนาด 4x3 จะกลายเป็นวงกลมที่มีเส้นผ่านศูนย์กลาง 3

ส่วน

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

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

การแสดง JSON 
{
  "header": string,
  "widgets": [
    {
      object (Widget)
    }
  ],
  "collapsible": boolean,
  "uncollapsibleWidgetsCount": integer
}
ช่อง
header

string

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

widgets[]

object (Widget)

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

collapsible

boolean

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

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

หากต้องการพิจารณาว่าวิดเจ็ตใดซ่อนอยู่ ให้ระบุ uncollapsibleWidgetsCount

uncollapsibleWidgetsCount

integer

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

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

วิดเจ็ต

การ์ดแต่ละใบจะประกอบไปด้วยวิดเจ็ต

วิดเจ็ตเป็นออบเจ็กต์ผสมที่สามารถแสดงถึงข้อความ รูปภาพ ปุ่ม และออบเจ็กต์ประเภทอื่นๆ

การแสดง JSON 
{
  "horizontalAlignment": enum (HorizontalAlignment),

  // Union field data can be only one of the following:
  "textParagraph": {
    object (TextParagraph)
  },
  "image": {
    object (Image)
  },
  "decoratedText": {
    object (DecoratedText)
  },
  "buttonList": {
    object (ButtonList)
  },
  "textInput": {
    object (TextInput)
  },
  "selectionInput": {
    object (SelectionInput)
  },
  "dateTimePicker": {
    object (DateTimePicker)
  },
  "divider": {
    object (Divider)
  },
  "grid": {
    object (Grid)
  },
  "columns": {
    object (Columns)
  }
  // End of list of possible types for union field data.
}
ช่อง
horizontalAlignment

enum (HorizontalAlignment)

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

ช่องการรวม data วิดเจ็ตจะมีรายการต่อไปนี้ได้เพียง 1 รายการเท่านั้น คุณสามารถใช้ช่องวิดเจ็ตหลายช่องเพื่อแสดงรายการเพิ่มเติมได้ data ต้องเป็นอย่างใดอย่างหนึ่งต่อไปนี้เท่านั้น
textParagraph

object (TextParagraph)

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

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

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

object (Image)

แสดงรูปภาพ

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

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

object (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

object (ButtonList)

รายการปุ่ม

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

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

object (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

object (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

object (DateTimePicker)

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

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

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

object (Divider)

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

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

"divider": {
}
grid

object (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

object (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"
          }
        }
      ]
    }
  ]
}

TextParagraph

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

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

การแสดง JSON 
{
  "text": string
}
ช่อง
text

string

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

รูปภาพ

รูปภาพที่ระบุโดย URL และมีการดำเนินการ onClick ได้ ดูตัวอย่างได้ที่เพิ่มรูปภาพ

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

การแสดง JSON 
{
  "imageUrl": string,
  "onClick": {
    object (OnClick)
  },
  "altText": string
}
ช่อง
imageUrl

string

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

เช่น 

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

object (OnClick)

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

altText

string

ข้อความสำรองของรูปภาพนี้ที่ใช้สำหรับการเข้าถึง

OnClick

แสดงวิธีการตอบสนองเมื่อผู้ใช้คลิกองค์ประกอบแบบอินเทอร์แอกทีฟในการ์ด เช่น ปุ่ม

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

การแสดง JSON 
{

  // Union field data can be only one of the following:
  "action": {
    object (Action)
  },
  "openLink": {
    object (OpenLink)
  },
  "openDynamicLinkAction": {
    object (Action)
  },
  "card": {
    object (Card)
  }
  // End of list of possible types for union field data.
}
ช่อง

ช่องการรวม data

data ต้องเป็นอย่างใดอย่างหนึ่งต่อไปนี้เท่านั้น

action

object (Action)

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

card

object (Card)

การ์ดใหม่จะพุชไปยังชุดการ์ดหลังจากคลิกแล้ว (หากระบุไว้)

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

การดำเนินการ

การดำเนินการที่อธิบายลักษณะการทำงานเมื่อมีการส่งแบบฟอร์ม ตัวอย่างเช่น คุณสามารถเรียกใช้สคริปต์ Apps Script เพื่อจัดการกับแบบฟอร์ม หากระบบทริกเกอร์การดำเนินการ ระบบจะส่งค่าของแบบฟอร์มไปยังเซิร์ฟเวอร์

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

การแสดง JSON 
{
  "function": string,
  "parameters": [
    {
      object (ActionParameter)
    }
  ],
  "loadIndicator": enum (LoadIndicator),
  "persistValues": boolean,
  "interaction": enum (Interaction)
}
ช่อง
function

string

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

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

parameters[]

object (ActionParameter)

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

loadIndicator

enum (LoadIndicator)

ระบุสัญญาณบอกสถานะการโหลดที่การดำเนินการจะแสดงขณะเรียกการดำเนินการ

persistValues

boolean

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

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

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

interaction

enum (Interaction)

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

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

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

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

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

ActionParameter

รายการพารามิเตอร์สตริงที่จะใส่เมื่อมีการเรียกใช้เมธอดการดำเนินการ ตัวอย่างเช่น ลองใช้ปุ่มเลื่อนการแจ้งเตือน 3 ปุ่ม ได้แก่ ปิดเสียงเตือนชั่วคราวตอนนี้ ปิดเสียงเตือนชั่วคราว 1 วัน หรือปิดเสียงเตือนชั่วคราวในสัปดาห์หน้า คุณอาจใช้ action method = snooze() เพื่อส่งประเภทการเลื่อนการแจ้งเตือนและเวลาเลื่อนการแจ้งเตือนในรายการพารามิเตอร์สตริง

ดูข้อมูลเพิ่มเติมได้ที่ CommonEventObject

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

การแสดง JSON 
{
  "key": string,
  "value": string
}
ช่อง
key

string

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

value

string

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

LoadIndicator

ระบุสัญญาณบอกสถานะการโหลดที่การดำเนินการจะแสดงขณะเรียกการดำเนินการ

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

Enum
SPINNER แสดงไอคอนหมุนเพื่อระบุว่าเนื้อหากำลังโหลดอยู่
NONE ไม่มีอะไรปรากฏขึ้น

การโต้ตอบ

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

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

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

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

เมื่อระบุแล้ว สัญญาณบอกสถานะการโหลดจะไม่แสดง หากระบุไว้สำหรับส่วนเสริม การ์ดทั้งหมดจะถูกนำออกและจะไม่แสดงในไคลเอ็นต์

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

Enum
INTERACTION_UNSPECIFIED ค่าเริ่มต้น action จะทำงานตามปกติ
OPEN_DIALOG

เปิดกล่องโต้ตอบ ซึ่งเป็นอินเทอร์เฟซแบบการ์ดของหน้าต่างที่แอป Chat ใช้เพื่อโต้ตอบกับผู้ใช้

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

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

OpenAs

เมื่อการดำเนินการ OnClick เปิดลิงก์ ไคลเอ็นต์จะเปิดลิงก์เป็นหน้าต่างขนาดเต็ม (หากเป็นเฟรมที่ลูกค้าใช้) หรือการวางซ้อน (เช่น ป๊อปอัป) ได้ การติดตั้งใช้งานจะขึ้นอยู่กับความสามารถของแพลตฟอร์มลูกค้า และค่าที่เลือกอาจถูกละเว้นหากไคลเอ็นต์ไม่รองรับ FULL_SIZE ได้รับการสนับสนุนโดยไคลเอ็นต์ทั้งหมด

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

Enum
FULL_SIZE ลิงก์จะเปิดเป็นหน้าต่างขนาดเต็ม (หากเป็นเฟรมที่ลูกค้าใช้)
OVERLAY ลิงก์จะเปิดเป็นโฆษณาซ้อนทับ เช่น ป๊อปอัป

OnClose

สิ่งที่ไคลเอ็นต์ทำเมื่อปิดลิงก์ที่เปิดโดยการดำเนินการ OnClick

การใช้งานขึ้นอยู่กับความสามารถของแพลตฟอร์มลูกค้า เช่น เว็บเบราว์เซอร์อาจเปิดลิงก์ในหน้าต่างป๊อปอัปที่มีตัวแฮนเดิล OnClose

หากมีการตั้งค่าตัวแฮนเดิล OnOpen และ OnClose และแพลตฟอร์มไคลเอ็นต์รองรับทั้ง 2 ค่าไม่ได้ OnClose จะมีลำดับความสำคัญเหนือกว่า

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

Enum
NOTHING ค่าเริ่มต้น บัตรจะไม่โหลดซ้ำหรือไม่มีอะไรเกิดขึ้น
RELOAD

โหลดการ์ดซ้ำหลังจากหน้าต่างย่อยปิดลง

หากใช้ร่วมกับ OpenAs.OVERLAY หน้าต่างย่อยจะทำหน้าที่เป็นกล่องโต้ตอบโมดัลและระบบจะบล็อกการ์ดหลักไว้จนกว่าหน้าต่างย่อยจะปิดลง

DecoratedText

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

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

การแสดง JSON 
{
  "icon": {
    object (Icon)
  },
  "startIcon": {
    object (Icon)
  },
  "topLabel": string,
  "text": string,
  "wrapText": boolean,
  "bottomLabel": string,
  "onClick": {
    object (OnClick)
  },

  // Union field control can be only one of the following:
  "button": {
    object (Button)
  },
  "switchControl": {
    object (SwitchControl)
  },
  "endIcon": {
    object (Icon)
  }
  // End of list of possible types for union field control.
}
ช่อง
icon
(deprecated)

object (Icon)

เลิกใช้งานเพื่อใช้ startIcon แทน

startIcon

object (Icon)

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

topLabel

string

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

text

string

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

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

wrapText

boolean

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

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

bottomLabel

string

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

onClick

object (OnClick)

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

ช่องการรวม control ปุ่ม สวิตช์ ช่องทำเครื่องหมาย หรือรูปภาพที่ปรากฏทางด้านขวาของข้อความในวิดเจ็ต decoratedText control ต้องเป็นอย่างใดอย่างหนึ่งต่อไปนี้เท่านั้น
button

object (Button)

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

switchControl

object (SwitchControl)

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

endIcon

object (Icon)

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

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

Icon

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

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

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

การแสดง JSON 
{
  "altText": string,
  "imageType": enum (ImageType),

  // Union field icons can be only one of the following:
  "knownIcon": string,
  "iconUrl": string,
  "materialIcon": {
    object (MaterialIcon)
  }
  // End of list of possible types for union field icons.
}
ช่อง
altText

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

enum (ImageType)

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

ช่องการรวม icons ไอคอนที่แสดงในวิดเจ็ตบนการ์ด icons ต้องเป็นอย่างใดอย่างหนึ่งต่อไปนี้เท่านั้น
knownIcon

string

แสดงไอคอนในตัวของ Google Workspace

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

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

iconUrl

string

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

เช่น 

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

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

materialIcon

object (MaterialIcon)

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

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

"materialIcon": {
  "name": "check_box"
}

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

MaterialIcon

ไอคอน Material ของ Google ที่มีตัวเลือกมากกว่า 2, 500 รายการ

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

{
  "name": "check_box",
  "fill": true,
  "weight": 300,
  "grade": -25
}

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

การแสดง JSON 
{
  "name": string,
  "fill": boolean,
  "weight": integer,
  "grade": integer
}
ช่อง
name

string

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

fill

boolean

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

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

weight

integer

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

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

grade

integer

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

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

ปุ่ม

ข้อความ ไอคอน หรือข้อความและปุ่มไอคอนที่ผู้ใช้คลิกได้ ดูตัวอย่างของแอป Google Chat ได้ที่เพิ่มปุ่ม

หากต้องการทำให้รูปภาพเป็นปุ่มที่คลิกได้ ให้ระบุ Image (ไม่ใช่ ImageComponent) และตั้งค่าการทำงาน onClick

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

การแสดง JSON 
{
  "text": string,
  "icon": {
    object (Icon)
  },
  "color": {
    object (Color)
  },
  "onClick": {
    object (OnClick)
  },
  "disabled": boolean,
  "altText": string
}
ช่อง
text

string

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

icon

object (Icon)

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

color

object (Color)

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

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

สำหรับสีแดง เขียว และน้ำเงิน ค่าของแต่ละช่องเป็นตัวเลข float ที่คุณแสดงได้ 2 วิธี ได้แก่ เป็นตัวเลขระหว่าง 0 ถึง 255 หารด้วย 255 (153/255) หรือเป็นค่าระหว่าง 0 ถึง 1 (0.6) 0 หมายถึงไม่มีสี และ 1 หรือ 255/255 หมายถึงมีสีนั้นอย่างเต็มรูปแบบในสเกล RGB

เลือกตั้งค่า alpha ซึ่งตั้งค่าระดับความโปร่งใสโดยใช้สมการนี้ (ไม่บังคับ) 

pixel color = alpha * (this color) + (1.0 - alpha) * (background color)

สำหรับ alpha ค่า 1 จะสอดคล้องกับสีทึบ และค่า 0 จะสอดคล้องกับสีที่โปร่งใสโดยสมบูรณ์

ตัวอย่างเช่น สีต่อไปนี้แทนสีแดงโปร่งแสงครึ่งหนึ่ง 

"color": {
   "red": 1,
   "green": 0,
   "blue": 0,
   "alpha": 0.5
}
onClick

object (OnClick)

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

disabled

boolean

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

altText

string

ข้อความสำรองที่ใช้สำหรับการเข้าถึง

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

สี

แสดงสีในพื้นที่สี RGBA การนำเสนอนี้ออกแบบมาเพื่อความเรียบง่ายในการแปลงค่าเป็นและเปลี่ยนจากการแสดงสีในภาษาต่างๆ มากกว่าความกะทัดรัด เช่น อาจระบุช่องของการนำเสนอนี้ให้กับตัวสร้างของ java.awt.Color ใน Java ได้เล็กน้อย และยังระบุได้ในเมธอด +colorWithRed:green:blue:alpha ของ UIColor ใน iOS เพียงเล็กน้อย และปรับการจัดรูปแบบเป็นสตริง CSS rgba() ใน JavaScript ได้ง่ายๆ ด้วยการดำเนินการเพียงเล็กน้อย

หน้าข้อมูลอ้างอิงนี้ไม่มีข้อมูลเกี่ยวกับพื้นที่สีสัมบูรณ์ที่ควรใช้ในการตีความค่า RGB เช่น sRGB, Adobe RGB, DCI-P3 และ BT.2020 โดยค่าเริ่มต้น แอปพลิเคชันควรใช้พื้นที่สี sRGB

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

ตัวอย่าง (Java): 

 import com.google.type.Color;

 // ...
 public static java.awt.Color fromProto(Color protocolor) {
   float alpha = protocolor.hasAlpha()
       ? protocolor.getAlpha().getValue()
       : 1.0;

   return new java.awt.Color(
       protocolor.getRed(),
       protocolor.getGreen(),
       protocolor.getBlue(),
       alpha);
 }

 public static Color toProto(java.awt.Color color) {
   float red = (float) color.getRed();
   float green = (float) color.getGreen();
   float blue = (float) color.getBlue();
   float denominator = 255.0;
   Color.Builder resultBuilder =
       Color
           .newBuilder()
           .setRed(red / denominator)
           .setGreen(green / denominator)
           .setBlue(blue / denominator);
   int alpha = color.getAlpha();
   if (alpha != 255) {
     result.setAlpha(
         FloatValue
             .newBuilder()
             .setValue(((float) alpha) / denominator)
             .build());
   }
   return resultBuilder.build();
 }
 // ...

ตัวอย่าง (iOS / Obj-C): 

 // ...
 static UIColor* fromProto(Color* protocolor) {
    float red = [protocolor red];
    float green = [protocolor green];
    float blue = [protocolor blue];
    FloatValue* alpha_wrapper = [protocolor alpha];
    float alpha = 1.0;
    if (alpha_wrapper != nil) {
      alpha = [alpha_wrapper value];
    }
    return [UIColor colorWithRed:red green:green blue:blue alpha:alpha];
 }

 static Color* toProto(UIColor* color) {
     CGFloat red, green, blue, alpha;
     if (![color getRed:&red green:&green blue:&blue alpha:&alpha]) {
       return nil;
     }
     Color* result = [[Color alloc] init];
     [result setRed:red];
     [result setGreen:green];
     [result setBlue:blue];
     if (alpha <= 0.9999) {
       [result setAlpha:floatWrapperWithValue(alpha)];
     }
     [result autorelease];
     return result;
}
// ...

ตัวอย่าง (JavaScript): 

// ...

var protoToCssColor = function(rgb_color) {
   var redFrac = rgb_color.red || 0.0;
   var greenFrac = rgb_color.green || 0.0;
   var blueFrac = rgb_color.blue || 0.0;
   var red = Math.floor(redFrac * 255);
   var green = Math.floor(greenFrac * 255);
   var blue = Math.floor(blueFrac * 255);

   if (!('alpha' in rgb_color)) {
      return rgbToCssColor(red, green, blue);
   }

   var alphaFrac = rgb_color.alpha.value || 0.0;
   var rgbParams = [red, green, blue].join(',');
   return ['rgba(', rgbParams, ',', alphaFrac, ')'].join('');
};

var rgbToCssColor = function(red, green, blue) {
  var rgbNumber = new Number((red << 16) | (green << 8) | blue);
  var hexString = rgbNumber.toString(16);
  var missingZeros = 6 - hexString.length;
  var resultBuilder = ['#'];
  for (var i = 0; i < missingZeros; i++) {
     resultBuilder.push('0');
  }
  resultBuilder.push(hexString);
  return resultBuilder.join('');
};

// ...
การแสดง JSON 
{
  "red": number,
  "green": number,
  "blue": number,
  "alpha": number
}
ช่อง
red

number

จํานวนสีแดงในสีเป็นค่าในช่วง [0, 1]

green

number

ปริมาณสีเขียวในสีเป็นค่าในช่วง [0, 1]

blue

number

ปริมาณสีน้ำเงินในสีเป็นค่าในช่วง [0, 1]

alpha

number

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

pixel color = alpha * (this color) + (1.0 - alpha) * (background color)

หมายความว่าค่า 1.0 จะสอดคล้องกับสีทึบ ขณะที่ค่า 0.0 คือสีที่โปร่งใสโดยสมบูรณ์ วิธีนี้ใช้ข้อความ Wrapper แทนที่จะเป็นสเกลาร์ลอยตัวแบบง่ายเพื่อให้แยกความแตกต่างระหว่างค่าเริ่มต้นกับค่าที่ไม่ได้ตั้งค่าได้ หากไม่ระบุ วัตถุสีนี้จะแสดงเป็นสีทึบ (เสมือนว่าค่าอัลฟ่าได้รับการระบุอย่างชัดเจนว่าเป็น 1.0)

SwitchControl

สวิตช์รูปแบบสลับหรือช่องทำเครื่องหมายภายในวิดเจ็ต decoratedText

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

รองรับเฉพาะในวิดเจ็ต decoratedText

การแสดง JSON 
{
  "name": string,
  "value": string,
  "selected": boolean,
  "onChangeAction": {
    object (Action)
  },
  "controlType": enum (ControlType)
}
ช่อง
name

string

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

โปรดดูรายละเอียดเกี่ยวกับการทำงานกับอินพุตแบบฟอร์มที่หัวข้อรับข้อมูลแบบฟอร์ม

value

string

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

โปรดดูรายละเอียดเกี่ยวกับการทำงานกับอินพุตแบบฟอร์มที่หัวข้อรับข้อมูลแบบฟอร์ม

selected

boolean

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

onChangeAction

object (Action)

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

controlType

enum (ControlType)

ลักษณะที่สวิตช์ปรากฏในอินเทอร์เฟซผู้ใช้

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

ControlType

ลักษณะที่สวิตช์ปรากฏในอินเทอร์เฟซผู้ใช้

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

Enum
SWITCH สวิตช์สลับ
CHECKBOX เลิกใช้งานเพื่อใช้ CHECK_BOX แทน
CHECK_BOX ช่องทำเครื่องหมาย

ButtonList

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

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

การแสดง JSON 
{
  "buttons": [
    {
      object (Button)
    }
  ]
}
ช่อง
buttons[]

object (Button)

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

TextInput

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

แอป Chat จะได้รับและประมวลผลค่าของข้อความที่ป้อนระหว่างเหตุการณ์การป้อนข้อมูลแบบฟอร์ม โปรดดูรายละเอียดเกี่ยวกับการทำงานกับอินพุตแบบฟอร์มที่หัวข้อรับข้อมูลแบบฟอร์ม

ใช้การป้อนข้อความเมื่อต้องการรวบรวมข้อมูลที่ไม่ได้กําหนดหรือนามธรรมจากผู้ใช้ หากต้องการรวบรวมข้อมูลที่กำหนดไว้หรือแจกแจงจากผู้ใช้ ให้ใช้วิดเจ็ต SelectionInput

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

การแสดง JSON 
{
  "name": string,
  "label": string,
  "hintText": string,
  "value": string,
  "type": enum (Type),
  "onChangeAction": {
    object (Action)
  },
  "initialSuggestions": {
    object (Suggestions)
  },
  "autoCompleteAction": {
    object (Action)
  },
  "placeholderText": string
}
ช่อง
name

string

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

โปรดดูรายละเอียดเกี่ยวกับการทำงานกับอินพุตแบบฟอร์มที่หัวข้อรับข้อมูลแบบฟอร์ม

label

string

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

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

ต้องระบุหากไม่ได้ระบุ hintText หรือไม่บังคับ

hintText

string

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

ต้องระบุหากไม่ได้ระบุ label หรือไม่บังคับ

value

string

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

โปรดดูรายละเอียดเกี่ยวกับการทำงานกับอินพุตแบบฟอร์มที่หัวข้อรับข้อมูลแบบฟอร์ม

type

enum (Type)

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

onChangeAction

object (Action)

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

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

initialSuggestions

object (Suggestions)

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

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

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

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

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

autoCompleteAction

object (Action)

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

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

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

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

placeholderText

string

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

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

ประเภท

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

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

Enum
SINGLE_LINE ฟิลด์ป้อนข้อความมีความสูงคงที่อยู่ที่ 1 บรรทัด
MULTIPLE_LINE ฟิลด์ป้อนข้อความมีความสูงคงที่สำหรับบรรทัดหลายบรรทัด

RenderActions

ชุดวิธีการแสดงผลที่บอกให้การ์ดดำเนินการ หรือบอกให้แอปโฮสต์ของส่วนเสริมหรือแอป Chat ดำเนินการเฉพาะแอป

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

ช่อง
action

Action

การดำเนินการ

ช่อง
navigations[]

Navigation

พุชหรืออัปเดตการ์ดที่แสดง

เพิ่มบัตรใหม่ลงในกอง (ไปข้างหน้า)

พร้อมใช้งานในส่วนเสริมของ Google Workspace และไม่พร้อมใช้งานในแอป Google Chat

navigations: {
  pushCard: CARD
}

แทนที่การ์ดบนสุดด้วยการ์ดใหม่

พร้อมใช้งานในส่วนเสริมของ Google Workspace และไม่พร้อมใช้งานในแอป Google Chat

navigations: {
  updateCard: CARD
}

คำแนะนำ

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

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

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

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

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

การแสดง JSON 
{
  "items": [
    {
      object (SuggestionItem)
    }
  ]
}
ช่อง
items[]

object (SuggestionItem)

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

SuggestionItem

ค่าที่แนะนำ 1 ค่าที่ผู้ใช้ป้อนลงในช่องป้อนข้อความได้

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

การแสดง JSON 
{

  // Union field content can be only one of the following:
  "text": string
  // End of list of possible types for union field content.
}
ช่อง

ช่องการรวม content

content ต้องเป็นอย่างใดอย่างหนึ่งต่อไปนี้เท่านั้น

text

string

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

SelectionInput

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

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

หากต้องการรวบรวมข้อมูลที่ไม่ได้กำหนดหรือนามธรรมจากผู้ใช้ ให้ใช้วิดเจ็ต TextInput

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

การแสดง JSON 
{
  "name": string,
  "label": string,
  "type": enum (SelectionType),
  "items": [
    {
      object (SelectionItem)
    }
  ],
  "onChangeAction": {
    object (Action)
  },
  "multiSelectMaxSelectedItems": integer,
  "multiSelectMinQueryLength": integer,

  // Union field multi_select_data_source can be only one of the following:
  "externalDataSource": {
    object (Action)
  },
  "platformDataSource": {
    object (PlatformDataSource)
  }
  // End of list of possible types for union field multi_select_data_source.
}
ช่อง
name

string

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

โปรดดูรายละเอียดเกี่ยวกับการทำงานกับอินพุตแบบฟอร์มที่หัวข้อรับข้อมูลแบบฟอร์ม

label

string

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

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

type

enum (SelectionType)

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

items[]

object (SelectionItem)

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

onChangeAction

object (Action)

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

โปรดดูรายละเอียดเกี่ยวกับการทำงานกับอินพุตแบบฟอร์มที่หัวข้อรับข้อมูลแบบฟอร์ม

multiSelectMaxSelectedItems

integer

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

multiSelectMinQueryLength

integer

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

หากไม่ระบุ ค่าเริ่มต้นจะเป็น 0 อักขระสำหรับแหล่งข้อมูลแบบคงที่ และ 3 อักขระสำหรับแหล่งข้อมูลภายนอก

ช่องการรวม multi_select_data_source แหล่งข้อมูลที่เติมข้อมูลรายการที่เลือกสำหรับเมนูการเลือกหลายรายการ

ใช้ได้กับแอป Google Chat และใช้กับส่วนเสริมของ Google Workspace ไม่ได้ multi_select_data_source ต้องเป็นอย่างใดอย่างหนึ่งต่อไปนี้เท่านั้น

externalDataSource

object (Action)

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

platformDataSource

object (PlatformDataSource)

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

SelectionType

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

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

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

Enum
CHECK_BOX ชุดช่องทำเครื่องหมาย ผู้ใช้เลือกช่องทำเครื่องหมายได้อย่างน้อย 1 ช่อง
RADIO_BUTTON ชุดปุ่มตัวเลือก ผู้ใช้เลือกปุ่มตัวเลือกได้ 1 ปุ่ม
SWITCH ชุดสวิตช์ ผู้ใช้เปิดสวิตช์ได้อย่างน้อย 1 รายการ
DROPDOWN เมนูแบบเลื่อนลง ผู้ใช้เลือกได้ 1 รายการจากเมนู
MULTI_SELECT

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

หากต้องการป้อนรายการสำหรับเมนูการเลือกหลายรายการ คุณสามารถใช้แหล่งข้อมูลประเภทใดประเภทหนึ่งต่อไปนี้

  • ข้อมูลแบบคงที่: มีการระบุรายการเป็นออบเจ็กต์ SelectionItem ในวิดเจ็ต สูงสุด 100 รายการ
  • ข้อมูล Google Workspace: ระบบจะสร้างรายการโดยใช้ข้อมูลจาก Google Workspace เช่น ผู้ใช้ Google Workspace หรือพื้นที่ใน Google Chat
  • ข้อมูลภายนอก: ระบบจะป้อนข้อมูลจากแหล่งข้อมูลภายนอกภายนอก Google Workspace

ดูตัวอย่างวิธีใช้เมนูแบบเลือกหลายรายการได้ที่เพิ่มเมนูแบบเลือกหลายรายการ

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace การเลือกหลายรายการสําหรับส่วนเสริมของ Google Workspace อยู่ในเวอร์ชันตัวอย่างสำหรับนักพัฒนาซอฟต์แวร์

SelectionItem

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

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

การแสดง JSON 
{
  "text": string,
  "value": string,
  "selected": boolean,
  "startIconUri": string,
  "bottomText": string
}
ช่อง
text

string

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

value

string

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

โปรดดูรายละเอียดเกี่ยวกับการทำงานกับอินพุตแบบฟอร์มที่หัวข้อรับข้อมูลแบบฟอร์ม

selected

boolean

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

startIconUri

string

สำหรับเมนูแบบเลือกหลายรายการ URL สำหรับไอคอนที่แสดงถัดจากช่อง text ของรายการ รองรับไฟล์ PNG และ JPEG ต้องเป็น URL HTTPS เช่น https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png

bottomText

string

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

PlatformDataSource

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

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

การแสดง JSON 
{

  // Union field data_source can be only one of the following:
  "commonDataSource": enum (CommonDataSource),
  "hostAppDataSource": {
    object (HostAppDataSourceMarkup)
  }
  // End of list of possible types for union field data_source.
}
ช่อง
ช่องการรวม data_source แหล่งข้อมูล data_source ต้องเป็นอย่างใดอย่างหนึ่งต่อไปนี้เท่านั้น
commonDataSource

enum (CommonDataSource)

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

hostAppDataSource

object (HostAppDataSourceMarkup)

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

CommonDataSource

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

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

Enum
UNKNOWN ค่าเริ่มต้น โปรดอย่าใช้
USER Google Workspace ผู้ใช้จะดูและเลือกผู้ใช้ได้จากองค์กร Google Workspace เท่านั้น

HostAppDataSourceMarkup

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

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

การแสดง JSON 
{

  // Union field data_source can be only one of the following:
  "chatDataSource": {
    object (ChatClientDataSourceMarkup)
  }
  // End of list of possible types for union field data_source.
}
ช่อง
ช่องการรวม data_source แอปพลิเคชัน Google Workspace ที่เติมข้อมูลรายการสำหรับเมนูแบบเลือกหลายรายการ data_source ต้องเป็นอย่างใดอย่างหนึ่งต่อไปนี้เท่านั้น
chatDataSource

object (ChatClientDataSourceMarkup)

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

ChatClientDataSourceMarkup

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

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

การแสดง JSON 
{

  // Union field source can be only one of the following:
  "spaceDataSource": {
    object (SpaceDataSource)
  }
  // End of list of possible types for union field source.
}
ช่อง
ช่องการรวม source แหล่งข้อมูล Google Chat source ต้องเป็นอย่างใดอย่างหนึ่งต่อไปนี้เท่านั้น
spaceDataSource

object (SpaceDataSource)

พื้นที่ใน Google Chat ที่ผู้ใช้เป็นสมาชิก

SpaceDataSource

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

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

การแสดง JSON 
{
  "defaultToCurrentSpace": boolean
}
ช่อง
defaultToCurrentSpace

boolean

หากตั้งค่าเป็น true เมนูแบบเลือกหลายรายการจะเลือกพื้นที่ปัจจุบันใน Google Chat เป็นรายการโดยค่าเริ่มต้น

DateTimePicker

อนุญาตให้ผู้ใช้ป้อนวันที่ เวลา หรือทั้งวันที่และเวลา ดูตัวอย่างในแอป Google Chat ที่ให้ผู้ใช้เลือกวันที่และเวลา

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

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

การแสดง JSON 
{
  "name": string,
  "label": string,
  "type": enum (DateTimePickerType),
  "valueMsEpoch": string,
  "timezoneOffsetDate": integer,
  "onChangeAction": {
    object (Action)
  }
}
ช่อง
name

string

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

โปรดดูรายละเอียดเกี่ยวกับการทำงานกับอินพุตแบบฟอร์มที่หัวข้อรับข้อมูลแบบฟอร์ม

label

string

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

type

enum (DateTimePickerType)

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

valueMsEpoch

string (int64 format)

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

ระบุค่าตามประเภทของเครื่องมือเลือก (DateTimePickerType) ดังนี้

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

integer

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

onChangeAction

object (Action)

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

DateTimePickerType

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

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

Enum
DATE_AND_TIME ผู้ใช้ป้อนวันที่และเวลา
DATE_ONLY ผู้ใช้ป้อนวันที่
TIME_ONLY ผู้ใช้ป้อนเวลา

ตัวแบ่ง

ประเภทนี้ไม่มีช่อง

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

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

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

"divider": {}

GRid

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

ตารางกริดรองรับคอลัมน์และรายการกี่รายการก็ได้ จํานวนแถวกําหนดโดยรายการหารด้วยคอลัมน์ ตารางกริดที่มี 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"
    }
  }
}
การแสดง JSON 
{
  "title": string,
  "items": [
    {
      object (GridItem)
    }
  ],
  "borderStyle": {
    object (BorderStyle)
  },
  "columnCount": integer,
  "onClick": {
    object (OnClick)
  }
}
ช่อง
title

string

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

items[]

object (GridItem)

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

borderStyle

object (BorderStyle)

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

columnCount

integer

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

onClick

object (OnClick)

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

GridItem

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

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

การแสดง JSON 
{
  "id": string,
  "image": {
    object (ImageComponent)
  },
  "title": string,
  "subtitle": string,
  "layout": enum (GridItemLayout)
}
ช่อง
id

string

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

image

object (ImageComponent)

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

title

string

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

subtitle

string

คำบรรยายของรายการในตาราง

layout

enum (GridItemLayout)

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

ImageComponent

แสดงรูปภาพ

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

การแสดง JSON 
{
  "imageUri": string,
  "altText": string,
  "cropStyle": {
    object (ImageCropStyle)
  },
  "borderStyle": {
    object (BorderStyle)
  }
}
ช่อง
imageUri

string

URL รูปภาพ

altText

string

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

cropStyle

object (ImageCropStyle)

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

borderStyle

object (BorderStyle)

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

ImageCropStyle

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

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

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

cropStyle {
 "type": "RECTANGLE_CUSTOM",
 "aspectRatio": 16/9
}
การแสดง JSON 
{
  "type": enum (ImageCropType),
  "aspectRatio": number
}
ช่อง
type

enum (ImageCropType)

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

aspectRatio

number

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

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

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

ImageCropType

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

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

Enum
IMAGE_CROP_TYPE_UNSPECIFIED โปรดอย่าใช้ ไม่ระบุ
SQUARE ค่าเริ่มต้น ใช้การครอบตัดสี่เหลี่ยมจัตุรัส
CIRCLE ใช้การครอบตัดวงกลม
RECTANGLE_CUSTOM ใช้การครอบตัดสี่เหลี่ยมผืนผ้าที่มีสัดส่วนภาพที่กําหนดเอง ตั้งค่าสัดส่วนภาพที่กําหนดเองด้วย aspectRatio
RECTANGLE_4_3 ใช้การครอบตัดสี่เหลี่ยมผืนผ้าที่มีสัดส่วนภาพ 4:3

BorderStyle

ตัวเลือกรูปแบบสำหรับเส้นขอบของการ์ดหรือวิดเจ็ต รวมถึงประเภทและสีของเส้นขอบ

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

การแสดง JSON 
{
  "type": enum (BorderType),
  "strokeColor": {
    object (Color)
  },
  "cornerRadius": integer
}
ช่อง
type

enum (BorderType)

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

strokeColor

object (Color)

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

cornerRadius

integer

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

BorderType

แสดงประเภทเส้นขอบที่ใช้กับวิดเจ็ต

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

Enum
BORDER_TYPE_UNSPECIFIED โปรดอย่าใช้ ไม่ระบุ
NO_BORDER ค่าเริ่มต้น ไม่มีเส้นขอบ
STROKE โครงร่าง

GridItemLayout

แสดงตัวเลือกเลย์เอาต์ต่างๆ ที่มีให้ใช้งานสำหรับรายการแบบตารางกริด

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

Enum
GRID_ITEM_LAYOUT_UNSPECIFIED โปรดอย่าใช้ ไม่ระบุ
TEXT_BELOW ชื่อและคำบรรยายจะแสดงใต้รูปภาพรายการในตารางกริด
TEXT_ABOVE ชื่อและคำบรรยายจะแสดงเหนือรูปภาพรายการตารางกริด

คอลัมน์

วิดเจ็ต Columns จะแสดงคอลัมน์สูงสุด 2 คอลัมน์ในการ์ดหรือกล่องโต้ตอบ คุณสามารถเพิ่มวิดเจ็ตในแต่ละคอลัมน์ โดยวิดเจ็ตจะปรากฏตามลำดับที่ระบุไว้ ดูตัวอย่างในแอป Google Chat ได้ที่แสดงการ์ดและกล่องโต้ตอบในคอลัมน์

ความสูงของแต่ละคอลัมน์จะกำหนดโดยคอลัมน์แบบสูงขึ้น ตัวอย่างเช่น หากคอลัมน์แรกสูงกว่าคอลัมน์ที่ 2 ทั้ง 2 คอลัมน์จะมีความสูงของคอลัมน์แรก เนื่องจากแต่ละคอลัมน์มีจำนวนวิดเจ็ตไม่เท่ากัน คุณจึงกำหนดแถวหรือจัดเรียงวิดเจ็ตระหว่างคอลัมน์ไม่ได้

คอลัมน์ต่างๆ จะแสดงคู่กัน คุณปรับแต่งความกว้างของแต่ละคอลัมน์ได้โดยใช้ช่อง HorizontalSizeStyle หากความกว้างหน้าจอของผู้ใช้แคบเกินไป คอลัมน์ที่ 2 จะอยู่ด้านล่างของคอลัมน์แรก ดังนี้

  • บนเว็บ คอลัมน์ที่ 2 จะตัดข้อความหากมีความกว้างหน้าจอน้อยกว่าหรือเท่ากับ 480 พิกเซล
  • ในอุปกรณ์ iOS คอลัมน์ที่ 2 จะตัดคอลัมน์ที่ 2 หากความกว้างหน้าจอน้อยกว่าหรือเท่ากับ 300 พอยต์
  • ในอุปกรณ์ Android คอลัมน์ที่ 2 จะตัดคอลัมน์ที่ 2 หากความกว้างหน้าจอน้อยกว่าหรือเท่ากับ 320 dp

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

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace คอลัมน์สําหรับส่วนเสริม Google Workspace จะอยู่ในเวอร์ชันตัวอย่างสำหรับนักพัฒนาซอฟต์แวร์

การแสดง JSON 
{
  "columnItems": [
    {
      object (Column)
    }
  ]
}
ช่อง
columnItems[]

object (Column)

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

คอลัมน์

คอลัมน์

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace คอลัมน์สําหรับส่วนเสริม Google Workspace จะอยู่ในเวอร์ชันตัวอย่างสำหรับนักพัฒนาซอฟต์แวร์

การแสดง JSON 
{
  "horizontalSizeStyle": enum (HorizontalSizeStyle),
  "horizontalAlignment": enum (HorizontalAlignment),
  "verticalAlignment": enum (VerticalAlignment),
  "widgets": [
    {
      object (Widgets)
    }
  ]
}
ช่อง
horizontalSizeStyle

enum (HorizontalSizeStyle)

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

horizontalAlignment

enum (HorizontalAlignment)

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

verticalAlignment

enum (VerticalAlignment)

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

widgets[]

object (Widgets)

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

HorizontalSizeStyle

ระบุวิธีที่คอลัมน์เติมความกว้างของการ์ด ความกว้างของแต่ละคอลัมน์ขึ้นอยู่กับทั้ง HorizontalSizeStyle และความกว้างของวิดเจ็ตภายในคอลัมน์

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace คอลัมน์สําหรับส่วนเสริม Google Workspace จะอยู่ในเวอร์ชันตัวอย่างสำหรับนักพัฒนาซอฟต์แวร์

Enum
HORIZONTAL_SIZE_STYLE_UNSPECIFIED โปรดอย่าใช้ ไม่ระบุ
FILL_AVAILABLE_SPACE ค่าเริ่มต้น คอลัมน์จะแสดงเต็มพื้นที่ว่างไม่เกิน 70% ของความกว้างของการ์ด หากตั้งค่าทั้ง 2 คอลัมน์เป็น FILL_AVAILABLE_SPACE แต่ละคอลัมน์จะใช้พื้นที่ว่าง 50%
FILL_MINIMUM_SPACE คอลัมน์จะแสดงถึงพื้นที่น้อยที่สุดเท่าที่จะเป็นไปได้และไม่เกิน 30% ของความกว้างของการ์ด

HorizontalAlignment

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

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

Enum
HORIZONTAL_ALIGNMENT_UNSPECIFIED โปรดอย่าใช้ ไม่ระบุ
START ค่าเริ่มต้น จัดวิดเจ็ตไปยังตำแหน่งเริ่มต้นของคอลัมน์ สำหรับเลย์เอาต์แบบซ้ายไปขวา ให้จัดชิดซ้าย สำหรับเลย์เอาต์จากขวาไปซ้าย ให้จัดชิดขวา
CENTER จัดวิดเจ็ตไว้ตรงกลางคอลัมน์
END จัดวิดเจ็ตไปยังตำแหน่งสิ้นสุดของคอลัมน์ สำหรับเลย์เอาต์แบบซ้ายไปขวา ให้จัดวิดเจ็ตไว้ทางขวา สำหรับเลย์เอาต์จากขวาไปซ้าย ให้จัดวิดเจ็ตไปทางซ้าย

VerticalAlignment

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

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace คอลัมน์สําหรับส่วนเสริม Google Workspace จะอยู่ในเวอร์ชันตัวอย่างสำหรับนักพัฒนาซอฟต์แวร์

Enum
VERTICAL_ALIGNMENT_UNSPECIFIED โปรดอย่าใช้ ไม่ระบุ
CENTER ค่าเริ่มต้น จัดวิดเจ็ตไว้ตรงกลางคอลัมน์
TOP จัดวิดเจ็ตไว้ที่ด้านบนของคอลัมน์
BOTTOM จัดวิดเจ็ตให้อยู่ที่ด้านล่างของคอลัมน์

วิดเจ็ต

วิดเจ็ตที่สนับสนุนที่คุณสามารถรวมไว้ในคอลัมน์ได้

ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace คอลัมน์สําหรับส่วนเสริม Google Workspace จะอยู่ในเวอร์ชันตัวอย่างสำหรับนักพัฒนาซอฟต์แวร์

การแสดง JSON 
{

  // Union field data can be only one of the following:
  "textParagraph": {
    object (TextParagraph)
  },
  "image": {
    object (Image)
  },
  "decoratedText": {
    object (DecoratedText)
  },
  "buttonList": {
    object (ButtonList)
  },
  "textInput": {
    object (TextInput)
  },
  "selectionInput": {
    object (SelectionInput)
  },
  "dateTimePicker": {
    object (DateTimePicker)
  }
  // End of list of possible types for union field data.
}
ช่อง

ช่องการรวม data

data ต้องเป็นอย่างใดอย่างหนึ่งต่อไปนี้เท่านั้น

textParagraph

object (TextParagraph)

วิดเจ็ต TextParagraph

image

object (Image)

วิดเจ็ต Image

decoratedText

object (DecoratedText)

วิดเจ็ต DecoratedText

buttonList

object (ButtonList)

วิดเจ็ต ButtonList

textInput

object (TextInput)

วิดเจ็ต TextInput

selectionInput

object (SelectionInput)

วิดเจ็ต SelectionInput

dateTimePicker

object (DateTimePicker)

วิดเจ็ต DateTimePicker

DividerStyle

รูปแบบตัวแบ่งของการ์ด ปัจจุบันใช้เฉพาะสำหรับตัวแบ่งระหว่างส่วนต่างๆ ของการ์ด

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

Enum
DIVIDER_STYLE_UNSPECIFIED โปรดอย่าใช้ ไม่ระบุ
SOLID_DIVIDER ตัวเลือกเริ่มต้น แสดงเส้นแบ่งที่ทึบระหว่างส่วนต่างๆ
NO_DIVIDER หากตั้งค่า จะไม่มีการแสดงเส้นแบ่งระหว่างส่วนต่างๆ

CardAction

การดำเนินการของการ์ดคือการดำเนินการที่เชื่อมโยงกับการ์ด เช่น การ์ดใบแจ้งหนี้อาจรวมการดำเนินการต่างๆ เช่น ลบใบแจ้งหนี้ อีเมลใบแจ้งหนี้ หรือเปิดใบแจ้งหนี้ในเบราว์เซอร์

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

การแสดง JSON 
{
  "actionLabel": string,
  "onClick": {
    object (OnClick)
  }
}
ช่อง
actionLabel

string

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

onClick

object (OnClick)

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

CardFixedFooter

ส่วนท้ายแบบคงที่ (ติดหนึบ) ซึ่งปรากฏที่ด้านล่างของการ์ด

การตั้งค่า fixedFooter โดยไม่ระบุ primaryButton หรือ secondaryButton จะทำให้เกิดข้อผิดพลาด

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

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

การแสดง JSON 
{
  "primaryButton": {
    object (Button)
  },
  "secondaryButton": {
    object (Button)
  }
}
ช่อง
primaryButton

object (Button)

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

secondaryButton

object (Button)

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

DisplayStyle

ในส่วนเสริมของ Google Workspace จะกำหนดวิธีการแสดงการ์ด

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

Enum
DISPLAY_STYLE_UNSPECIFIED โปรดอย่าใช้ ไม่ระบุ
PEEK ส่วนหัวของการ์ดจะปรากฏที่ด้านล่างของแถบด้านข้าง โดยบดบังการ์ดบนสุดในปัจจุบันของกลุ่มบางส่วน การคลิกที่ส่วนหัวจะเป็นการแสดงการ์ดในกลุ่มการ์ด หากการ์ดไม่มีส่วนหัว ระบบจะใช้ส่วนหัวที่สร้างขึ้นแทน
REPLACE ค่าเริ่มต้น การ์ดจะแสดงโดยแทนที่มุมมองของการ์ดบนสุดในกลุ่มการ์ด