Card
ด้านล่างนี้คือตัวอย่างการ์ดส่วนเสริม
function createCard() { return CardService.newCardBuilder() .setHeader(CardService.newCardHeader().setTitle('CardTitle')) .build(); }
หรือจะคืนการ์ดหลายใบก็ได้ดังนี้
function createCards() { return [ CardService.newCardBuilder().build(), CardService.newCardBuilder().build(), CardService.newCardBuilder().build(), ]; }
ตัวอย่างต่อไปนี้แสดงวิธีที่คุณกำหนดการ์ดที่มีส่วนหัว ข้อความ รูปภาพ และรายการเมนู
function createWidgetDemoCard() { return CardService.newCardBuilder() .setHeader( CardService.newCardHeader() .setTitle('Widget demonstration') .setSubtitle('Check out these widgets') .setImageStyle(CardService.ImageStyle.SQUARE) .setImageUrl('https://www.example.com/images/headerImage.png'), ) .addSection( CardService.newCardSection() .setHeader('Simple widgets') // optional .addWidget( CardService.newTextParagraph().setText( 'These widgets are display-only. ' + 'A text paragraph can have multiple lines and ' + 'formatting.', ), ) .addWidget( CardService.newImage().setImageUrl( 'https://www.example.com/images/mapsImage.png', ), ), ) .addCardAction( CardService.newCardAction().setText('Gmail').setOpenLink( CardService.newOpenLink().setUrl('https://mail.google.com/mail'), ), ) .build(); }
ตัวอย่างการ์ดแอป Chat
const cardHeader = CardService.newCardHeader() .setTitle('Sasha') .setSubtitle('Software Engineer') .setImageUrl( 'https://developers.google.com/chat/images/quickstart-app-avatar.png', ) .setImageStyle(CardService.ImageStyle.CIRCLE) .setImageAltText('Avatar for Sasha'); const cardSection = CardService.newCardSection() .setHeader('Contact Info') .setCollapsible(true) .setNumUncollapsibleWidgets(1) .addWidget( CardService.newDecoratedText() .setStartIcon( CardService.newIconImage().setIcon(CardService.Icon.EMAIL)) .setText('sasha@example.com'), ) .addWidget( CardService.newDecoratedText() .setStartIcon( CardService.newIconImage().setIcon(CardService.Icon.PERSON)) .setText('<font color="#80e27e">Online</font>'), ) .addWidget( CardService.newDecoratedText() .setStartIcon( CardService.newIconImage().setIcon(CardService.Icon.PHONE)) .setText('+1 (555) 555-1234'), ) .addWidget( CardService.newButtonSet() .addButton( CardService.newTextButton().setText('Share').setOpenLink( CardService.newOpenLink().setUrl( 'https://example.com/share'), ), ) .addButton( CardService.newTextButton() .setText('Edit') .setOnClickAction( CardService.newAction() .setFunctionName('goToView') .setParameters({viewType: 'EDIT'}), ), ), ); const card = CardService.newCardBuilder() .setHeader(cardHeader) .addSection(cardSection) .build();
พร็อพเพอร์ตี้
เมธอด
เอกสารโดยละเอียด
new Action Response Builder()
สร้าง Action ใหม่
รีเทิร์น
Action — เครื่องมือสร้าง ActionResponse ที่ว่างเปล่า
new Action Status()
สร้าง Action ใหม่
ใช้ได้กับแอป Google Chat เท่านั้น ไม่พร้อมใช้งานสำหรับส่วนเสริม Google Workspace
const actionStatus = CardService.newActionStatus() .setStatusCode(CardService.Status.OK) .setUserFacingMessage('Success');
รีเทิร์น
Action — ActionStatus ที่ว่างเปล่า
new Attachment()
new Authorization Action()
new Authorization Exception()
สร้าง Authorization ใหม่
รีเทิร์น
Authorization — AuthorizationException ที่ว่างเปล่า
new Border Style()
new Calendar Event Action Response Builder()
สร้าง Calendar ใหม่
รีเทิร์น
Calendar — Calendar ว่างเปล่า
new Card Action()
new Card Builder()
new Card Header()
new Card Section()
new Card With Id()
สร้าง Card ใหม่ ใช้เพื่อส่งการ์ดในข้อความ Google Chat โดยรหัสการ์ด
เป็นตัวระบุที่ไม่ซ้ำกันสำหรับการ์ดในข้อความเมื่อส่งการ์ดหลายใบ
ใช้ได้กับแอป Google Chat เท่านั้น ไม่พร้อมใช้งานสำหรับส่วนเสริม Google Workspace
const cardSection = CardService.newCardSection(); cardSection.addWidget( CardService.newTextParagraph().setText('This is a text paragraph widget.'), ); const card = CardService.newCardBuilder() .setHeader(CardService.newCardHeader().setTitle('Card title')) .addSection(cardSection) .build(); const cardWithId = CardService.newCardWithId().setCardId('card_id').setCard(card);
รีเทิร์น
Card — Card ว่างเปล่า
new Carousel()
สร้าง Carousel
const carousel = CardService.newCarousel() .addCarouselCard(CardService.newCarouselCard().addWidget( CardService.newTextParagraph().setText('The first text paragraph in carousel'))) .addCarouselCard(CardService.newCarouselCard().addWidget( CardService.newTextParagraph().setText('The second text paragraph in carousel'))) .addCarouselCard(CardService.newCarouselCard().addWidget( CardService.newTextParagraph().setText('The third text paragraph in carousel')))
รีเทิร์น
Carousel — ภาพสไลด์ที่ว่างเปล่า
new Carousel Card()
สร้าง Carousel ใหม่
const carouselCard = CardService.newCarouselCard().addWidget( CardService.newTextParagraph().setText('Text paragraph in carousel'));
รีเทิร์น
Carousel — ชิปที่ว่างเปล่า
new Chat Action Response()
สร้าง Chat ใหม่
ใช้ได้กับแอป Google Chat เท่านั้น ไม่พร้อมใช้งานสำหรับส่วนเสริม Google Workspace
const card = CardService.newCardBuilder() .setHeader(CardService.newCardHeader().setTitle('Card title')) .build(); const dialog = CardService.newDialog().setBody(card); const dialogAction = CardService.newDialogAction().setDialog(dialog); const chatActionResponse = CardService.newChatActionResponse() .setResponseType(CardService.ResponseType.DIALOG) .setDialogAction(dialogAction);
รีเทิร์น
Chat — Chat ว่างเปล่า
new Chat Response Builder()
สร้าง Chat ใหม่
ใช้ได้กับแอป Google Chat เท่านั้น ไม่พร้อมใช้งานสำหรับส่วนเสริม Google Workspace
const cardSection = CardService.newCardSection(); cardSection.addWidget( CardService.newTextParagraph().setText('This is a text paragraph widget.'), ); const card = CardService.newCardBuilder() .setHeader(CardService.newCardHeader().setTitle('Card title')) .addSection(cardSection) .build(); const cardWithId = CardService.newCardWithId().setCardId('card_id').setCard(card); const chatResponse = CardService.newChatResponseBuilder().addCardsV2(cardWithId).build();
รีเทิร์น
Chat — ChatResponseBuilder ที่ว่างเปล่า
new Chip()
new Chip List()
สร้าง Chip ใหม่
ใช้ได้กับแอป Google Chat ในรุ่นตัวอย่างสำหรับนักพัฒนาแอปของส่วนเสริม Google Workspace
const chip = CardService.newChip(); // Finish building the text chip... const chipList = CardService.newChipList() .setLayout(CardService.ChipListLayout.WRAPPED) .addChip(chip);
รีเทิร์น
Chip — ChipList ที่ว่างเปล่า
new Collapse Control()
สร้าง Collapse ใหม่
ใช้ได้กับแอป Google Chat ในรุ่นตัวอย่างสำหรับนักพัฒนาแอปของส่วนเสริม Google Workspace
const collapseControl = CardService.newCollapseControl() .setHorizontalAlign(CardService.HorizontalAlignment.START) .setExpandButton(CardService.newTextButton().setText('Expand')) .setCollapseButton(CardService.newTextButton().setText('Collapse'));
รีเทิร์น
Collapse — CollapseControl ที่ว่างเปล่า
new Column()
สร้าง Column ใหม่
พร้อมใช้งานสำหรับแอป Google Chat และส่วนเสริมของ Google Workspace
const columnWidget = CardService.newTextParagraph(); const column = CardService.newColumn() .setHorizontalSizeStyle( CardService.HorizontalSizeStyle.FILL_AVAILABLE_SPACE) .setHorizontalAlignment(CardService.HorizontalAlignment.CENTER) .setVerticalAlignment(CardService.VerticalAlignment.CENTER) .addWidget(columnWidget);
รีเทิร์น
Column - คอลัมน์ว่าง
new Columns()
สร้างชุด Columns ใหม่
พร้อมใช้งานสำหรับแอป Google Chat และส่วนเสริมของ Google Workspace
const firstColumn = CardService.newColumn() .setHorizontalSizeStyle( CardService.HorizontalSizeStyle.FILL_AVAILABLE_SPACE) .setHorizontalAlignment(CardService.HorizontalAlignment.CENTER) .setVerticalAlignment(CardService.VerticalAlignment.CENTER); const secondColumn = CardService.newColumn() .setHorizontalSizeStyle( CardService.HorizontalSizeStyle.FILL_AVAILABLE_SPACE) .setHorizontalAlignment(CardService.HorizontalAlignment.CENTER) .setVerticalAlignment(CardService.VerticalAlignment.CENTER); const columns = CardService.newColumns() .addColumn(firstColumn) .addColumn(secondColumn) .setWrapStyle(CardService.WrapStyle.WRAP);
รีเทิร์น
Columns — ชุดคอลัมน์ว่าง
new Common Widget Action()
new Compose Action Response Builder()
สร้าง Compose ใหม่
รีเทิร์น
Compose — ตัวสร้าง ComposeActionResponse ที่ว่างเปล่า
new Condition()
new Data Source Config()
new Date Picker()
new Date Time Picker()
new Decorated Text()
new Dialog()
สร้าง Dialog ใหม่
ใช้ได้กับแอป Google Chat เท่านั้น ไม่พร้อมใช้งานสำหรับส่วนเสริม Google Workspace
const card = CardService.newCardBuilder() .setHeader(CardService.newCardHeader().setTitle('Card title')) .build(); // Sets the card of the dialog. const dialog = CardService.newDialog().setBody(card);
รีเทิร์น
new Dialog Action()
สร้าง Dialog ใหม่
ใช้ได้กับแอป Google Chat เท่านั้น ไม่พร้อมใช้งานสำหรับส่วนเสริม Google Workspace
const card = CardService.newCardBuilder() .setHeader(CardService.newCardHeader().setTitle('Card title')) .build(); const dialog = CardService.newDialog().setBody(card); const dialogAction = CardService.newDialogAction().setDialog(dialog);
รีเทิร์น
Dialog — Dialog ว่างเปล่า
new Divider()
สร้าง Divider ใหม่ ตัวอย่างต่อไปนี้สร้างการ์ดอย่างง่ายที่มี 2 ย่อหน้า
คั่นด้วยเส้นแบ่ง
function buildCard() { const cardSection1TextParagraph1 = CardService.newTextParagraph().setText('Hello world!'); const cardSection1Divider1 = CardService.newDivider(); const cardSection1TextParagraph2 = CardService.newTextParagraph().setText('Hello world!'); const cardSection1 = CardService.newCardSection() .addWidget(cardSection1TextParagraph1) .addWidget(cardSection1Divider1) .addWidget(cardSection1TextParagraph2); const card = CardService.newCardBuilder().addSection(cardSection1).build(); return card; }
รีเทิร์น
Divider — ตัวแบ่ง
new Drive Data Source Spec()
new Drive Items Selected Action Response Builder()
สร้าง Drive ใหม่
รีเทิร์น
Drive — Drive ว่างเปล่า
new Editor File Scope Action Response Builder()
สร้าง Editor ใหม่
รีเทิร์น
Editor — Editor ว่างเปล่า
new Event Action()
สร้าง Event ใหม่ที่ใช้สำหรับการตรวจสอบฝั่งไคลเอ็นต์
รีเทิร์น
Event — Event ว่างเปล่า
new Expression Data()
สร้าง Expression ใหม่ที่ใช้สำหรับการตรวจสอบฝั่งไคลเอ็นต์
รีเทิร์น
Expression — Expression ว่างเปล่า
new Expression Data Action()
สร้าง Expression ใหม่ที่ใช้สำหรับการตรวจสอบฝั่งไคลเอ็นต์
รีเทิร์น
Expression — Expression ว่างเปล่า
new Expression Data Condition()
สร้าง Expression ใหม่ที่ใช้สำหรับการตรวจสอบฝั่งไคลเอ็นต์
รีเทิร์น
Expression — Expression ว่างเปล่า
new Host App Data Source()
new Image Button()
new Image Component()
new Image Crop Style()
new Link Preview()
สร้าง Link ใหม่
const decoratedText = CardService.newDecoratedText().setTopLabel('Hello').setText('Hi!'); const cardSection = CardService.newCardSection().addWidget(decoratedText); const card = CardService.newCardBuilder().addSection(cardSection).build(); const linkPreview = CardService.newLinkPreview().setPreviewCard(card).setTitle( 'Smart chip title');
รีเทิร์น
Link - LinkPreview ว่างเปล่า
new Material Icon()
สร้าง Material ใหม่
พร้อมใช้งานสำหรับแอป Google Chat และส่วนเสริมของ Google Workspace
const materialIcon = CardService.newMaterialIcon().setName('check_box').setFill(true); const cardSection = CardService.newCardSection(); cardSection.addWidget( CardService.newDecoratedText() .setStartIcon(CardService.newIconImage().setMaterialIcon(materialIcon)) .setText('sasha@example.com'), ); const card = CardService.newCardBuilder() .setHeader(CardService.newCardHeader().setTitle('Card Title')) .addSection(cardSection) .build();
รีเทิร์น
Material - MaterialIcon ที่ว่างเปล่า
new Notification()
new Overflow Menu()
สร้าง Overflow ใหม่
ใช้ได้กับแอป Google Chat ในรุ่นตัวอย่างสำหรับนักพัฒนาแอปของส่วนเสริม Google Workspace
const overflowMenuItem = CardService.newOverflowMenuItem(); // Finish building the overflow menu item... const overflowMenu = CardService.newOverflowMenu().addMenuItem(overflowMenuItem);
รีเทิร์น
Overflow — OverflowMenu ที่ว่างเปล่า
new Overflow Menu Item()
สร้าง Overflow ใหม่
ใช้ได้กับแอป Google Chat ในรุ่นตัวอย่างสำหรับนักพัฒนาแอปของส่วนเสริม Google Workspace
const overflowMenuItem = CardService.newOverflowMenuItem() .setStartIcon( CardService.newIconImage().setIconUrl( 'https://www.google.com/images/branding/googleg/1x/googleg_standard_color_64dp.png', ), ) .setText('Open Link') .setOpenLink( CardService.newOpenLink().setUrl('https://www.google.com'));
รีเทิร์น
Overflow — OverflowMenuItem ที่ว่างเปล่า
new Platform Data Source()
new Selection Input()
new Suggestions()
new Suggestions Response Builder()
สร้าง Suggestions ใหม่
รีเทิร์น
Suggestions — ตัวสร้าง SuggestionsResponse ที่ว่างเปล่า
new Text Button()
new Text Paragraph()
new Time Picker()
new Trigger()
new Universal Action Response Builder()
สร้าง Universal ใหม่
รีเทิร์น
Universal — เครื่องมือสร้าง UniversalActionResponse ที่ว่างเปล่า
new Update Draft Action Response Builder()
สร้าง Update ใหม่
รีเทิร์น
Update — ตัวสร้าง UpdateDraftActionResponse ที่ว่างเปล่า
new Update Draft Bcc Recipients Action()
สร้าง Update ใหม่
รีเทิร์น
Update - การดำเนินการ UpdateDraftBccRecipientsAction ที่ว่างเปล่า
new Update Draft Body Action()
สร้าง Update ใหม่
รีเทิร์น
Update - การดำเนินการ UpdateDraftBodyAction ที่ว่างเปล่า
new Update Draft Cc Recipients Action()
สร้าง Update ใหม่
รีเทิร์น
Update — An Empty UpdateDraftCcRecipientsAction.
new Update Draft Subject Action()
สร้าง Update ใหม่
รีเทิร์น
Update - UpdateDraftSubjectAction ที่ว่างเปล่า
new Update Draft To Recipients Action()
สร้าง Update ใหม่
รีเทิร์น
Update — การดำเนินการ UpdateDraftToRecipientsAction ที่ว่างเปล่า
new Update Visibility Action()
สร้าง Update ใหม่
รีเทิร์น
Update — Update ว่างเปล่า
new Validation()
สร้าง Validation ใหม่
พร้อมใช้งานสำหรับแอป Google Chat และส่วนเสริมของ Google Workspace
const validation = CardService.newValidation().setCharacterLimit(5).setInputType( CardService.InputType.EMAIL);
รีเทิร์น
Validation — การตรวจสอบที่ว่างเปล่า