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 Action Response Builder()
Cree una Action nueva
Volver
Action: Un compilador de ActionResponse vacío.
new Action Status()
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 Attachment()
new Authorization Action()
new Authorization Exception()
Cree una Authorization nueva
Volver
Authorization: Es un AuthorizationException vacío.
new Border Style()
new Calendar Event Action Response Builder()
Cree una Calendar nueva
Volver
Calendar: Es un Calendar vacío.
new Card Action()
new Card Builder()
new Card Header()
new Card Section()
new Card With Id()
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 Carousel()
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 Carousel Card()
Cree una Carousel nueva
const carouselCard = CardService.newCarouselCard().addWidget( CardService.newTextParagraph().setText('Text paragraph in carousel'));
Volver
Carousel: Es un chip vacío.
new Chat Action Response()
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 Chat Response Builder()
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 Chip()
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 Chip List()
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 Collapse Control()
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 Column()
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 Columns()
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 Compose Action Response Builder()
Cree una Compose nueva
Volver
Compose: Un compilador de ComposeActionResponse vacío.
new Date Picker()
new Date Time Picker()
new Decorated Text()
new Dialog()
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 Dialog Action()
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 Divider()
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 Drive Items Selected Action Response Builder()
Cree una Drive nueva
Volver
Drive: Es un Drive vacío.
new Editor File Scope Action Response Builder()
Cree una Editor nueva
Volver
Editor: Es un Editor vacío.
new Host App Data Source()
new Image Button()
new Image Component()
new Image Crop Style()
new Link Preview()
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 Material Icon()
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 Notification()
new Overflow Menu()
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 Overflow Menu Item()
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 Selection Input()
new Suggestions()
new Suggestions Response Builder()
Cree una Suggestions nueva
Volver
Suggestions: Es un compilador de SuggestionsResponse vacío.
new Text Button()
new Text Paragraph()
new Time Picker()
new Universal Action Response Builder()
Cree una Universal nueva
Volver
Universal: Un compilador de UniversalActionResponse vacío.
new Update Draft Action Response Builder()
Cree una Update nueva
Volver
Update: Es un UpdateDraftActionResponseBuilder vacío.
new Update Draft Bcc Recipients Action()
Crea un Update nuevo.
Volver
Update: Es un objeto UpdateDraftBccRecipientsAction vacío.
new Update Draft Body Action()
Cree una Update nueva
Volver
Update: Es un UpdateDraftBodyAction vacío.
new Update Draft Cc Recipients Action()
Cree una Update nueva
Volver
Update: Es un Empty UpdateDraftCcRecipientsAction.
new Update Draft Subject Action()
Cree una Update nueva
Volver
Update: Es un UpdateDraftSubjectAction vacío.
new Update Draft To Recipients Action()
Cree una Update nueva
Volver
Update: Es un UpdateDraftToRecipientsAction vacío.
new Validation()
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.