Card
다음은 부가기능 카드의 샘플입니다.
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 앱 카드 샘플
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();
속성
속성 | 유형 | 설명 |
---|---|---|
Border | Border | Border 열거형 |
Chip | Chip | Chip 열거형 |
Composed | Composed | Composed 열거형 |
Content | Content | Content 열거형 |
Grid | Grid | Grid 열거형 |
Horizontal | Horizontal | Horizontal 열거형 |
Icon | Icon | Icon 열거형 |
Image | Image | Image 열거형 |
Image | Image | Image 열거형 |
Image | Image | Image 열거형 |
Input | Input | Input 열거형 |
Load | Load | Load 열거형 |
On | On | On 열거형 |
Open | Open | Open 열거형 |
Selection | Selection | Selection 열거형 |
Text | Text | Text 열거형 |
Update | Update | Update 열거형 |
메서드
자세한 문서
new Action Response Builder()
new Action Status()
새 Action
를 만듭니다.
Google Chat 앱에서만 사용할 수 있습니다. Google Workspace 부가기능에는 사용할 수 없습니다.
const actionStatus = CardService.newActionStatus() .setStatusCode(CardService.Status.OK) .setUserFacingMessage('Success');
리턴
Action
: 빈 ActionStatus입니다.
new Attachment()
new Authorization Action()
new Authorization Exception()
new Border Style()
new Calendar Event Action Response Builder()
new Card Action()
new Card Builder()
new Card Header()
new Card Section()
new Card With Id()
새 Card
를 만듭니다. Google Chat 메시지에서 카드를 전송하는 데 사용됩니다. 카드 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);
리턴
Card
: 빈 Card
입니다.
new Chat Action Response()
새 Chat
를 만듭니다.
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);
리턴
new Chat Response Builder()
새 Chat
를 만듭니다.
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();
리턴
Chat
: 빈 ChatResponseBuilder입니다.
new Chip()
new Chip List()
new Collapse Control()
새 Collapse
를 만듭니다.
Google Chat 앱에서 사용할 수 있습니다. Google Workspace 부가기능 개발자 프리뷰에서
const collapseControl = CardService.newCollapseControl() .setHorizontalAlign(CardService.HorizontalAlignment.START) .setExpandButton(CardService.newTextButton().setText('Expand')) .setCollapseButton(CardService.newTextButton().setText('Collapse'));
리턴
Collapse
: 빈 CollapseControl입니다.
new Column()
새 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
: 빈 열입니다.
new Columns()
새 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(firstColumn) .addColumn(secondColumn) .setWrapStyle(CardService.WrapStyle.WRAP);
리턴
Columns
: 빈 열 집합입니다.
new Compose Action Response Builder()
새 Compose
를 만듭니다.
리턴
Compose
: 빈 ComposeActionResponse 빌더입니다.
new Date Picker()
new Date Time Picker()
new Decorated Text()
new Dialog()
새 Dialog
를 만듭니다.
Google Chat 앱에서만 사용할 수 있습니다. 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);
리턴
new Dialog Action()
새 Dialog
를 만듭니다.
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);
리턴
Dialog
: 빈 Dialog
입니다.
new Divider()
새 Divider
를 만듭니다. 다음 샘플은 구분자로 구분된 두 개의 단락이 있는 간단한 카드를 빌드합니다.
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
: 구분자입니다.
new Drive Items Selected Action Response Builder()
new Editor File Scope Action Response Builder()
new Image Button()
new Image Component()
new Image Crop Style()
new Link Preview()
새 Link
를 만듭니다.
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');
리턴
Link
: 빈 LinkPreview입니다.
new Material Icon()
새 Material
를 만듭니다.
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();
리턴
Material
: 빈 MaterialIcon입니다.
new Notification()
new Overflow Menu()
새 Overflow
를 만듭니다.
Google Chat 앱에서 사용할 수 있습니다. Google Workspace 부가기능 개발자 프리뷰에서
const overflowMenuItem = CardService.newOverflowMenuItem(); // Finish building the overflow menu item... const overflowMenu = CardService.newOverflowMenu().addMenuItem(overflowMenuItem);
리턴
Overflow
: 빈 OverflowMenu입니다.
new Overflow Menu Item()
새 Overflow
를 만듭니다.
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'));
리턴
Overflow
: 빈 OverflowMenuItem입니다.
new Selection Input()
new Suggestions()
new Suggestions Response Builder()
new Text Button()
new Text Paragraph()
new Time Picker()
new Universal Action Response Builder()
새 Universal
를 만듭니다.
리턴
Universal
: 빈 UniversalActionResponse 빌더입니다.
new Update Draft Action Response Builder()
새 Update
를 만듭니다.
리턴
Update
: 빈 UpdateDraftActionResponseBuilder입니다.
new Update Draft Bcc Recipients Action()
새 Update
를 만듭니다.
리턴
Update
: 빈 UpdateDraftBccRecipientsAction입니다.
new Update Draft Body Action()
new Update Draft Cc Recipients Action()
새 Update
를 만듭니다.
리턴
Update
: 빈 UpdateDraftCcRecipientsAction입니다.
new Update Draft Subject Action()
new Update Draft To Recipients Action()
새 Update
를 만듭니다.
리턴
Update
: 빈 UpdateDraftToRecipientsAction입니다.
new Validation()
새 Validation
를 만듭니다.
Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.
const validation = CardService.newValidation().setCharacterLimit(5).setInputType( CardService.InputType.EMAIL);
리턴
Validation
: 빈 유효성 검사입니다.