CardService provides the ability to create generic cards used across different Google extensibility products, such as Google Workspace Add-ons.
Below is a sample for an add-ons card.
return CardService.newCardBuilder() .setHeader(CardService.newCardHeader().setTitle("CardTitle")) .build();
Or you can return multiple Cards like so:
return [ CardService.newCardBuilder().build(), CardService.newCardBuilder().build(), CardService.newCardBuilder().build() ]
The following shows how you could define a card with a header, text, an image and a menu item:
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(); }
Sample for a Chat Apps card.
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("[email protected]")) .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
Property | Type | Description |
---|---|---|
BorderType | BorderType | The BorderType enumeration. |
ComposedEmailType | ComposedEmailType | The ComposedEmailType enumeration. |
ContentType | ContentType | The ContentType enumeration. |
GridItemLayout | GridItemLayout | The GridItemLayout enumeration. |
HorizontalAlignment | HorizontalAlignment | The HorizontalAlignment enumeration. |
Icon | Icon | The Icon enumeration. |
ImageCropType | ImageCropType | The ImageCropType enumeration. |
ImageStyle | ImageStyle | The ImageStyle enumeration. |
LoadIndicator | LoadIndicator | The LoadIndicator enumeration. |
OnClose | OnClose | The OnClose enumeration. |
OpenAs | OpenAs | The OpenAs enumeration. |
SelectionInputType | SelectionInputType | The SelectionInputType enumeration. |
TextButtonStyle | TextButtonStyle | The TextButtonStyle enumeration. |
UpdateDraftBodyType | UpdateDraftBodyType | The UpdateDraftBodyType enumeration. |
Methods
Detailed documentation
newActionResponseBuilder()
Creates a new ActionResponseBuilder
.
Return
ActionResponseBuilder
— An empty ActionResponse builder.
newActionStatus()
Creates a new ActionStatus
.
Only available for Google Chat apps. Not available for Google Workspace Add-ons.
const actionStatus = CardService.newActionStatus() .setStatusCode(CardService.Status.OK) .setUserFacingMessage('Success');
Return
ActionStatus
— An empty ActionStatus.
newAttachment()
newAuthorizationAction()
newAuthorizationException()
Creates a new AuthorizationException
.
Return
AuthorizationException
— An empty AuthorizationException.
newBorderStyle()
newCalendarEventActionResponseBuilder()
Creates a new CalendarEventActionResponseBuilder
.
Return
CalendarEventActionResponseBuilder
— An empty CalendarEventActionResponseBuilder
.
newCardAction()
newCardBuilder()
newCardHeader()
newCardSection()
newCardWithId()
Creates a new CardWithId
. This is used to send a card in a Google Chat message. card ID
is a unique identifier for a card in a message when sending multiple cards.
Only available for Google Chat apps. Not available for Google Workspace Add-ons.
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);
Return
CardWithId
— An empty CardWithId
.
newChatActionResponse()
Creates a new ChatActionResponse
.
Only available for Google Chat apps. Not available for Google Workspace Add-ons.
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);
Return
ChatActionResponse
— An empty ChatActionResponse
.
newChatResponseBuilder()
Creates a new ChatResponseBuilder
.
Only available for Google Chat apps. Not available for Google Workspace Add-ons.
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();
Return
ChatResponseBuilder
— An empty ChatResponseBuilder.
newColumn()
Creates a new Column
.
Available for Google Chat apps and Google Workspace Add-ons.
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
— An empty Column.
newColumns()
Creates a new set of Columns
.
Available for Google Chat apps and Google Workspace Add-ons.
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);
Return
Columns
— An empty set of Columns.
newComposeActionResponseBuilder()
Creates a new ComposeActionResponseBuilder
.
Return
ComposeActionResponseBuilder
— An empty ComposeActionResponse builder.
newDatePicker()
newDateTimePicker()
newDecoratedText()
newDialog()
Creates a new Dialog
.
Only available for Google Chat apps. Not available for Google Workspace Add-ons.
const card = CardService.newCardBuilder() .setHeader(CardService.newCardHeader().setTitle('Card title')).build(); // Sets the card of the dialog. const dialog = CardService.newDialog() .setBody(card);
Return
newDialogAction()
Creates a new DialogAction
.
Only available for Google Chat apps. Not available for Google Workspace Add-ons.
const card = CardService.newCardBuilder() .setHeader(CardService.newCardHeader().setTitle('Card title')).build(); const dialog = CardService.newDialog() .setBody(card); const dialogAction = CardService.newDialogAction() .setDialog(dialog)
Return
DialogAction
— An empty DialogAction
.
newDivider()
Creates a new Divider
. The following sample builds a simple card with 2 paragraphs
separated by a divider.
function buildCard() { let cardSection1TextParagraph1 = CardService.newTextParagraph() .setText('Hello world!'); let cardSection1Divider1 = CardService.newDivider(); let cardSection1TextParagraph2 = CardService.newTextParagraph() .setText('Hello world!'); let cardSection1 = CardService.newCardSection() .addWidget(cardSection1TextParagraph1) .addWidget(cardSection1Divider1) .addWidget(cardSection1TextParagraph2); let card = CardService.newCardBuilder() .addSection(cardSection1) .build(); return card; }
Return
Divider
— A divider.
newDriveItemsSelectedActionResponseBuilder()
Creates a new DriveItemsSelectedActionResponseBuilder
.
Return
DriveItemsSelectedActionResponseBuilder
— An empty DriveItemsSelectedActionResponseBuilder
.
newEditorFileScopeActionResponseBuilder()
Creates a new EditorFileScopeActionResponseBuilder
.
Return
EditorFileScopeActionResponseBuilder
— An empty EditorFileScopeActionResponseBuilder
.
newImageButton()
newImageComponent()
newImageCropStyle()
newLinkPreview()
Creates a new 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');
Return
LinkPreview
— An empty LinkPreview.
newNotification()
newSelectionInput()
newSuggestions()
newSuggestionsResponseBuilder()
Creates a new SuggestionsResponseBuilder
.
Return
SuggestionsResponseBuilder
— An empty SuggestionsResponse builder.
newTextButton()
newTextParagraph()
newTimePicker()
newUniversalActionResponseBuilder()
Creates a new UniversalActionResponseBuilder
.
Return
UniversalActionResponseBuilder
— An empty UniversalActionResponse builder.
newUpdateDraftActionResponseBuilder()
Creates a new UpdateDraftActionResponseBuilder
.
Return
UpdateDraftActionResponseBuilder
— An empty UpdateDraftActionResponseBuilder.
newUpdateDraftBccRecipientsAction()
Creates a new UpdateDraftBccRecipientsAction
;
Return
UpdateDraftBccRecipientsAction
— An empty UpdateDraftBccRecipientsAction.
newUpdateDraftBodyAction()
newUpdateDraftCcRecipientsAction()
Creates a new UpdateDraftCcRecipientsAction
.
Return
UpdateDraftCcRecipientsAction
— An Empty UpdateDraftCcRecipientsAction.
newUpdateDraftSubjectAction()
Creates a new UpdateDraftSubjectAction
.
Return
UpdateDraftSubjectAction
— An empty UpdateDraftSubjectAction.
newUpdateDraftToRecipientsAction()
Creates a new UpdateDraftToRecipientsAction
.
Return
UpdateDraftToRecipientsAction
— An empty UpdateDraftToRecipientsAction.
newValidation()
Creates a new Validation
.
Available for Google Chat apps and Google Workspace Add-ons.
const validation = CardService.newValidation() .setCharacterLimit(5) .setInputType(CardService.InputType.EMAIL);
Return
Validation
— An empty validation.