วิดเจ็ต Columns จะแสดงคอลัมน์สูงสุด 2 คอลัมน์ในการ์ดหรือกล่องโต้ตอบ คุณเพิ่มวิดเจ็ตไปยัง Column แต่ละรายการได้ โดยวิดเจ็ตจะปรากฏตามลำดับที่ระบุไว้ ดูตัวอย่างในแอป Google Chat ได้ที่คอลัมน์
ความสูงของแต่ละคอลัมน์จะกำหนดโดยคอลัมน์แบบสูงขึ้น ตัวอย่างเช่น หากคอลัมน์แรก สูงกว่าคอลัมน์ที่ 2 ทั้ง 2 คอลัมน์จะมีความสูงของคอลัมน์แรก เนื่องจากแต่ละคอลัมน์จะมีวิดเจ็ตจำนวนต่างกันได้ คุณจึงกำหนดแถวหรือจัดเรียงวิดเจ็ตระหว่างคอลัมน์ไม่ได้
คอลัมน์ต่างๆ จะแสดงคู่กัน คุณปรับแต่งความกว้างของแต่ละคอลัมน์ได้โดยใช้ช่อง HorizontalSizeStyle หากความกว้างหน้าจอของผู้ใช้แคบเกินไป คอลัมน์ที่ 2 จะอยู่ด้านล่างของคอลัมน์แรก
- บนเว็บ คอลัมน์ที่ 2 จะตัดข้อความหากมีความกว้างหน้าจอน้อยกว่าหรือเท่ากับ 480 พิกเซล
- ในอุปกรณ์ iOS คอลัมน์ที่ 2 จะตัดคอลัมน์ที่ 2 หากความกว้างหน้าจอน้อยกว่าหรือเท่ากับ 300 พอยต์
- ในอุปกรณ์ Android คอลัมน์ที่ 2 จะตัดคอลัมน์ที่ 2 หากความกว้างหน้าจอน้อยกว่าหรือเท่ากับ 320 dp
ใช้ได้กับแอป Google Chat และส่วนเสริมของ Google Workspace
// Build a column that is aligned in the center and fills the space:
const column = CardService.newColumn()
.setHorizontalSizeStyle(CardService.HorizontalSizeStyle.FILL_AVAILABLE_SPACE)
.setHorizontalAlignment(CardService.HorizontalAlignment.CENTER)
.setVerticalAlignment(CardService.VerticalAlignment.CENTER);
const columns = CardService.newColumns()
.addColumn(column)
.setWrapStyle(CardService.WrapStyle.WRAP);
วิธีการ
| วิธีการ | ประเภทการแสดงผล | รายละเอียดแบบย่อ |
|---|---|---|
addColumn(column) | Columns | เพิ่ม Column ลงในวิดเจ็ตคอลัมน์ |
setWrapStyle(wrapStyle) | Columns | ตั้งค่ารูปแบบการตัดคอลัมน์ ควบคุมการปรับขนาดคอลัมน์ตามความกว้างของหน้าจอ |
เอกสารโดยละเอียด
addColumn(column)
เพิ่ม Column ลงในวิดเจ็ตคอลัมน์ คอลัมน์ต่างๆ จะแสดงตามลำดับการเพิ่ม คุณเพิ่มได้สูงสุด 2 คอลัมน์
const columns = CardService.newColumns()
.addColumn(CardService.newColumn());
พารามิเตอร์
| ชื่อ | ประเภท | คำอธิบาย |
|---|---|---|
column | Column | คอลัมน์ย่อยที่จะเพิ่มลงในวิดเจ็ตคอลัมน์ |
รีเทิร์น
Columns — ออบเจ็กต์นี้สำหรับการทำเชน
setWrapStyle(wrapStyle)
ตั้งค่ารูปแบบการตัดคอลัมน์ ควบคุมการปรับขนาดคอลัมน์ตามความกว้างของหน้าจอ
const columns = CardService.newColumns()
.addColumn(CardService.newColumn())
.setWrapStyle(CardService.WrapStyle.WRAP);
พารามิเตอร์
| ชื่อ | ประเภท | คำอธิบาย |
|---|---|---|
wrapStyle | WrapStyle | รูปแบบการตัดข้อความที่จะตั้งค่าสำหรับคอลัมน์ |
รีเทิร์น
Columns — ออบเจ็กต์นี้สำหรับการทำเชน