CardService 可讓您建立通用資訊卡,用於不同的 Google 可擴充性產品,例如 Google Workspace 外掛程式。
以下是加購項目資訊卡的範例。
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 Apps 資訊卡範例。
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();
屬性
屬性 | 類型 | 說明 |
---|---|---|
BorderType | BorderType | BorderType 列舉。 |
ChipListLayout | ChipListLayout | ChipListLayout 列舉。 |
ComposedEmailType | ComposedEmailType | ComposedEmailType 列舉。 |
ContentType | ContentType | ContentType 列舉。 |
GridItemLayout | GridItemLayout | GridItemLayout 列舉。 |
HorizontalAlignment | HorizontalAlignment | HorizontalAlignment 列舉。 |
Icon | Icon | Icon 列舉。 |
ImageButtonStyle | ImageButtonStyle | ImageButtonStyle 列舉。 |
ImageCropType | ImageCropType | ImageCropType 列舉。 |
ImageStyle | ImageStyle | ImageStyle 列舉。 |
InputType | InputType | InputType 列舉。 |
LoadIndicator | LoadIndicator | LoadIndicator 列舉。 |
OnClose | OnClose | OnClose 列舉。 |
OpenAs | OpenAs | OpenAs 列舉。 |
SelectionInputType | SelectionInputType | SelectionInputType 列舉。 |
TextButtonStyle | TextButtonStyle | TextButtonStyle 列舉。 |
UpdateDraftBodyType | UpdateDraftBodyType | UpdateDraftBodyType 列舉。 |
方法
內容詳盡的說明文件
newActionResponseBuilder()
newActionStatus()
建立新的 ActionStatus
。
僅適用於 Google Chat 應用程式。不適用於 Google Workspace 外掛程式。
const actionStatus = CardService.newActionStatus() .setStatusCode(CardService.Status.OK) .setUserFacingMessage('Success');
回攻員
ActionStatus
:空白的 ActionStatus。
newAttachment()
newAuthorizationAction()
newAuthorizationException()
newBorderStyle()
newCalendarEventActionResponseBuilder()
newCardAction()
newCardBuilder()
newCardHeader()
newCardSection()
newCardWithId()
建立新的 CardWithId
。這項屬性可用於在 Google Chat 訊息中傳送資訊卡。當您傳送多張資訊卡時,資訊卡 ID 是訊息中資訊卡的專屬 ID。
僅適用於 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);
回攻員
CardWithId
:空白 CardWithId
。
newChatActionResponse()
建立新的 ChatActionResponse
。
僅適用於 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);
回攻員
newChatResponseBuilder()
建立新的 ChatResponseBuilder
。
僅適用於 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();
回攻員
ChatResponseBuilder
- 空白的 ChatResponseBuilder。
newChip()
newChipList()
newCollapseControl()
建立新的 CollapseControl
。
僅適用於 Google Chat 應用程式。不適用於 Google Workspace 外掛程式。
const collapseControl = CardService.newCollapseControl() .setHorizontalAlign(CardService.HorizontalAlignment.START) .setExpandButton(CardService.newTextButton().setText('Expand')) .setCollapseButton(CardService.newTextButton().setText('Collapse'));
回攻員
CollapseControl
:空白的 CollapseControl。
newColumn()
建立新的 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
:空白資料欄。
newColumns()
建立新的 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(column) .addColumn(secondColumn) .setWrapStyle(CardService.WrapStyle.WRAP);
回攻員
Columns
:空白的資料欄組合。
newComposeActionResponseBuilder()
newDatePicker()
newDateTimePicker()
newDecoratedText()
newDialog()
newDialogAction()
建立新的 DialogAction
。
僅適用於 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);
回攻員
newDivider()
建立新的 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
:分隔符。
newDriveItemsSelectedActionResponseBuilder()
newEditorFileScopeActionResponseBuilder()
newImageButton()
newImageComponent()
newImageCropStyle()
newLinkPreview()
建立新的 LinkPreview
。
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');
回攻員
LinkPreview
:空白的 LinkPreview。
newMaterialIcon()
建立新的 MaterialIcon
。
適用於 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();
回攻員
MaterialIcon
- 空白的 MaterialIcon。
newNotification()
newOverflowMenu()
建立新的 OverflowMenu
。
僅適用於 Google Chat 應用程式。不適用於 Google Workspace 外掛程式。
const overflowMenuItem = CardService.newOverflowMenuItem(); // Finish building the overflow menu item... const overflowMenu = CardService.newOverflowMenu().addMenuItem(overflowMenuItem);
回攻員
OverflowMenu
:空白的 OverflowMenu。
newOverflowMenuItem()
建立新的 OverflowMenuItem
。
僅適用於 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'));
回攻員
OverflowMenuItem
:空白的 OverflowMenuItem。
newSelectionInput()
newSuggestions()
newSuggestionsResponseBuilder()
newTextButton()
newTextParagraph()
newTimePicker()
newUniversalActionResponseBuilder()
建立新的 UniversalActionResponseBuilder
。
回攻員
UniversalActionResponseBuilder
:空的 UniversalActionResponse 建構工具。
newUpdateDraftActionResponseBuilder()
建立新的 UpdateDraftActionResponseBuilder
。
回攻員
UpdateDraftActionResponseBuilder
:空白的 UpdateDraftActionResponseBuilder。
newUpdateDraftBccRecipientsAction()
建立新的 UpdateDraftBccRecipientsAction
;
回攻員
UpdateDraftBccRecipientsAction
- 空的 UpdateDraftBccRecipientsAction。
newUpdateDraftBodyAction()
newUpdateDraftCcRecipientsAction()
建立新的 UpdateDraftCcRecipientsAction
。
回攻員
UpdateDraftCcRecipientsAction
:空白的 UpdateDraftCcRecipientsAction。
newUpdateDraftSubjectAction()
newUpdateDraftToRecipientsAction()
建立新的 UpdateDraftToRecipientsAction
。
回攻員
UpdateDraftToRecipientsAction
:空白的 UpdateDraftToRecipientsAction。
newValidation()
建立新的 Validation
。
適用於 Google Chat 應用程式和 Google Workspace 外掛程式。
const validation = CardService.newValidation().setCharacterLimit(5).setInputType( CardService.InputType.EMAIL);
回攻員
Validation
:空白驗證。