Card
A continuación, se muestra un ejemplo de una tarjeta de complementos.
function createCard() { return CardService.newCardBuilder() .setHeader(CardService.newCardHeader().setTitle('CardTitle')) .build(); }
También puedes devolver varias tarjetas de la siguiente manera:
function createCards() { return [ CardService.newCardBuilder().build(), CardService.newCardBuilder().build(), CardService.newCardBuilder().build(), ]; }
A continuación, se muestra cómo podrías definir una tarjeta con un encabezado, texto, una imagen y un elemento de menú:
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(); }
Ejemplo de una tarjeta de Apps de 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();
Propiedades
| Propiedad | Tipo | Descripción | 
|---|---|---|
| Border | Border | Es la enumeración Border. | 
| Chip | Chip | Es la enumeración Chip. | 
| Composed | Composed | Es la enumeración Composed. | 
| Content | Content | Es la enumeración Content. | 
| Expression | Expression | Es la enumeración Expression. | 
| Expression | Expression | Es la enumeración Expression. | 
| Grid | Grid | Es la enumeración Grid. | 
| Horizontal | Horizontal | Es la enumeración Horizontal. | 
| Icon | Icon | Es la enumeración Icon. | 
| Image | Image | Es la enumeración Image. | 
| Image | Image | Es la enumeración Image. | 
| Image | Image | Es la enumeración Image. | 
| Input | Input | Es la enumeración Input. | 
| Load | Load | Es la enumeración Load. | 
| On | On | Es la enumeración On. | 
| Open | Open | Es la enumeración Open. | 
| Selection | Selection | Es la enumeración Selection. | 
| Text | Text | Es la enumeración Text. | 
| Update | Update | Es la enumeración Update. | 
| Visibility | Visibility | Es la enumeración Visibility. | 
| Workflow | Workflow | Es la enumeración Workflow. | 
Métodos
Documentación detallada
new
Cree una Action nueva
Volver
Action: Un compilador de ActionResponse vacío.
new
Cree una Action nueva
Solo está disponible para las apps de Google Chat. No está disponible para los complementos de Google Workspace.
const actionStatus = CardService.newActionStatus() .setStatusCode(CardService.Status.OK) .setUserFacingMessage('Success');
Volver
Action: Un ActionStatus vacío.
new
new
new
Cree una Authorization nueva
Volver
Authorization: Es un AuthorizationException vacío.
new
new
Cree una Calendar nueva
Volver
Calendar: Es un Calendar vacío.
new
new
new
new
new
Cree una Card nueva Se usa para enviar una tarjeta en un mensaje de Google Chat. El ID de tarjeta es un identificador único de una tarjeta en un mensaje cuando se envían varias tarjetas.
Solo está disponible para las apps de Google Chat. No está disponible para los complementos de 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);
Volver
Card: Es un Card vacío.
new
Crea un 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')))
Volver
Carousel: Es un carrusel vacío.
new
Cree una Carousel nueva
const carouselCard = CardService.newCarouselCard().addWidget( CardService.newTextParagraph().setText('Text paragraph in carousel'));
Volver
Carousel: Es un chip vacío.
new
Cree una Chat nueva
Solo está disponible para las apps de Google Chat. No está disponible para los complementos de 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);
Volver
Chat: Es un Chat vacío.
new
Cree una Chat nueva
Solo está disponible para las apps de Google Chat. No está disponible para los complementos de 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();
Volver
Chat: Es un ChatResponseBuilder vacío.
new
Cree una Chip nueva
Disponible para las apps de Google Chat. Está disponible en la versión preliminar para desarrolladores de los complementos de Google Workspace.
const chip = CardService.newChip() .setLabel('Open Link') .setOpenLink(CardService.newOpenLink().setUrl( 'https://www.google.com'));
Volver
Chip: Es un chip vacío.
new
Cree una Chip nueva
Disponible para las apps de Google Chat. Está disponible en la versión preliminar para desarrolladores de los complementos de Google Workspace.
const chip = CardService.newChip(); // Finish building the text chip... const chipList = CardService.newChipList() .setLayout(CardService.ChipListLayout.WRAPPED) .addChip(chip);
Volver
Chip: Es un ChipList vacío.
new
Cree una Collapse nueva
Disponible para las apps de Google Chat. Está disponible en la versión preliminar para desarrolladores de los complementos de Google Workspace.
const collapseControl = CardService.newCollapseControl() .setHorizontalAlign(CardService.HorizontalAlignment.START) .setExpandButton(CardService.newTextButton().setText('Expand')) .setCollapseButton(CardService.newTextButton().setText('Collapse'));
Volver
Collapse: Es un CollapseControl vacío.
new
Cree una Column nueva
Disponible para apps de Google Chat y complementos de 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);
Volver
Column: Es una columna vacía.
new
Crea un nuevo conjunto de Columns.
Disponible para apps de Google Chat y complementos de 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);
Volver
Columns: Es un conjunto vacío de columnas.
new
Cree una Compose nueva
Volver
Compose: Un compilador de ComposeActionResponse vacío.
new
new
new
new
Cree una Dialog nueva
Solo está disponible para las apps de Google Chat. No está disponible para los complementos de 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);
Volver
new
Cree una Dialog nueva
Solo está disponible para las apps de Google Chat. No está disponible para los complementos de 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);
Volver
Dialog: Es un Dialog vacío.
new
Cree una Divider nueva En el siguiente ejemplo, se compila una tarjeta simple con 2 párrafos separados por un divisor.
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; }
Volver
Divider: Es un divisor.
new
Cree una Drive nueva
Volver
Drive: Es un Drive vacío.
new
Cree una Editor nueva
Volver
Editor: Es un Editor vacío.
new
new
new
new
new
Cree una Link nueva
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');
Volver
Link: Es un objeto LinkPreview vacío.
new
Cree una Material nueva
Disponible para apps de Google Chat y complementos de 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();
Volver
Material: Un MaterialIcon vacío.
new
new
Cree una Overflow nueva
Disponible para las apps de Google Chat. Está disponible en la versión preliminar para desarrolladores de los complementos de Google Workspace.
const overflowMenuItem = CardService.newOverflowMenuItem(); // Finish building the overflow menu item... const overflowMenu = CardService.newOverflowMenu().addMenuItem(overflowMenuItem);
Volver
Overflow: Es un OverflowMenu vacío.
new
Cree una Overflow nueva
Disponible para las apps de Google Chat. Está disponible en la versión preliminar para desarrolladores de los complementos de 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'));
Volver
Overflow: Es un OverflowMenuItem vacío.
new
new
new
Cree una Suggestions nueva
Volver
Suggestions: Es un compilador de SuggestionsResponse vacío.
new
new
new
new
Cree una Universal nueva
Volver
Universal: Un compilador de UniversalActionResponse vacío.
new
Cree una Update nueva
Volver
Update: Es un UpdateDraftActionResponseBuilder vacío.
new
Crea un Update nuevo.
Volver
Update: Es un objeto UpdateDraftBccRecipientsAction vacío.
new
Cree una Update nueva
Volver
Update: Es un UpdateDraftBodyAction vacío.
new
Cree una Update nueva
Volver
Update: Es un Empty UpdateDraftCcRecipientsAction.
new
Cree una Update nueva
Volver
Update: Es un UpdateDraftSubjectAction vacío.
new
Cree una Update nueva
Volver
Update: Es un UpdateDraftToRecipientsAction vacío.
new
Cree una Validation nueva
Disponible para apps de Google Chat y complementos de Google Workspace
const validation = CardService.newValidation().setCharacterLimit(5).setInputType( CardService.InputType.EMAIL);
Volver
Validation: Es una validación vacía.