Mit CardService können Sie generische Karten erstellen, die in verschiedenen Google-Erweiterungsprodukten wie Google Workspace-Add-ons verwendet werden.
Unten sehen Sie ein Beispiel für eine Add-on-Karte.
function createCard() { return CardService.newCardBuilder() .setHeader(CardService.newCardHeader().setTitle('CardTitle')) .build(); }
Oder Sie können mehrere Karten so zurückgeben:
function createCards() { return [ CardService.newCardBuilder().build(), CardService.newCardBuilder().build(), CardService.newCardBuilder().build(), ]; }
Im Folgenden sehen Sie, wie Sie eine Karte mit einem Titel, Text, einem Bild und einem Menüelement definieren können:
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(); }
Beispiel für eine Chat-Apps-Karte.
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();
Properties
| Attribut | Typ | Beschreibung |
|---|---|---|
Border | Border | Die Aufzählung Border. |
Chip | Chip | Die Aufzählung Chip. |
Common | Common | Die Aufzählung Common. |
Composed | Composed | Die Aufzählung Composed. |
Content | Content | Die Aufzählung Content. |
Drive | Drive | Die Aufzählung Drive. |
Expression | Expression | Die Aufzählung Expression. |
Expression | Expression | Die Aufzählung Expression. |
Grid | Grid | Die Aufzählung Grid. |
Horizontal | Horizontal | Die Aufzählung Horizontal. |
Icon | Icon | Die Aufzählung Icon. |
Image | Image | Die Aufzählung Image. |
Image | Image | Die Aufzählung Image. |
Image | Image | Die Aufzählung Image. |
Input | Input | Die Aufzählung Input. |
Load | Load | Die Aufzählung Load. |
On | On | Die Aufzählung On. |
Open | Open | Die Aufzählung Open. |
Selection | Selection | Die Aufzählung Selection. |
Text | Text | Die Aufzählung Text. |
Text | Text | Die Aufzählung Text. |
Update | Update | Die Aufzählung Update. |
Variable | Variable | Die Aufzählung Variable. |
Visibility | Visibility | Die Aufzählung Visibility. |
Workflow | Workflow | Die Aufzählung Workflow. |
Methoden
Detaillierte Dokumentation
newActionResponseBuilder()
Erstellt einen neuen ActionResponseBuilder
Rückflug
ActionResponseBuilder – Ein leerer ActionResponse-Builder.
newActionStatus()
Erstellt einen neuen ActionStatus
Nur für Google Chat-Apps verfügbar. Nicht für Google Workspace-Add‑ons verfügbar.
const actionStatus = CardService.newActionStatus() .setStatusCode(CardService.Status.OK) .setUserFacingMessage('Success');
Rückflug
ActionStatus: Ein leerer ActionStatus.
newAttachment()
newAuthorizationAction()
Erstellt einen neuen AuthorizationAction
Rückflug
AuthorizationAction – Eine leere AuthorizationAction.
newAuthorizationException()
Erstellt einen neuen AuthorizationException
Rückflug
AuthorizationException – Eine leere AuthorizationException.
newBorderStyle()
newCalendarEventActionResponseBuilder()
Erstellt einen neuen CalendarEventActionResponseBuilder
Rückflug
CalendarEventActionResponseBuilder: Eine leere CalendarEventActionResponseBuilder.
newCardAction()
newCardBuilder()
newCardHeader()
newCardSection()
newCardWithId()
Erstellt einen neuen CardWithId Damit wird eine Karte in einer Google Chat-Nachricht gesendet. Die Karten-ID ist ein eindeutiger Bezeichner für eine Karte in einer Nachricht, wenn mehrere Karten gesendet werden.
Nur für Google Chat-Apps verfügbar. Nicht für Google Workspace-Add‑ons verfügbar.
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);
Rückflug
CardWithId: Eine leere CardWithId.
newCarousel()
Erstellt ein 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')))
Rückflug
Carousel – Ein leeres Karussell.
newCarouselCard()
Erstellt einen neuen CarouselCard
const carouselCard = CardService.newCarouselCard().addWidget( CardService.newTextParagraph().setText('Text paragraph in carousel'));
Rückflug
CarouselCard: Ein leerer Chip.
newChatActionResponse()
Erstellt einen neuen ChatActionResponse
Nur für Google Chat-Apps verfügbar. Nicht für Google Workspace-Add‑ons verfügbar.
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);
Rückflug
ChatActionResponse: Eine leere ChatActionResponse.
newChatResponseBuilder()
Erstellt einen neuen ChatResponseBuilder
Nur für Google Chat-Apps verfügbar. Nicht für Google Workspace-Add‑ons verfügbar.
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();
Rückflug
ChatResponseBuilder – Ein leerer ChatResponseBuilder.
newChip()
newChipList()
Erstellt einen neuen ChipList
Für Google Chat-Apps verfügbar. In der Entwicklervorschau für Google Workspace-Add‑ons.
const chip = CardService.newChip(); // Finish building the text chip... const chipList = CardService.newChipList() .setLayout(CardService.ChipListLayout.WRAPPED) .addChip(chip);
Rückflug
ChipList: Eine leere ChipList.
newCollapseControl()
Erstellt einen neuen CollapseControl
Für Google Chat-Apps verfügbar. In der Entwicklervorschau für Google Workspace-Add‑ons.
const collapseControl = CardService.newCollapseControl() .setHorizontalAlign(CardService.HorizontalAlignment.START) .setExpandButton(CardService.newTextButton().setText('Expand')) .setCollapseButton(CardService.newTextButton().setText('Collapse'));
Rückflug
CollapseControl – Ein leeres CollapseControl.
newColumn()
Erstellt einen neuen Column
Für Google Chat-Apps und Google Workspace-Add‑ons verfügbar.
const columnWidget = CardService.newTextParagraph(); const column = CardService.newColumn() .setHorizontalSizeStyle( CardService.HorizontalSizeStyle.FILL_AVAILABLE_SPACE) .setHorizontalAlignment(CardService.HorizontalAlignment.CENTER) .setVerticalAlignment(CardService.VerticalAlignment.CENTER) .addWidget(columnWidget);
Rückflug
Column: Eine leere Spalte.
newColumns()
Erstellt einen neuen Satz von Columns.
Für Google Chat-Apps und Google Workspace-Add‑ons verfügbar.
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);
Rückflug
Columns: Eine leere Menge von Spalten.
newCommonWidgetAction()
newComposeActionResponseBuilder()
Erstellt einen neuen ComposeActionResponseBuilder
Rückflug
ComposeActionResponseBuilder – Ein leerer ComposeActionResponse-Builder.
newCondition()
newDataSourceConfig()
newDatePicker()
newDateTimePicker()
newDecoratedText()
newDialog()
Erstellt einen neuen Dialog
Nur für Google Chat-Apps verfügbar. Nicht für Google Workspace-Add‑ons verfügbar.
const card = CardService.newCardBuilder() .setHeader(CardService.newCardHeader().setTitle('Card title')) .build(); // Sets the card of the dialog. const dialog = CardService.newDialog().setBody(card);
Rückflug
newDialogAction()
Erstellt einen neuen DialogAction
Nur für Google Chat-Apps verfügbar. Nicht für Google Workspace-Add‑ons verfügbar.
const card = CardService.newCardBuilder() .setHeader(CardService.newCardHeader().setTitle('Card title')) .build(); const dialog = CardService.newDialog().setBody(card); const dialogAction = CardService.newDialogAction().setDialog(dialog);
Rückflug
DialogAction: Eine leere DialogAction.
newDivider()
Erstellt einen neuen Divider Im folgenden Beispiel wird eine einfache Karte mit zwei Absätzen erstellt, die durch eine Trennlinie getrennt sind.
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; }
Rückflug
Divider: Eine Trennlinie.
newDriveDataSourceSpec()
Erstellt einen neuen DriveDataSourceSpec
Rückflug
DriveDataSourceSpec: Eine leere DriveDataSourceSpec.
newDriveItemsSelectedActionResponseBuilder()
Erstellt einen neuen DriveItemsSelectedActionResponseBuilder
Rückflug
DriveItemsSelectedActionResponseBuilder: Eine leere DriveItemsSelectedActionResponseBuilder.
newEditorFileScopeActionResponseBuilder()
Erstellt einen neuen EditorFileScopeActionResponseBuilder
Rückflug
EditorFileScopeActionResponseBuilder: Eine leere EditorFileScopeActionResponseBuilder.
newEventAction()
Erstellt ein neues EventAction für die clientseitige Validierung.
Rückflug
EventAction: Eine leere EventAction.
newExpressionData()
Erstellt ein neues ExpressionData für die clientseitige Validierung.
Rückflug
ExpressionData: Eine leere ExpressionData.
newExpressionDataAction()
Erstellt ein neues ExpressionDataAction für die clientseitige Validierung.
Rückflug
ExpressionDataAction: Eine leere ExpressionDataAction.
newExpressionDataCondition()
Erstellt ein neues ExpressionDataCondition für die clientseitige Validierung.
Rückflug
ExpressionDataCondition: Eine leere ExpressionDataCondition.
newHostAppDataSource()
newImageButton()
newImageComponent()
newImageCropStyle()
newLinkPreview()
Erstellt einen neuen LinkPreview
const decoratedText = CardService.newDecoratedText().setTopLabel('Hello').setText('Hi!'); const cardSection = CardService.newCardSection().addWidget(decoratedText); const card = CardService.newCardBuilder().addSection(cardSection).build(); return CardService.newLinkPreview().setPreviewCard(card).setTitle( 'Smart chip title');
Rückflug
LinkPreview: Eine leere LinkPreview.
newMaterialIcon()
Erstellt einen neuen MaterialIcon
Für Google Chat-Apps und Google Workspace-Add‑ons verfügbar.
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();
Rückflug
MaterialIcon: Ein leeres MaterialIcon.
newNotification()
newOverflowMenu()
Erstellt einen neuen OverflowMenu
Für Google Chat-Apps verfügbar. In der Entwicklervorschau für Google Workspace-Add‑ons.
const overflowMenuItem = CardService.newOverflowMenuItem(); // Finish building the overflow menu item... const overflowMenu = CardService.newOverflowMenu().addMenuItem(overflowMenuItem);
Rückflug
OverflowMenu: Ein leeres Dreipunkt-Menü.
newOverflowMenuItem()
Erstellt einen neuen OverflowMenuItem
Für Google Chat-Apps verfügbar. In der Entwicklervorschau für Google Workspace-Add‑ons.
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'));
Rückflug
OverflowMenuItem: Ein leeres OverflowMenuItem.
newPlatformDataSource()
newSelectionInput()
newSuggestions()
newSuggestionsResponseBuilder()
Erstellt einen neuen SuggestionsResponseBuilder
Rückflug
SuggestionsResponseBuilder – Ein leerer SuggestionsResponse-Builder.
newTextButton()
newTextParagraph()
newTimePicker()
newTrigger()
newUniversalActionResponseBuilder()
Erstellt einen neuen UniversalActionResponseBuilder
Rückflug
UniversalActionResponseBuilder – Ein leerer UniversalActionResponse-Builder.
newUpdateDraftActionResponseBuilder()
Erstellt einen neuen UpdateDraftActionResponseBuilder
Rückflug
UpdateDraftActionResponseBuilder – Ein leerer UpdateDraftActionResponseBuilder.
newUpdateDraftBccRecipientsAction()
Erstellt einen neuen UpdateDraftBccRecipientsAction.
Rückflug
UpdateDraftBccRecipientsAction: Eine leere UpdateDraftBccRecipientsAction.
newUpdateDraftBodyAction()
Erstellt einen neuen UpdateDraftBodyAction
Rückflug
UpdateDraftBodyAction – Eine leere UpdateDraftBodyAction.
newUpdateDraftCcRecipientsAction()
Erstellt einen neuen UpdateDraftCcRecipientsAction
Rückflug
UpdateDraftCcRecipientsAction – Eine leere UpdateDraftCcRecipientsAction.
newUpdateDraftSubjectAction()
Erstellt einen neuen UpdateDraftSubjectAction
Rückflug
UpdateDraftSubjectAction: Eine leere UpdateDraftSubjectAction.
newUpdateDraftToRecipientsAction()
Erstellt einen neuen UpdateDraftToRecipientsAction
Rückflug
UpdateDraftToRecipientsAction – Eine leere UpdateDraftToRecipientsAction.
newUpdateVisibilityAction()
Erstellt einen neuen UpdateVisibilityAction
Rückflug
UpdateVisibilityAction: Eine leere UpdateVisibilityAction.
newValidation()
Erstellt einen neuen Validation
Für Google Chat-Apps und Google Workspace-Add‑ons verfügbar.
const validation = CardService.newValidation().setCharacterLimit(5).setInputType( CardService.InputType.EMAIL);
Rückflug
Validation: Eine leere Validierung.