Cards v2

카드

Google Chat 메시지 또는 Google Workspace 부가기능에 표시되는 카드 인터페이스입니다.

카드는 정의된 레이아웃, 버튼과 같은 대화형 UI 요소, 리치 미디어(예: 이미지)를 지원합니다. 카드를 사용하여 자세한 정보를 표시하고, 사용자로부터 정보를 수집하고, 사용자가 다음 단계로 나아가도록 안내하세요.

카드 빌더로 카드를 디자인하고 미리 봅니다.

카드 빌더 열기

카드를 만드는 방법을 알아보려면 다음 문서를 참고하세요.

• Google Chat 앱의 경우 다음을 참고하세요. 카드 또는 대화상자의 구성요소 디자인
• Google Workspace 부가기능은 다음을 참고하세요. 카드 기반 인터페이스.

예: Google Chat 앱의 카드 메시지

Google Chat에서 샘플 카드 메시지를 만들려면 다음 JSON을 사용합니다.

{
  "cardsV2": [
    {
      "cardId": "unique-card-id",
      "card": {
        "header": {
           "title": "Sasha",
           "subtitle": "Software Engineer",
           "imageUrl":
           "https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png",
           "imageType": "CIRCLE",
           "imageAltText": "Avatar for Sasha"
         },
         "sections": [
           {
             "header": "Contact Info",
             "collapsible": true,
             "uncollapsibleWidgetsCount": 1,
             "widgets": [
               {
                 "decoratedText": {
                   "startIcon": {
                     "knownIcon": "EMAIL"
                   },
                   "text": "[e-mail]"
                 }
               },
               {
                 "decoratedText": {
                   "startIcon": {
                     "knownIcon": "PERSON"
                   },
                   "text": "<font color=\"#80e27e\">Online</font>"
                 }
               },
               {
                 "decoratedText": {
                   "startIcon": {
                     "knownIcon": "PHONE"
                   },
                   "text": "[phone]"
                 }
               },
               {
                 "buttonList": {
                   "buttons": [
                     {
                       "text": "Share",
                       "onClick": {
                        "openLink": {
                           "url": "https://example.com/share"
                         }
                       }
                     },
                     {
                       "text": "Edit",
                       "onClick": {
                         "action": {
                           "function": "goToView",
                           "parameters": [
                             {
                               "key": "viewType",
                               "value": "EDIT"
                             }
                           ]
                         }
                       }
                     }
                   ]
                 }
               }
             ]
           }
         ]
       }
    }
  ]
}

JSON 표현
{ "header": { object (CardHeader) }, "sections": [ { object (Section) } ], "sectionDividerStyle": enum (DividerStyle), "cardActions": [ { object (CardAction) } ], "name": string, "fixedFooter": { object (CardFixedFooter) }, "displayStyle": enum (DisplayStyle), "peekCardHeader": { object (CardHeader) } }

필드
header	object (CardHeader) 카드의 헤더입니다. 헤더에는 일반적으로 선행 이미지와 제목이 포함됩니다. 헤더는 항상 카드 상단에 표시됩니다.
sections[]	object (Section) 위젯 컬렉션을 포함합니다. 각 섹션에는 자체적인 선택적 헤더가 있습니다. 섹션은 선 구분선으로 시각적으로 구분됩니다. Google Chat 앱의 예는 다음을 참고하세요. 카드의 섹션을 정의합니다.
sectionDividerStyle	enum (DividerStyle) 섹션 사이의 구분선 스타일입니다.
cardActions[]	object (CardAction) 카드 작업 작업의 툴바 메뉴에 카드가 추가됩니다. Google Workspace 부가기능에서는 사용할 수 있지만 Google Chat 앱에서는 사용할 수 없습니다. 예를 들어 다음 JSON은 Settings 및 Send Feedback 옵션: "cardActions": [ { "actionLabel": "Settings", "onClick": { "action": { "functionName": "goToView", "parameters": [ { "key": "viewType", "value": "SETTING" } ], "loadIndicator": "LoadIndicator.SPINNER" } } }, { "actionLabel": "Send Feedback", "onClick": { "openLink": { "url": "https://example.com/feedback" } } } ]
name	string 카드 이름입니다. 카드 탐색에서 카드 식별자로 사용됩니다. Google Workspace 부가기능에서는 사용할 수 있지만 Google Chat 앱에서는 사용할 수 없습니다.
fixedFooter	object (CardFixedFooter) 이 카드 하단에 표시된 고정 바닥글입니다. 설정 fixedFooter 포드의 상태를 primaryButton 또는 <ph type="x-smartling-placeholder">secondaryButton</ph> 오류가 발생합니다. Chat 앱의 경우 대화상자로 대체될 수 있지만 카드 메시지. Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.
displayStyle	enum (DisplayStyle) Google Workspace 부가기능에서 peekCardHeader Google Workspace 부가기능에서는 사용할 수 있지만 Google Chat 앱에서는 사용할 수 없습니다.
peekCardHeader	object (CardHeader) 문맥 콘텐츠를 표시할 때 미리보기 카드 헤더는 사용자가 홈페이지 카드와 문맥 카드 사이를 앞으로 이동할 수 있도록 자리표시자 역할을 합니다. Google Workspace 부가기능에서는 사용할 수 있지만 Google Chat 앱에서는 사용할 수 없습니다.

CardHeader

카드 헤더를 나타냅니다. Google Chat 앱의 예는 다음을 참고하세요. 헤더를 추가합니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "title": string, "subtitle": string, "imageType": enum (ImageType), "imageUrl": string, "imageAltText": string }

필드
title	string 필수 항목입니다. 카드 헤더의 제목입니다. 헤더의 높이가 고정되어 있습니다. 제목과 부제목이 모두 지정된 경우에는 각각 한 줄을 차지합니다. 제목만 지정된 경우 두 줄을 모두 차지합니다.
subtitle	string 카드 헤더의 부제목입니다. 지정하면 title
imageType	enum (ImageType) 이미지를 자르는 데 사용되는 도형입니다. Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.
imageUrl	string 카드 헤더에 있는 이미지의 HTTPS URL입니다.
imageAltText	string 접근성을 위해 사용되는 이 이미지의 대체 텍스트입니다.

ImageType

이미지를 자르는 데 사용되는 도형입니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

열거형
SQUARE	기본값 이미지에 정사각형 마스크를 적용합니다. 예를 들어 4x3 이미지는 3x3이 됩니다.
CIRCLE	이미지에 원형 마스크를 적용합니다. 예를 들어 4x3 이미지는 지름이 3인 원이 됩니다.

섹션

섹션에는 지정된 순서대로 수직으로 렌더링되는 위젯 모음이 포함됩니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "header": string, "widgets": [ { object (Widget) } ], "collapsible": boolean, "uncollapsibleWidgetsCount": integer }

필드
header	string 섹션 상단에 표시되는 텍스트입니다. 간단한 HTML 형식의 텍스트를 지원합니다. 텍스트 서식 지정에 대한 자세한 내용은 다음을 참고하세요. Google Chat 앱의 텍스트 서식 지정 및 Google Workspace 부가기능의 텍스트 서식 지정
widgets[]	object (Widget) 섹션의 모든 위젯입니다. 위젯을 하나 이상 포함해야 합니다.
collapsible	boolean 이 섹션을 접을 수 있는지 여부를 나타냅니다. 접을 수 있는 섹션에서는 일부 또는 모든 위젯이 숨겨지지만, 사용자는 섹션을 확장하여 숨겨진 위젯을 클릭하여 표시할 수 있습니다. 더보기 사용자는 간략히 보기 숨겨지는 위젯을 결정하려면 uncollapsibleWidgetsCount
uncollapsibleWidgetsCount	integer 섹션이 접혀 있어도 접을 수 없는 위젯이 계속 표시되는 위젯의 수입니다. 예를 들어 섹션에 다섯 개의 위젯이 있고 uncollapsibleWidgetsCount 가 2: 처음 두 위젯이 항상 표시되고 마지막 세 개 위젯은 기본적으로 접혀 있습니다. 이 uncollapsibleWidgetsCount 광고 항목의 게재 시점에 collapsible 은 true입니다.

위젯

각 카드는 위젯으로 구성되어 있습니다.

위젯은 텍스트, 이미지, 버튼 및 기타 객체 유형 중 하나를 나타낼 수 있는 복합 객체입니다.

JSON 표현

{ "horizontalAlignment": enum (HorizontalAlignment), // Union field data can be only one of the following: "textParagraph": { object (TextParagraph) }, "image": { object (Image) }, "decoratedText": { object (DecoratedText) }, "buttonList": { object (ButtonList) }, "textInput": { object (TextInput) }, "selectionInput": { object (SelectionInput) }, "dateTimePicker": { object (DateTimePicker) }, "divider": { object (Divider) }, "grid": { object (Grid) }, "columns": { object (Columns) } // End of list of possible types for union field data. }

필드
horizontalAlignment	enum (HorizontalAlignment) 위젯을 열의 왼쪽, 오른쪽 또는 가운데에 정렬할지 지정합니다.
공용체 필드 data 위젯에는 다음 항목 중 하나만 포함될 수 있습니다. 여러 위젯 필드를 사용하여 더 많은 항목을 표시할 수 있습니다. data 다음 중 하나여야 합니다.
textParagraph	object (TextParagraph) 텍스트 단락을 표시합니다. 간단한 HTML 형식의 텍스트를 지원합니다. 텍스트 서식 지정에 대한 자세한 내용은 다음을 참고하세요. Google Chat 앱의 텍스트 서식 지정 및 Google Workspace 부가기능의 텍스트 서식 지정 예를 들어 다음 JSON은 굵은 텍스트를 만듭니다. "textParagraph": { "text": " <b>bold text</b>" }
image	object (Image) 이미지를 표시합니다. 예를 들어 다음 JSON은 대체 텍스트가 있는 이미지를 만듭니다. "image": { "imageUrl": "https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png", "altText": "Chat app avatar" }
decoratedText	object (DecoratedText) 장식된 텍스트 항목을 표시합니다. 예를 들어 다음 JSON은 이메일 주소를 표시하는 데코레이트된 텍스트 위젯을 만듭니다. "decoratedText": { "icon": { "knownIcon": "EMAIL" }, "topLabel": "Email Address", "text": "[e-mail]", "bottomLabel": "This is a new Email address!", "switchControl": { "name": "has_send_welcome_email_to_sasha", "selected": false, "controlType": "CHECKBOX" } }
buttonList	object (ButtonList) 버튼 목록입니다. 예를 들어 다음 JSON은 버튼 두 개를 만듭니다. 첫 번째는 파란색 텍스트 버튼이고 두 번째는 링크를 여는 이미지 버튼입니다. "buttonList": { "buttons": [ { "text": "Edit", "color": { "red": 0, "green": 0, "blue": 1, "alpha": 1 }, "disabled": true, }, { "icon": { "knownIcon": "INVITE", "altText": "check calendar" }, "onClick": { "openLink": { "url": "https://example.com/calendar" } } } ] }
textInput	object (TextInput) 사용자가 입력할 수 있는 텍스트 상자를 표시합니다. 예를 들어 다음 JSON은 이메일 주소에 대한 텍스트 입력을 만듭니다. "textInput": { "name": "mailing_address", "label": "Mailing Address" } 또 다른 예로, 다음 JSON은 정적 제안을 사용하여 프로그래밍 언어에 대한 텍스트 입력을 만듭니다. "textInput": { "name": "preferred_programing_language", "label": "Preferred Language", "initialSuggestions": { "items": [ { "text": "C++" }, { "text": "Java" }, { "text": "JavaScript" }, { "text": "Python" } ] } }
selectionInput	object (SelectionInput) 사용자가 항목을 선택할 수 있는 선택 컨트롤을 표시합니다. 선택 컨트롤은 체크박스, 라디오 버튼, 스위치, 드롭다운 메뉴가 될 수 있습니다. 예를 들어 다음 JSON은 사용자가 크기를 선택할 수 있는 드롭다운 메뉴를 만듭니다. "selectionInput": { "name": "size", "label": "Size" "type": "DROPDOWN", "items": [ { "text": "S", "value": "small", "selected": false }, { "text": "M", "value": "medium", "selected": true }, { "text": "L", "value": "large", "selected": false }, { "text": "XL", "value": "extra_large", "selected": false } ] }
dateTimePicker	object (DateTimePicker) 사용자가 날짜, 시간 또는 날짜 및 시간을 입력할 수 있는 위젯을 표시합니다. 예를 들어 다음 JSON은 약속을 예약하는 날짜 시간 선택 도구를 생성합니다. "dateTimePicker": { "name": "appointment_time", "label": "Book your appointment at:", "type": "DATE_AND_TIME", "valueMsEpoch": "796435200000" }
divider	object (Divider) 위젯 사이에 가로줄 구분선을 표시합니다. 예를 들어 다음 JSON은 구분선을 만듭니다. "divider": { }
grid	object (Grid) 항목 컬렉션이 있는 그리드를 표시합니다. 그리드는 원하는 수의 열과 항목을 지원합니다. 행 수는 항목 수의 상한값을 열 수로 나눈 값으로 결정됩니다. 항목이 10개이고 열이 2개인 그리드에는 5개의 행이 있습니다. 항목이 11개이고 열이 2개인 그리드에는 6개의 행이 있습니다. Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다. 예를 들어 다음 JSON은 단일 항목이 있는 2열 그리드를 만듭니다. "grid": { "title": "A fine collection of items", "columnCount": 2, "borderStyle": { "type": "STROKE", "cornerRadius": 4 }, "items": [ { "image": { "imageUri": "https://www.example.com/image.png", "cropStyle": { "type": "SQUARE" }, "borderStyle": { "type": "STROKE" } }, "title": "An item", "textAlignment": "CENTER" } ], "onClick": { "openLink": { "url": "https://www.example.com" } } }
columns	object (Columns) 최대 2개의 열을 표시합니다. 열을 3개 이상 포함하거나 행을 사용하려면 Grid 위젯에 추가합니다. 예를 들어 다음 JSON은 각각 텍스트 단락을 포함하는 2개의 열을 만듭니다. "columns": { "columnItems": [ { "horizontalSizeStyle": "FILL_AVAILABLE_SPACE", "horizontalAlignment": "CENTER", "verticalAlignment": "CENTER", "widgets": [ { "textParagraph": { "text": "First column text paragraph" } } ] }, { "horizontalSizeStyle": "FILL_AVAILABLE_SPACE", "horizontalAlignment": "CENTER", "verticalAlignment": "CENTER", "widgets": [ { "textParagraph": { "text": "Second column text paragraph" } } ] } ] }

TextParagraph

서식을 지원하는 텍스트 단락입니다. Google Chat 앱의 예는 다음을 참고하세요. 서식이 지정된 텍스트 단락을 추가합니다. 텍스트 서식 지정에 대한 자세한 내용은 다음을 참고하세요. Google Chat 앱의 텍스트 서식 지정 및 Google Workspace 부가기능의 텍스트 서식 지정

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "text": string }

필드
text	string 위젯에 표시되는 텍스트입니다.

이미지

URL로 지정되며 onClick 있습니다. 예를 보려면 다음을 참조하세요. 이미지 추가

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "imageUrl": string, "onClick": { object (OnClick) }, "altText": string }

필드
imageUrl	string 이미지를 호스팅하는 HTTPS URL입니다. 예를 들면 다음과 같습니다. https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png
onClick	object (OnClick) 사용자가 이미지를 클릭하면 클릭 시 이 액션이 트리거됩니다.
altText	string 접근성을 위해 사용되는 이 이미지의 대체 텍스트입니다.

OnClick

사용자가 카드에서 대화형 요소(예: 버튼)를 클릭할 때 응답하는 방법을 나타냅니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ // Union field data can be only one of the following: "action": { object (Action) }, "openLink": { object (OpenLink) }, "openDynamicLinkAction": { object (Action) }, "card": { object (Card) } // End of list of possible types for union field data. }

필드
공용체 필드 data data 다음 중 하나여야 합니다.
action	object (Action) 지정하면 onClick
openLink	object (OpenLink) 지정하면 onClick 링크 열기 작업을 트리거합니다.
openDynamicLinkAction	object (Action) 작업에서 링크를 열어야 하는 경우 부가기능에서 이 작업을 트리거합니다. 이는 앞서 말씀드린 openLink 서버와 통신하여 링크를 얻어야 한다는 것입니다. 따라서 열린 링크 작업 응답이 돌아오기 전에 웹 클라이언트가 준비 작업을 수행해야 합니다. Google Workspace 부가기능에서는 사용할 수 있지만 Google Chat 앱에서는 사용할 수 없습니다.
card	object (Card) 지정된 경우 클릭하면 새 카드가 카드 스택으로 푸시됩니다. Google Workspace 부가기능에서는 사용할 수 있지만 Google Chat 앱에서는 사용할 수 없습니다.

작업

양식이 제출될 때의 동작을 설명하는 작업입니다. 예를 들어 Apps Script 스크립트를 호출하여 양식을 처리할 수 있습니다. 작업이 트리거되면 양식 값이 서버로 전송됩니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "function": string, "parameters": [ { object (ActionParameter) } ], "loadIndicator": enum (LoadIndicator), "persistValues": boolean, "interaction": enum (Interaction), "requiredWidgets": [ string ], "allWidgetsAreRequired": boolean }

필드
function	string 포함하는 요소를 클릭하거나 다른 방식으로 활성화할 때 호출할 맞춤 함수입니다. 사용 예는 다음을 참조하세요. 양식 데이터 읽기.
parameters[]	object (ActionParameter) 작업 매개변수 목록입니다.
loadIndicator	enum (LoadIndicator) 작업을 호출하는 동안 표시되는 로드 표시기를 지정합니다.
persistValues	boolean 작업 후에도 양식 값이 유지되는지 여부를 나타냅니다. 기본값은 false 만약 true: 작업이 트리거된 후에도 양식 값이 유지됩니다. 작업이 처리되는 동안 사용자가 변경할 수 있도록 하려면 LoadIndicator 드림 ~ NONE입니다. 대상 카드 메시지 채팅 앱의 경우 작업의 ResponseType ~ UPDATE_MESSAGE 같은 cardId 삭제됩니다. 만약 false: 작업이 트리거되면 양식 값이 지워집니다. 작업이 처리되는 동안 사용자가 변경하지 못하게 하려면 LoadIndicator 드림 ~ SPINNER입니다.
interaction	enum (Interaction) 선택사항입니다. 앱을 열 때 필요합니다. 대화상자를 만듭니다. 사용자와의 상호작용(예: 사용자가 카드 메시지의 버튼을 클릭하는 경우)에 대한 응답으로 수행할 작업입니다. 지정하지 않으면 앱은 action 링크를 열거나 함수를 실행하는 등의 작업을 평소와 같이 수행할 수 있습니다. interaction를 사용하면 앱이 특별한 대화형 방식으로 응답할 수 있습니다. 예를 들어 interaction ~ OPEN_DIALOG 앱을 사용하면 대화상자. 지정하면 로드 표시기가 표시되지 않습니다. 부가기능에 지정된 경우 전체 카드가 제거되고 클라이언트에 아무 것도 표시되지 않습니다. Google Chat 앱에서는 사용할 수 있지만 Google Workspace 부가기능에서는 사용할 수 없습니다.
requiredWidgets[]	string 개발자 프리뷰: 이 기능은 Google Workspace 개발자 프리뷰 프로그램: 특정 기능의 사전 체험판을 이용할 수 있습니다. 를 통해 개인정보처리방침을 정의할 수 있습니다. 선택사항입니다. 이 목록을 유효한 제출에 필요한 위젯 이름으로 채우세요. 이 작업이 호출될 때 여기에 나열된 위젯에 값이 없으면 양식 제출이 취소됩니다. Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.
allWidgetsAreRequired	boolean 개발자 프리뷰: 이 기능은 Google Workspace 개발자 프리뷰 프로그램: 특정 기능의 사전 체험판을 이용할 수 있습니다. 를 통해 개인정보처리방침을 정의할 수 있습니다. 선택사항입니다. true이면 이 작업에서 모든 위젯이 필요한 것으로 간주됩니다. Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

ActionParameter

작업 메서드가 호출될 때 제공할 문자열 매개변수의 목록입니다. 예를 들어 지금 다시 알림, 오늘 다시 알림, 다음 주에 다시 알림, 이렇게 세 가지 다시 알림 버튼을 생각해 보세요. 다음과 같은 방법을 사용할 수 있습니다. action method = snooze(): 문자열 매개변수 목록에 일시중지 유형 및 일시중지 시간을 전달합니다.

자세한 내용은 CommonEventObject

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "key": string, "value": string }

필드
key	string 작업 스크립트의 매개변수 이름입니다.
value	string 매개변수의 값입니다.

LoadIndicator

작업을 호출하는 동안 표시되는 로드 표시기를 지정합니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

열거형
SPINNER	콘텐츠가 로드 중임을 나타내기 위해 스피너를 표시합니다.
NONE	아무것도 표시되지 않습니다.

상호작용

선택사항입니다. 앱을 열 때 필요합니다. 대화상자를 만듭니다.

사용자와의 상호작용(예: 사용자가 카드 메시지의 버튼을 클릭하는 경우)에 대한 응답으로 수행할 작업입니다.

지정하지 않으면 앱은 action 링크를 열거나 함수를 실행하는 등의 작업을 평소와 같이 수행할 수 있습니다.

interaction를 사용하면 앱이 특별한 대화형 방식으로 응답할 수 있습니다. 예를 들어 interaction ~ OPEN_DIALOG 앱을 사용하면 대화상자.

지정하면 로드 표시기가 표시되지 않습니다. 부가기능에 지정된 경우 전체 카드가 제거되고 클라이언트에 아무 것도 표시되지 않습니다.

Google Chat 앱에서는 사용할 수 있지만 Google Workspace 부가기능에서는 사용할 수 없습니다.

열거형
INTERACTION_UNSPECIFIED	기본값 이 action 자동으로 실행됩니다
OPEN_DIALOG	열기 대화상자 - 채팅 앱에서 사용자와 상호작용하는 데 사용하는 창 형식의 카드 기반 인터페이스입니다. 채팅 앱에서 카드 메시지의 버튼 클릭에 대한 응답으로만 지원됩니다. 부가기능에 지정된 경우 전체 카드가 제거되고 클라이언트에 아무 것도 표시되지 않습니다. Google Chat 앱에서는 사용할 수 있지만 Google Workspace 부가기능에서는 사용할 수 없습니다.

OpenLink

onClick 이벤트를 발생시킵니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "url": string, "openAs": enum (OpenAs), "onClose": enum (OnClose) }

필드
url	string 열려는 URL입니다.
openAs	enum (OpenAs) 링크를 여는 방법 Google Workspace 부가기능에서는 사용할 수 있지만 Google Chat 앱에서는 사용할 수 없습니다.
onClose	enum (OnClose) 클라이언트가 링크를 연 후에 잊어버리거나 창이 닫힐 때까지 링크를 관찰하는지 여부입니다. Google Workspace 부가기능에서는 사용할 수 있지만 Google Chat 앱에서는 사용할 수 없습니다.

OpenAs

사용자가 OnClick 작업에서 링크를 열면 클라이언트는 전체 크기 창 (클라이언트가 사용하는 프레임인 경우) 또는 오버레이 (예: 팝업)로 열 수 있습니다. 구현은 클라이언트 플랫폼 기능에 따라 다르며 클라이언트가 지원하지 않는 경우 선택한 값이 무시될 수 있습니다. FULL_SIZE 모든 클라이언트에서 지원됩니다

Google Workspace 부가기능에서는 사용할 수 있지만 Google Chat 앱에서는 사용할 수 없습니다.

열거형
FULL_SIZE	링크가 원본 크기 창으로 열립니다 (클라이언트가 사용하는 프레임인 경우).
OVERLAY	링크가 팝업과 같은 오버레이로 열립니다.

OnClose

링크를 열 때 클라이언트가 수행하는 작업 OnClick 종료됩니다

구현은 클라이언트 플랫폼 기능에 따라 다릅니다. 예를 들어 웹 브라우저는 팝업 창에서 OnClose 처리됩니다.

두 가지 모두 OnOpen 및 OnClose 핸들러가 설정되어 있고 클라이언트 플랫폼은 두 값을 모두 지원할 수 없으므로 OnClose 우선 적용됩니다

Google Workspace 부가기능에서는 사용할 수 있지만 Google Chat 앱에서는 사용할 수 없습니다.

열거형
NOTHING	기본값 카드가 새로고침되지 않습니다. 아무 일도 일어나지 않습니다.
RELOAD	하위 창이 닫힌 후 카드를 새로고침합니다. 다음과 함께 사용하는 경우: OpenAs.OVERLAY: 하위 창이 모달 대화상자 역할을 하며 하위 창이 닫힐 때까지 상위 카드가 차단됩니다.

DecoratedText

텍스트 위 또는 아래의 라벨, 텍스트 앞에 있는 아이콘, 선택 위젯 또는 텍스트 뒤의 버튼과 같은 선택적 장식이 있는 텍스트를 표시하는 위젯입니다. Google Chat 앱의 예는 다음을 참고하세요. 장식한 텍스트로 텍스트를 표시합니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "icon": { object (Icon) }, "startIcon": { object (Icon) }, "topLabel": string, "text": string, "wrapText": boolean, "bottomLabel": string, "onClick": { object (OnClick) }, // Union field control can be only one of the following: "button": { object (Button) }, "switchControl": { object (SwitchControl) }, "endIcon": { object (Icon) } // End of list of possible types for union field control. }

필드
icon (deprecated)	object (Icon) 이 항목은 지원 중단되었습니다. 지원 중단되어 다음 제품으로 대체됨: startIcon
startIcon	object (Icon) 텍스트 앞에 표시되는 아이콘입니다.
topLabel	string 위에 표시되는 텍스트 text 항상 자릅니다.
text	string 필수 항목입니다. 기본 텍스트입니다. 간단한 형식을 지원합니다. 텍스트 서식 지정에 대한 자세한 내용은 다음을 참고하세요. Google Chat 앱의 텍스트 서식 지정 및 Google Workspace 부가기능의 텍스트 서식 지정
wrapText	boolean 텍스트 줄바꿈 설정입니다. 만약 true: 텍스트가 줄바꿈되어 여러 줄에 표시됩니다. 그렇지 않으면 텍스트가 잘립니다. 적용 대상 text, 제외 topLabel 및 bottomLabel입니다.
bottomLabel	string 아래에 표시되는 텍스트 text 항상 래핑
onClick	object (OnClick) 이 액션은 사용자가 광고를 클릭하면 topLabel 또는 bottomLabel입니다.
공용체 필드 control 광고의 텍스트 오른쪽에 표시되는 버튼, 스위치, 체크박스 또는 이미지 decoratedText 위젯에 추가합니다. control 다음 중 하나여야 합니다.
button	object (Button) 사용자가 클릭하여 작업을 트리거할 수 있는 버튼입니다.
switchControl	object (SwitchControl) 사용자가 클릭하여 상태를 변경하고 작업을 트리거할 수 있는 스위치 위젯입니다.
endIcon	object (Icon) 텍스트 뒤에 표시되는 아이콘입니다. 지원 내장 및 맞춤 있습니다.

아이콘

카드의 위젯에 표시되는 아이콘입니다. Google Chat 앱의 예는 다음을 참고하세요. 아이콘을 추가합니다.

지원 내장 및 맞춤 있습니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "altText": string, "imageType": enum (ImageType), // Union field icons can be only one of the following: "knownIcon": string, "iconUrl": string, "materialIcon": { object (MaterialIcon) } // End of list of possible types for union field icons. }

필드
altText	string 선택사항입니다. 접근성에 사용되는 아이콘에 관한 설명입니다. 지정하지 않으면 기본값이 Button 제공됩니다 아이콘의 표시 내용과 해당하는 경우 아이콘의 기능에 대한 유용한 설명을 설정하는 것이 좋습니다. 예를 들어 A user's account portrait 또는 Opens a new browser tab and navigates to the Google Chat developer documentation at https://developers.google.com/workspace/chat입니다. 아이콘이 Button, altText 사용자가 버튼에 마우스를 가져가면 도움말 텍스트로 표시됩니다. 그러나 버튼도 text, 아이콘의 altText 무시됩니다.
imageType	enum (ImageType) 이미지에 적용된 자르기 스타일입니다. 경우에 따라 CIRCLE 자르기 를 사용하면 이미지가 기본 제공 아이콘보다 크게 그려집니다.
공용체 필드 icons 카드의 위젯에 표시되는 아이콘입니다. icons 다음 중 하나여야 합니다.
knownIcon	string Google Workspace에서 제공하는 기본 제공 아이콘 중 하나를 표시합니다. 예를 들어 비행기 아이콘을 표시하려면 AIRPLANE 버스의 경우 BUS 지원되는 아이콘의 전체 목록은 다음을 참조하세요. 내장된 아이콘을 사용할 수 있습니다.
iconUrl	string HTTPS URL에서 호스팅되는 맞춤 아이콘을 표시합니다. 예를 들면 다음과 같습니다. "iconUrl": "https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png" 지원되는 파일 형식은 다음과 같습니다. .png 및 .jpg입니다.
materialIcon	object (MaterialIcon) 다음 중 하나를 표시합니다. Google 머티리얼 아이콘. 예를 들어 체크박스 아이콘을 사용하려면 "materialIcon": { "name": "check_box" } Google Chat 앱에서는 사용할 수 있지만 Google Workspace 부가기능에서는 사용할 수 없습니다.

MaterialIcon

가 Google 머티리얼 아이콘: 2, 500개 이상의 옵션을 포함합니다.

예를 들어 체크박스 아이콘 다음과 같이 입력합니다.

{
  "name": "check_box",
  "fill": true,
  "weight": 300,
  "grade": -25
}

Google Chat 앱에서는 사용할 수 있지만 Google Workspace 부가기능에서는 사용할 수 없습니다.

JSON 표현
{ "name": string, "fill": boolean, "weight": integer, "grade": integer }

필드
name	string Google 머티리얼 아이콘(예: check_box입니다. 잘못된 이름은 폐기되고 빈 문자열로 대체되어 아이콘이 렌더링되지 않습니다.
fill	boolean 아이콘이 채워진 상태로 렌더링되는지 여부입니다. 기본값은 false입니다. 다른 아이콘 설정을 미리 보려면 다음으로 이동하세요. Google 글꼴 아이콘 그런 다음 맞춤설정.
weight	integer 아이콘의 획 두께입니다. {100, 200, 300, 400, 500, 600, 700} 중에서 선택합니다. 없는 경우 기본값은 400입니다. 다른 값을 지정하면 기본값이 사용됩니다. 다른 아이콘 설정을 미리 보려면 다음으로 이동하세요. Google 글꼴 아이콘 그런 다음 맞춤설정.
grade	integer 가중치와 등급은 기호의 두께에 영향을 미칩니다. 등급 조정은 가중치 조정보다 더 세부적이며 기호 크기에 약간의 영향을 미칩니다. {-25, 0, 200} 중에서 선택합니다. 없는 경우 기본값은 0입니다. 다른 값을 지정하면 기본값이 사용됩니다. 다른 아이콘 설정을 미리 보려면 다음으로 이동하세요. Google 글꼴 아이콘 그런 다음 맞춤설정.

버튼

사용자가 클릭할 수 있는 텍스트, 아이콘 또는 텍스트 및 아이콘 버튼 Google Chat 앱의 예는 다음을 참고하세요. 버튼 추가

이미지를 클릭 가능한 버튼으로 만들려면 Image ( ImageComponent)하고 <ph type="x-smartling-placeholder">onClick</ph> 있습니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "text": string, "icon": { object (Icon) }, "color": { object (Color) }, "onClick": { object (OnClick) }, "disabled": boolean, "altText": string }

필드
text	string 버튼 내부에 표시되는 텍스트입니다.
icon	object (Icon) 아이콘 이미지입니다. 두 가지 모두 icon 및 text 가 설정되면 아이콘이 텍스트 앞에 표시됩니다.
color	object (Color) 설정하면 버튼이 단색 배경 색상으로 채워지고 글꼴 색상이 배경 색상과의 대비를 유지하도록 변경됩니다. 예를 들어 파란색 배경을 설정하면 흰색 텍스트가 표시될 수 있습니다. 설정하지 않으면 이미지 배경이 흰색이고 글꼴 색상은 파란색이 됩니다. 빨간색, 녹색, 파란색의 경우 각 필드의 값은 float 0과 255 사이의 숫자를 255로 나눈 값 (153/255) 또는 0과 1 사이의 값 (0.6) 중 하나로 표현할 수 있는 숫자입니다. 0은 색상이 없음을 나타내고 1 또는 255/255는 RGB 스케일에서 해당 색상이 완전히 존재함을 나타냅니다. 선택적으로 설정 alpha는 다음 방정식을 사용하여 투명도 수준을 설정합니다. pixel color = alpha * (this color) + (1.0 - alpha) * (background color) 대상 alpha, 값 1 은 단색에 해당하며 <ph type="x-smartling-placeholder">0</ph> 완전히 투명한 색상에 해당합니다. 예를 들어, 다음 색상은 반투명 빨간색을 나타냅니다. "color": { "red": 1, "green": 0, "blue": 0, "alpha": 0.5 }
onClick	object (OnClick) 필수 항목입니다. 사용자가 버튼을 클릭할 때 하이퍼링크를 열거나 맞춤 함수를 실행하는 등 실행할 작업입니다.
disabled	boolean 만약 true: 버튼이 비활성 상태로 표시되고 사용자 작업에 응답하지 않습니다.
altText	string 접근성을 위해 사용되는 대체 텍스트입니다. 사용자가 버튼의 기능을 알 수 있도록 설명 텍스트를 설정합니다. 예를 들어 버튼을 눌러 하이퍼링크가 열리는 경우 다음과 같이 작성할 수 있습니다. '새 브라우저 탭을 열고 Google Chat 개발자 문서로 이동합니다. https://developers.google.com/workspace/chat&quot;.

색상

RGBA 색상 공간의 색상을 나타냅니다. 이 표현은 간결성을 통해 다양한 언어에서 색상 표현과 색상 표현 간에 간단히 변환할 수 있도록 설계되었습니다. 예를 들어, 이 표현의 필드는 java.awt.Color Java에서 UIColor의 +colorWithRed:green:blue:alpha 메서드를 사용합니다. 그리고 약간의 작업만 더 하면 CSS로 쉽게 형식을 지정할 수 있습니다 <ph type="x-smartling-placeholder">rgba()</ph> 문자열로 설정해야 합니다.

이 참조 페이지에는 RGB 값(예: sRGB, Adobe RGB, DCI-P3, BT.2020)을 해석하는 데 사용해야 하는 절대 색공간에 대한 정보가 없습니다. 기본적으로 애플리케이션은 sRGB 색공간을 가정해야 합니다.

색상 동등성을 결정해야 하는 경우 달리 문서화되지 않는 한 구현은 두 색상을 동일하게 취급합니다. 모든 빨간색, 녹색, 파란색, 알파 값이 각각 최대 1e-5

예시(자바):

 import com.google.type.Color;

 // ...
 public static java.awt.Color fromProto(Color protocolor) {
   float alpha = protocolor.hasAlpha()
       ? protocolor.getAlpha().getValue()
       : 1.0;

   return new java.awt.Color(
       protocolor.getRed(),
       protocolor.getGreen(),
       protocolor.getBlue(),
       alpha);
 }

 public static Color toProto(java.awt.Color color) {
   float red = (float) color.getRed();
   float green = (float) color.getGreen();
   float blue = (float) color.getBlue();
   float denominator = 255.0;
   Color.Builder resultBuilder =
       Color
           .newBuilder()
           .setRed(red / denominator)
           .setGreen(green / denominator)
           .setBlue(blue / denominator);
   int alpha = color.getAlpha();
   if (alpha != 255) {
     result.setAlpha(
         FloatValue
             .newBuilder()
             .setValue(((float) alpha) / denominator)
             .build());
   }
   return resultBuilder.build();
 }
 // ...

예시(iOS / obj-C):

 // ...
 static UIColor* fromProto(Color* protocolor) {
    float red = [protocolor red];
    float green = [protocolor green];
    float blue = [protocolor blue];
    FloatValue* alpha_wrapper = [protocolor alpha];
    float alpha = 1.0;
    if (alpha_wrapper != nil) {
      alpha = [alpha_wrapper value];
    }
    return [UIColor colorWithRed:red green:green blue:blue alpha:alpha];
 }

 static Color* toProto(UIColor* color) {
     CGFloat red, green, blue, alpha;
     if (![color getRed:&red green:&green blue:&blue alpha:&alpha]) {
       return nil;
     }
     Color* result = [[Color alloc] init];
     [result setRed:red];
     [result setGreen:green];
     [result setBlue:blue];
     if (alpha <= 0.9999) {
       [result setAlpha:floatWrapperWithValue(alpha)];
     }
     [result autorelease];
     return result;
}
// ...

예시(자바스크립트):

// ...

var protoToCssColor = function(rgb_color) {
   var redFrac = rgb_color.red || 0.0;
   var greenFrac = rgb_color.green || 0.0;
   var blueFrac = rgb_color.blue || 0.0;
   var red = Math.floor(redFrac * 255);
   var green = Math.floor(greenFrac * 255);
   var blue = Math.floor(blueFrac * 255);

   if (!('alpha' in rgb_color)) {
      return rgbToCssColor(red, green, blue);
   }

   var alphaFrac = rgb_color.alpha.value || 0.0;
   var rgbParams = [red, green, blue].join(',');
   return ['rgba(', rgbParams, ',', alphaFrac, ')'].join('');
};

var rgbToCssColor = function(red, green, blue) {
  var rgbNumber = new Number((red << 16) | (green << 8) | blue);
  var hexString = rgbNumber.toString(16);
  var missingZeros = 6 - hexString.length;
  var resultBuilder = ['#'];
  for (var i = 0; i < missingZeros; i++) {
     resultBuilder.push('0');
  }
  resultBuilder.push(hexString);
  return resultBuilder.join('');
};

// ...

JSON 표현
{ "red": number, "green": number, "blue": number, "alpha": number }

필드
red	number [0, 1] 간격의 값으로 표시되는 색상의 빨간색 양입니다.
green	number [0, 1] 간격의 값으로 표시되는 색상의 녹색 양입니다.
blue	number [0, 1] 간격의 값으로 표시되는 색상의 파란색 양입니다.
alpha	number 픽셀에 적용해야 하는 이 색상의 비율입니다. 즉, 최종 픽셀 색상은 등식으로 정의됩니다. pixel color = alpha * (this color) + (1.0 - alpha) * (background color) 즉, 1.0 값은 단색에 해당하는 반면 0.0 값은 완전히 투명한 색상에 해당합니다. 이 옵션은 단순한 부동 소수점 스칼라 대신 래퍼 메시지를 사용하므로 기본값과 설정되지 않은 값을 구분할 수 있습니다. 생략하면 이 색상 객체가 단색으로 렌더링됩니다 (알파 값에 1.0 값이 명시적으로 지정된 것처럼).

SwitchControl

전환 스위치 스타일 스위치 또는 decoratedText 위젯에 추가합니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

만 지원됨 decoratedText 위젯에 추가합니다.

JSON 표현
{ "name": string, "value": string, "selected": boolean, "onChangeAction": { object (Action) }, "controlType": enum (ControlType) }

필드
name	string 양식 입력 이벤트에서 스위치 위젯이 식별되는 이름입니다. 양식 입력 작업에 관한 자세한 내용은 다음을 참고하세요. 양식 데이터를 수신합니다.
value	string 사용자가 입력한 값으로, 양식 입력 이벤트의 일부로 반환됩니다. 양식 입력 작업에 관한 자세한 내용은 다음을 참고하세요. 양식 데이터를 수신합니다.
selected	boolean 날짜 true, 스위치가 선택되었습니다.
onChangeAction	object (Action) 전환 상태가 변경될 때 실행할 작업입니다(예: 실행할 함수).
controlType	enum (ControlType) 사용자 인터페이스에 스위치가 표시되는 방식입니다. Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

ControlType

사용자 인터페이스에 스위치가 표시되는 방식입니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

열거형
SWITCH	전환 스타일 스위치입니다.
CHECKBOX	지원 중단되어 다음 제품으로 대체됨: CHECK_BOX
CHECK_BOX	체크박스

ButtonList

가로로 배치된 버튼 목록 Google Chat 앱의 예는 다음을 참고하세요. 버튼 추가

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "buttons": [ { object (Button) } ] }

필드
buttons[]	object (Button) 버튼의 배열입니다.

TextInput

사용자가 텍스트를 입력할 수 있는 필드입니다. 추천 및 변경 시 작업을 지원합니다. Google Chat 앱의 예는 다음을 참고하세요. 사용자가 텍스트를 입력할 수 있는 필드 추가

채팅 앱은 양식 입력 이벤트 중에 입력된 텍스트 값을 수신하고 처리할 수 있습니다. 양식 입력 작업에 관한 자세한 내용은 다음을 참고하세요. 양식 데이터를 수신합니다.

사용자에게서 정의되지 않았거나 추상화된 데이터를 수집해야 하는 경우 텍스트 입력을 사용하세요. 사용자로부터 정의되거나 열거된 데이터를 수집하려면 SelectionInput 위젯에 추가합니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "name": string, "label": string, "hintText": string, "value": string, "type": enum (Type), "onChangeAction": { object (Action) }, "initialSuggestions": { object (Suggestions) }, "autoCompleteAction": { object (Action) }, "validation": { object (Validation) }, "placeholderText": string }

필드
name	string 양식 입력 이벤트에서 텍스트 입력이 식별되는 이름입니다. 양식 입력 작업에 관한 자세한 내용은 다음을 참고하세요. 양식 데이터를 수신합니다.
label	string 사용자 인터페이스의 텍스트 입력란 위에 표시되는 텍스트입니다. 사용자가 앱에 필요한 정보를 입력하는 데 도움이 되는 텍스트를 지정합니다. 예를 들어 누군가의 이름을 묻지만 구체적으로 성이 필요한 경우 다음과 같이 작성합니다. surname 를 name입니다. 필요한 경우 hintText 지정되지 않았습니다. 그 외의 경우에는 선택사항입니다.
hintText	string 사용자에게 특정 값을 입력하라는 메시지를 표시하여 사용자를 지원하기 위한 텍스트 입력란 아래에 표시되는 텍스트입니다. 이 텍스트는 항상 표시됩니다. 필요한 경우 label 지정되지 않았습니다. 그 외의 경우에는 선택사항입니다.
value	string 사용자가 입력한 값으로, 양식 입력 이벤트의 일부로 반환됩니다. 양식 입력 작업에 관한 자세한 내용은 다음을 참고하세요. 양식 데이터를 수신합니다.
type	enum (Type) 사용자 인터페이스에 텍스트 입력란이 표시되는 방식입니다. 예를 들어 필드가 한 줄인지 여러 줄인지를 나타냅니다.
onChangeAction	object (Action) 텍스트 입력란이 변경되었을 때 수행할 작업입니다. 예를 들어 사용자가 입력란에 추가하거나 텍스트를 삭제하는 경우가 있습니다. 수행할 작업의 예로는 커스텀 함수를 실행하거나 대화상자 할 수 있습니다.
initialSuggestions	object (Suggestions) 사용자가 입력할 수 있는 추천 값입니다. 이 값은 사용자가 텍스트 입력란 안을 클릭하면 표시됩니다. 사용자가 입력하면 추천 값이 동적으로 필터링되어 사용자가 입력한 값과 일치합니다. 예를 들어 프로그래밍 언어의 텍스트 입력 필드는 Java, JavaScript, Python, C++를 제안할 수 있습니다. 사용자가 입력을 시작할 때 Jav: Java 및 JavaScript입니다. 추천 값은 사용자가 앱에서 이해할 수 있는 값을 입력하도록 안내하는 데 도움이 됩니다. 자바스크립트를 언급할 때 일부 사용자는 javascript 외 다수 java script입니다. 제안 JavaScript 사용자가 앱과 상호작용하는 방식을 표준화할 수 있습니다. 지정하면 TextInput.type 항상 SINGLE_LINE( MULTIPLE_LINE입니다. Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.
autoCompleteAction	object (Action) 선택사항입니다. 텍스트 입력란이 상호작용하는 사용자에게 제안을 제공할 때 수행할 작업을 지정합니다. 지정하지 않으면 다음에서 추천을 설정합니다. initialSuggestions 클라이언트가 처리합니다 지정하면 앱은 여기에 지정된 작업(예: 맞춤 함수 실행)을 실행합니다. Google Workspace 부가기능에서는 사용할 수 있지만 Google Chat 앱에서는 사용할 수 없습니다.
validation	object (Validation) 개발자 프리뷰: 이 기능은 Google Workspace 개발자 프리뷰 프로그램: 특정 기능의 사전 체험판을 이용할 수 있습니다. 를 통해 개인정보처리방침을 정의할 수 있습니다. 이 텍스트 입력란에 필요한 확인을 지정합니다. Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.
placeholderText	string 필드가 비어 있을 때 텍스트 입력란에 표시되는 텍스트입니다. 이 텍스트를 사용하여 사용자에게 값을 입력하라는 메시지를 표시합니다. 예: Enter a number from 0 to 100. Google Chat 앱에서는 사용할 수 있지만 Google Workspace 부가기능에서는 사용할 수 없습니다.

유형

사용자 인터페이스에 텍스트 입력란이 표시되는 방식입니다. 예를 들어 한 줄 입력 필드인지 여러 줄 입력인지 여부입니다. 만약 initialSuggestions 지정하면 type 항상 SINGLE_LINE( MULTIPLE_LINE입니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

열거형
SINGLE_LINE	텍스트 입력란의 높이는 한 줄로 고정되어 있습니다.
MULTIPLE_LINE	텍스트 입력란의 높이는 여러 줄로 고정되어 있습니다.

RenderActions

카드에 작업을 실행하도록 지시하는 렌더링 명령의 집합입니다. 부가기능 호스트 앱 또는 채팅 앱에 특정 앱 작업을 실행하도록 지시합니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

필드
action	Action

작업

필드
navigations[]	Navigation 표시된 카드를 푸시하거나 업데이트합니다.

탐색

스택에 새 카드를 추가합니다 (앞으로 이동). 채팅 앱의 경우 앱 홈에서만 사용할 수 있습니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

navigations: {
  pushCard: CARD
}

맨 위의 카드를 새 카드로 교체합니다. 채팅 앱의 경우 앱 홈에서만 사용할 수 있습니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

navigations: {
  updateCard: CARD
}

필드
통합 필드 navigate_action. navigate_action는 다음 중 하나여야 합니다.
pushCard	Card 카드 스택은 카드를 카드 스택으로 푸시합니다.
updateCard	Card 카드 스택은 상단 카드를 새 카드로 업데이트하고 채워진 양식 필드 값을 유지합니다. 같지 않은 필드의 경우 값이 삭제됩니다.

추천

사용자가 입력할 수 있는 추천 값입니다. 이 값은 사용자가 텍스트 입력란 안을 클릭하면 표시됩니다. 사용자가 입력하면 추천 값이 동적으로 필터링되어 사용자가 입력한 값과 일치합니다.

예를 들어 프로그래밍 언어의 텍스트 입력 필드는 Java, JavaScript, Python, C++를 제안할 수 있습니다. 사용자가 입력을 시작할 때 Jav: 표시할 추천 필터의 목록입니다. Java 및 JavaScript입니다.

추천 값은 사용자가 앱에서 이해할 수 있는 값을 입력하도록 안내하는 데 도움이 됩니다. 자바스크립트를 언급할 때 일부 사용자는 javascript 외 다수 java script입니다. 제안 JavaScript 사용자가 앱과 상호작용하는 방식을 표준화할 수 있습니다.

지정하면 TextInput.type 항상 SINGLE_LINE( MULTIPLE_LINE입니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "items": [ { object (SuggestionItem) } ] }

필드
items[]	object (SuggestionItem) 텍스트 입력란에서 자동 완성 추천에 사용되는 추천 목록입니다.

SuggestionItem

사용자가 텍스트 입력란에 입력할 수 있는 추천 값입니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ // Union field content can be only one of the following: "text": string // End of list of possible types for union field content. }

필드
공용체 필드 content content 다음 중 하나여야 합니다.
text	string 텍스트 입력란에 대한 추천 입력 값입니다. 사용자가 직접 입력하는 값과 동일합니다.

유효성 검사

개발자 프리뷰: 이 기능은 Google Workspace 개발자 프리뷰 프로그램: 특정 기능의 사전 체험판을 이용할 수 있습니다.

를 통해 개인정보처리방침을 정의할 수 있습니다. 연결된 위젯의 유효성을 검사하는 데 필요한 데이터를 나타냅니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "characterLimit": integer, "inputType": enum (InputType) }

필드
characterLimit	integer 개발자 프리뷰: 이 기능은 Google Workspace 개발자 프리뷰 프로그램: 특정 기능의 사전 체험판을 이용할 수 있습니다. 를 통해 개인정보처리방침을 정의할 수 있습니다. 텍스트 입력 위젯의 글자 수 제한을 지정합니다. 이는 텍스트 입력에만 사용되며 다른 위젯에서는 무시됩니다. Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.
inputType	enum (InputType) 개발자 프리뷰: 이 기능은 Google Workspace 개발자 프리뷰 프로그램: 특정 기능의 사전 체험판을 이용할 수 있습니다. 를 통해 개인정보처리방침을 정의할 수 있습니다. 입력 위젯의 유형을 지정합니다. Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

InputType

입력 위젯의 유형입니다.

열거형
INPUT_TYPE_UNSPECIFIED	알 수 없는 유형. 사용하지 마세요.
TEXT	모든 문자를 허용하는 일반 텍스트입니다.
INTEGER	정수 값입니다.
FLOAT	부동 소수점 수 값입니다.
EMAIL	이메일 주소.
EMOJI_PICKER	시스템에서 제공하는 그림 이모티콘 선택 도구에서 선택한 그림 이모티콘입니다.

SelectionInput

사용자가 선택할 수 있는 하나 이상의 UI 항목을 생성하는 위젯입니다. 예를 들어 드롭다운 메뉴나 체크박스를 선택할 수 있습니다. 이 위젯을 사용하여 예측하거나 열거할 수 있는 데이터를 수집할 수 있습니다. Google Chat 앱의 예는 다음을 참고하세요. 선택 가능한 UI 요소를 추가합니다.

채팅 앱은 사용자가 선택하거나 입력하는 항목의 값을 처리할 수 있습니다. 양식 입력 작업에 관한 자세한 내용은 다음을 참고하세요. 양식 데이터를 수신합니다.

사용자로부터 정의되지 않았거나 추상적인 데이터를 수집하려면 TextInput 위젯에 추가합니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현

{ "name": string, "label": string, "type": enum (SelectionType), "items": [ { object (SelectionItem) } ], "onChangeAction": { object (Action) }, "multiSelectMaxSelectedItems": integer, "multiSelectMinQueryLength": integer, "validation": { object (Validation) }, // Union field multi_select_data_source can be only one of the following: "externalDataSource": { object (Action) }, "platformDataSource": { object (PlatformDataSource) } // End of list of possible types for union field multi_select_data_source. }

필드
name	string 필수 항목입니다. 양식 입력 이벤트에서 선택 입력을 식별하는 이름입니다. 양식 입력 작업에 관한 자세한 내용은 다음을 참고하세요. 양식 데이터를 수신합니다.
label	string 사용자 인터페이스에서 선택 입력란 위에 표시되는 텍스트입니다. 사용자가 앱에 필요한 정보를 입력하는 데 도움이 되는 텍스트를 지정합니다. 예를 들어 사용자가 드롭다운 메뉴에서 업무 티켓의 긴급도를 선택하는 경우 라벨은 '긴급'일 수 있습니다. 또는 '긴급도 선택'을 선택합니다.
type	enum (SelectionType) 카테고리 내에서 사용자에게 표시되는 항목의 유형은 SelectionInput 위젯에 추가합니다. 선택 유형은 다양한 유형의 상호작용을 지원합니다. 예를 들어 사용자는 하나 이상의 체크박스를 선택할 수 있지만 드롭다운 메뉴에서 하나의 값만 선택할 수 있습니다.
items[]	object (SelectionItem) 선택 가능한 항목의 배열입니다. 라디오 버튼 또는 체크박스의 배열을 예로 들 수 있습니다. 최대 100개 항목을 지원합니다.
onChangeAction	object (Action) 지정하면 선택사항이 변경될 때 양식이 제출됩니다. 지정하지 않으면 양식을 제출하는 별도의 버튼을 지정해야 합니다. 양식 입력 작업에 관한 자세한 내용은 다음을 참고하세요. 양식 데이터를 수신합니다.
multiSelectMaxSelectedItems	integer 다중 선택 메뉴의 경우 사용자가 선택할 수 있는 최대 항목 수입니다. 최솟값은 1개 항목입니다. 지정하지 않으면 기본값은 항목 3개입니다.
multiSelectMinQueryLength	integer 다중 선택 메뉴의 경우 앱이 쿼리하기 전에 사용자가 입력하는 텍스트 문자 수가 자동 완성되고 메뉴에 추천 항목이 표시됩니다. 지정하지 않을 경우 기본값은 정적 데이터 소스의 경우 0자, 외부 데이터 소스의 경우 3자입니다.
validation	object (Validation) 개발자 프리뷰: 이 기능은 Google Workspace 개발자 프리뷰 프로그램: 특정 기능의 사전 체험판을 이용할 수 있습니다. 를 통해 개인정보처리방침을 정의할 수 있습니다. 드롭다운 메뉴의 경우 이 선택 입력란의 유효성 검사입니다. Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.
공용체 필드 multi_select_data_source 다중 선택 메뉴의 경우 선택 항목을 채우는 데이터 소스 Google Chat 앱에서는 사용할 수 있지만 Google Workspace 부가기능에서는 사용할 수 없습니다. multi_select_data_source 다음 중 하나여야 합니다.
externalDataSource	object (Action) 외부 데이터 소스(예: 관계형 데이터 기반)
platformDataSource	object (PlatformDataSource) Google Workspace의 데이터 소스

SelectionType

사용자가 선택할 수 있는 항목의 형식입니다. 옵션마다 지원하는 상호작용의 유형이 다릅니다. 예를 들어 사용자가 여러 개의 체크박스를 선택할 수 있지만 드롭다운 메뉴에서는 한 항목만 선택할 수 있습니다.

각 선택 입력은 한 가지 선택 유형을 지원합니다. 예를 들어 체크박스와 스위치를 함께 사용하는 것은 지원되지 않습니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

열거형
CHECK_BOX	체크박스 세트. 사용자는 체크박스를 하나 이상 선택할 수 있습니다.
RADIO_BUTTON	라디오 버튼 집합입니다. 사용자는 하나의 라디오 버튼을 선택할 수 있습니다.
SWITCH	스위치 세트 사용자는 스위치를 하나 이상 사용 설정할 수 있습니다.
DROPDOWN	드롭다운 메뉴 사용자는 메뉴에서 하나의 항목을 선택할 수 있습니다.
MULTI_SELECT	정적 또는 동적 데이터를 위한 다중 선택 메뉴입니다. 사용자는 메뉴 바에서 하나 이상의 항목을 선택합니다. 사용자는 값을 입력하여 동적 데이터를 채울 수도 있습니다. 예를 들어 사용자가 Google Chat 스페이스의 이름을 입력하기 시작하면 위젯에서 스페이스를 자동 추천합니다. 다중 선택 메뉴의 항목을 채우려면 다음 데이터 소스 유형 중 하나를 사용하세요. 정적 데이터: 항목은 다음과 같이 지정됩니다. SelectionItem 객체입니다. 최대 100개 항목 Google Workspace 데이터: 항목은 Google Workspace 사용자 또는 Google Chat 스페이스와 같은 Google Workspace의 데이터를 사용하여 채워집니다. 외부 데이터: 항목은 Google Workspace 외부의 외부 데이터 소스에서 채워집니다. 다중 선택 메뉴를 구현하는 방법의 예는 다음을 참조하세요. 다중 선택 메뉴 추가 Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다. Google Workspace 부가기능의 다중 선택 기능은 개발자 프리뷰 버전입니다.

SelectionItem

체크박스나 스위치와 같이 사용자가 선택 입력에서 선택할 수 있는 항목입니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "text": string, "value": string, "selected": boolean, "startIconUri": string, "bottomText": string }

필드
text	string 상품을 식별하거나 사용자에게 설명하는 텍스트입니다.
value	string 이 항목과 연결된 값입니다. 클라이언트는 이 값을 양식 입력 값으로 사용해야 합니다. 양식 입력 작업에 관한 자세한 내용은 다음을 참고하세요. 양식 데이터를 수신합니다.
selected	boolean 항목이 기본적으로 선택되는지 여부입니다. 선택 입력에 하나의 값만 허용하는 경우 (예: 라디오 버튼 또는 드롭다운 메뉴) 이 입력란을 하나의 항목에만 설정합니다.
startIconUri	string 다중 선택 메뉴의 경우 항목 메뉴 옆에 표시되는 아이콘의 URL text 필드를 확인합니다. PNG 및 JPEG 파일을 지원합니다. 반드시 HTTPS URL입니다. 예를 들어 https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png
bottomText	string 다중 선택 메뉴의 경우 항목의 메뉴 아래에 표시되는 텍스트 설명 또는 라벨을 text 필드를 확인합니다.

PlatformDataSource

SelectionInput 위젯입니다. 다중 선택 메뉴에서 항목을 채우는 데 사용됩니다.

Google Chat 앱에서는 사용할 수 있지만 Google Workspace 부가기능에서는 사용할 수 없습니다.

JSON 표현
{ // Union field data_source can be only one of the following: "commonDataSource": enum (CommonDataSource), "hostAppDataSource": { object (HostAppDataSourceMarkup) } // End of list of possible types for union field data_source. }

필드
공용체 필드 data_source 데이터 소스입니다. data_source 다음 중 하나여야 합니다.
commonDataSource	enum (CommonDataSource) 모든 Google Workspace 애플리케이션(예: Google Workspace 조직의 사용자)이 공유하는 데이터 소스입니다.
hostAppDataSource	object (HostAppDataSourceMarkup) Google Chat의 스페이스와 같은 Google Workspace 호스트 애플리케이션에 고유한 데이터 소스입니다.

CommonDataSource

모두가 공유하는 데이터 소스 Google Workspace 애플리케이션.

Google Chat 앱에서는 사용할 수 있지만 Google Workspace 부가기능에서는 사용할 수 없습니다.

열거형
UNKNOWN	기본값 사용하지 마세요.
USER	Google Workspace 사용자 사용자는 Google Workspace 조직의 사용자만 보고 선택할 수 있습니다.

HostAppDataSourceMarkup

SelectionInput Google Workspace 애플리케이션의 데이터 소스인 다중 선택 메뉴를 사용하는 위젯입니다. 데이터 소스가 다중 선택 메뉴의 선택 항목을 채웁니다.

Google Chat 앱에서는 사용할 수 있지만 Google Workspace 부가기능에서는 사용할 수 없습니다.

JSON 표현
{ // Union field data_source can be only one of the following: "chatDataSource": { object (ChatClientDataSourceMarkup) } // End of list of possible types for union field data_source. }

필드
공용체 필드 data_source 다중 선택 메뉴의 항목을 채우는 Google Workspace 애플리케이션 data_source 다음 중 하나여야 합니다.
chatDataSource	object (ChatClientDataSourceMarkup) Google Chat의 데이터 소스

ChatClientDataSourceMarkup

SelectionInput Google Chat의 데이터 소스인 다중 선택 메뉴를 사용하는 위젯입니다. 데이터 소스가 다중 선택 메뉴의 선택 항목을 채웁니다. 예를 들어 사용자는 자신이 참여 중인 Google Chat 스페이스를 선택할 수 있습니다.

Google Chat 앱에서는 사용할 수 있지만 Google Workspace 부가기능에서는 사용할 수 없습니다.

JSON 표현
{ // Union field source can be only one of the following: "spaceDataSource": { object (SpaceDataSource) } // End of list of possible types for union field source. }

필드
공용체 필드 source Google Chat 데이터 소스입니다. source 다음 중 하나여야 합니다.
spaceDataSource	object (SpaceDataSource) 사용자가 참여 중인 Google Chat 스페이스

SpaceDataSource

Google Chat 스페이스를 다중 선택 메뉴의 선택 항목으로 채우는 데이터 소스입니다. 사용자가 참여 중인 스페이스만 채웁니다.

Google Chat 앱에서는 사용할 수 있지만 Google Workspace 부가기능에서는 사용할 수 없습니다.

JSON 표현
{ "defaultToCurrentSpace": boolean }

필드
defaultToCurrentSpace	boolean 설정된 경우 true: 다중 선택 메뉴에서 기본적으로 현재 Google Chat 스페이스를 항목으로 선택합니다.

DateTimePicker

사용자가 날짜, 시간 또는 날짜와 시간을 모두 입력할 수 있습니다. Google Chat 앱의 예는 다음을 참고하세요. 사용자가 날짜와 시간을 선택하도록 합니다.

사용자는 텍스트를 입력하거나 선택 도구를 사용하여 날짜와 시간을 선택할 수 있습니다. 사용자가 잘못된 날짜나 시간을 입력하면 선택 도구에 사용자에게 정보를 올바르게 입력하라는 오류가 표시됩니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "name": string, "label": string, "type": enum (DateTimePickerType), "valueMsEpoch": string, "timezoneOffsetDate": integer, "onChangeAction": { object (Action) }, "validation": { object (Validation) } }

필드
name	string 광고 항목의 이름입니다. DateTimePicker 양식 입력 이벤트에서 식별됩니다 양식 입력 작업에 관한 자세한 내용은 다음을 참고하세요. 양식 데이터를 수신합니다.
label	string 사용자에게 날짜, 시간 또는 날짜와 시간을 입력하라는 메시지를 표시하는 텍스트입니다. 예를 들어 사용자가 일정을 예약하는 경우 Appointment date 또는 Appointment date and time입니다.
type	enum (DateTimePickerType) 위젯에서 날짜, 시간 또는 날짜와 시간 입력을 지원하는지 여부입니다.
valueMsEpoch	string (int64 format) 위젯에 표시되는 기본값(밀리초)입니다. 유닉스 시간. 선택도구 유형에 따라 값을 지정합니다 ( DateTimePickerType): DATE_AND_TIME : UTC 기준 달력 날짜 및 시간. 예를 들어 2023년 1월 1일 오후 12시(UTC)를 나타내려면 다음을 사용합니다. 1672574400000 DATE_ONLY : 캘린더 날짜 00:00:00 UTC 예를 들어 2023년 1월 1일을 나타내려면 다음을 사용합니다. 1672531200000 TIME_ONLY : UTC 기준 시간입니다. 예를 들어 오후 12시를 나타내려면 43200000 (또는 12 * 60 * 60 * 1000).
timezoneOffsetDate	integer UTC로부터의 시간대 오프셋을 분 단위로 나타내는 숫자입니다. 설정된 경우 valueMsEpoch 지정된 시간대로 표시됩니다. 설정하지 않으면 기본값은 사용자의 시간대 설정으로 설정됩니다.
onChangeAction	object (Action) 사용자가 클릭할 때 트리거됩니다. 저장 또는 지우기 - <ph type="x-smartling-placeholder">DateTimePicker</ph> 인터페이스에 추가되었습니다.
validation	object (Validation) 개발자 프리뷰: 이 기능은 Google Workspace 개발자 프리뷰 프로그램: 특정 기능의 사전 체험판을 이용할 수 있습니다. 를 통해 개인정보처리방침을 정의할 수 있습니다. 선택사항입니다. 이 날짜/시간 선택기에 필요한 검증을 지정합니다. Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

DateTimePickerType

DateTimePicker 위젯에 추가합니다. 사용자가 날짜, 시간 또는 날짜와 시간을 모두 입력할 수 있는지 결정합니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

열거형
DATE_AND_TIME	사용자가 날짜와 시간을 입력합니다.
DATE_ONLY	사용자가 날짜를 입력합니다.
TIME_ONLY	사용자가 시간을 입력합니다.

구분선

이 유형에는 필드가 없습니다.

위젯 사이의 구분선을 가로선으로 표시합니다. Google Chat 앱의 예는 다음을 참고하세요. 위젯 사이에 가로 구분선을 추가합니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

예를 들어 다음 JSON은 구분선을 만듭니다.

"divider": {}

그리드

항목 컬렉션이 있는 그리드를 표시합니다. 항목에는 텍스트 또는 이미지만 포함할 수 있습니다. 반응형 열의 경우 또는 텍스트 또는 이미지 이상을 포함하려면 다음을 사용합니다. Columns Google Chat 앱의 예는 다음을 참고하세요. 항목 모음이 있는 그리드를 표시합니다.

그리드는 원하는 수의 열과 항목을 지원합니다. 행 수는 항목을 열로 나눈 값으로 결정됩니다. 항목이 10개이고 열이 2개인 그리드에는 5개의 행이 있습니다. 항목이 11개이고 열이 2개인 그리드에는 6개의 행이 있습니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

예를 들어 다음 JSON은 단일 항목이 있는 2열 그리드를 만듭니다.

"grid": {
  "title": "A fine collection of items",
  "columnCount": 2,
  "borderStyle": {
    "type": "STROKE",
    "cornerRadius": 4
  },
  "items": [
    {
      "image": {
        "imageUri": "https://www.example.com/image.png",
        "cropStyle": {
          "type": "SQUARE"
        },
        "borderStyle": {
          "type": "STROKE"
        }
      },
      "title": "An item",
      "textAlignment": "CENTER"
    }
  ],
  "onClick": {
    "openLink": {
      "url": "https://www.example.com"
    }
  }
}

JSON 표현
{ "title": string, "items": [ { object (GridItem) } ], "borderStyle": { object (BorderStyle) }, "columnCount": integer, "onClick": { object (OnClick) } }

필드
title	string 그리드 헤더에 표시되는 텍스트입니다.
items[]	object (GridItem) 그리드에 표시할 항목입니다.
borderStyle	object (BorderStyle) 각 그리드 항목에 적용할 테두리 스타일입니다.
columnCount	integer 그리드에 표시할 열의 수입니다. 이 필드가 지정되지 않은 경우 기본값이 사용되며 그 기본값은 그리드가 표시되는 위치 (대화상자 또는 컴패니언)에 따라 다릅니다.
onClick	object (OnClick) 이 콜백은 각 개별 그리드 항목에서 재사용되지만 항목 목록의 항목 식별자와 색인이 콜백의 매개변수에 추가됩니다.

GridItem

그리드 레이아웃의 항목을 나타냅니다. 항목에는 텍스트, 이미지 또는 텍스트와 이미지를 모두 포함할 수 있습니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "id": string, "image": { object (ImageComponent) }, "title": string, "subtitle": string, "layout": enum (GridItemLayout) }

필드
id	string 이 그리드 항목의 사용자 지정 식별자입니다. 이 식별자는 상위 그리드의 onClick 콜백 매개변수로 전달됩니다.
image	object (ImageComponent) 그리드 항목에 표시되는 이미지입니다.
title	string 그리드 항목의 제목입니다.
subtitle	string 그리드 항목의 부제목입니다.
layout	enum (GridItemLayout) 그리드 항목에 사용할 레이아웃입니다.

ImageComponent

이미지를 나타냅니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "imageUri": string, "altText": string, "cropStyle": { object (ImageCropStyle) }, "borderStyle": { object (BorderStyle) } }

필드
imageUri	string 이미지 URL입니다.
altText	string 이미지의 접근성 라벨입니다.
cropStyle	object (ImageCropStyle) 이미지에 적용할 자르기 스타일입니다.
borderStyle	object (BorderStyle) 이미지에 적용할 테두리 스타일입니다.

ImageCropStyle

이미지에 적용된 자르기 스타일을 나타냅니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

예를 들어 16:9 가로세로 비율을 적용하는 방법은 다음과 같습니다.

cropStyle {
 "type": "RECTANGLE_CUSTOM",
 "aspectRatio": 16/9
}

JSON 표현
{ "type": enum (ImageCropType), "aspectRatio": number }

필드
type	enum (ImageCropType) 자르기 유형
aspectRatio	number 자르기 유형이 RECTANGLE_CUSTOM 예를 들어 16:9 가로세로 비율을 적용하는 방법은 다음과 같습니다. cropStyle { "type": "RECTANGLE_CUSTOM", "aspectRatio": 16/9 }

ImageCropType

이미지에 적용된 자르기 스타일을 나타냅니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

열거형
IMAGE_CROP_TYPE_UNSPECIFIED	사용하지 마세요. 지정되지 않았습니다.
SQUARE	기본값 정사각형 자르기를 적용합니다.
CIRCLE	원형으로 자르기를 적용합니다.
RECTANGLE_CUSTOM	맞춤 가로세로 비율로 직사각형 자르기를 적용합니다. 맞춤 가로세로 비율 설정 aspectRatio
RECTANGLE_4_3	4:3 가로세로 비율로 직사각형 자르기를 적용합니다.

BorderStyle

테두리 유형 및 색상을 포함한 카드 또는 위젯의 테두리 스타일 옵션입니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "type": enum (BorderType), "strokeColor": { object (Color) }, "cornerRadius": integer }

필드
type	enum (BorderType) 테두리 유형입니다.
strokeColor	object (Color) 유형일 때 사용할 색상입니다. BORDER_TYPE_STROKE
cornerRadius	integer 테두리의 모서리 반경입니다.

BorderType

위젯에 적용된 테두리 유형을 나타냅니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

열거형
BORDER_TYPE_UNSPECIFIED	사용하지 마세요. 지정되지 않았습니다.
NO_BORDER	기본값 테두리 없음
STROKE	Outline을 탭합니다.

GridItemLayout

그리드 항목에 사용할 수 있는 다양한 레이아웃 옵션을 나타냅니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

열거형
GRID_ITEM_LAYOUT_UNSPECIFIED	사용하지 마세요. 지정되지 않았습니다.
TEXT_BELOW	제목과 부제목은 그리드 항목의 이미지 아래에 표시됩니다.
TEXT_ABOVE	제목과 부제목은 그리드 항목의 이미지 위에 표시됩니다.

열

이 Columns 위젯은 카드 또는 대화상자에 최대 2개의 열을 표시합니다. 각 열에 위젯을 추가할 수 있습니다. 지정된 순서대로 표시됩니다. Google Chat 앱의 예는 다음을 참고하세요. 카드와 대화상자를 열에 표시합니다.

각 열의 높이는 더 긴 열에 의해 결정됩니다. 예를 들어 첫 번째 열이 두 번째 열보다 높으면 두 열 모두 첫 번째 열의 높이를 갖습니다. 각 열에 다른 수의 위젯이 포함될 수 있으므로 행을 정의하거나 열 사이에 위젯을 정렬할 수 없습니다.

열이 나란히 표시됩니다. 아래의 항목을 사용하여 각 열의 너비를 맞춤설정할 수 있습니다. HorizontalSizeStyle 필드를 확인합니다. 사용자의 화면 너비가 너무 좁으면 두 번째 열이 첫 번째 열 아래로 래핑됩니다.

• 웹에서 두 번째 열은 화면 너비가 480픽셀 이하인 경우 줄바꿈됩니다.
• iOS 기기에서는 화면 너비가 300pt 이하이면 두 번째 열이 줄바꿈됩니다.
• Android 기기에서는 화면 너비가 320dp 이하이면 두 번째 열이 래핑됩니다.

열을 3개 이상 포함하거나 행을 사용하려면 Grid 위젯에 추가합니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다. Google Workspace 부가기능 열은 개발자 프리뷰 상태에 있습니다.

JSON 표현
{ "columnItems": [ { object (Column) } ] }

필드
columnItems[]	object (Column) 열의 배열입니다. 카드 또는 대화상자에 최대 2개의 열을 포함할 수 있습니다.

열

열

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다. Google Workspace 부가기능 열은 개발자 프리뷰 상태에 있습니다.

JSON 표현
{ "horizontalSizeStyle": enum (HorizontalSizeStyle), "horizontalAlignment": enum (HorizontalAlignment), "verticalAlignment": enum (VerticalAlignment), "widgets": [ { object (Widgets) } ] }

필드
horizontalSizeStyle	enum (HorizontalSizeStyle) 열이 카드의 너비를 채우는 방식을 지정합니다.
horizontalAlignment	enum (HorizontalAlignment) 위젯을 열의 왼쪽, 오른쪽 또는 가운데에 정렬할지 지정합니다.
verticalAlignment	enum (VerticalAlignment) 위젯을 열의 상단, 하단, 가운데에 정렬할지 지정합니다.
widgets[]	object (Widgets) 열에 포함된 위젯의 배열입니다. 위젯은 지정된 순서대로 표시됩니다.

HorizontalSizeStyle

열이 카드 너비를 채우는 방식을 지정합니다. 각 열의 너비는 HorizontalSizeStyle 열 내 위젯의 너비입니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다. Google Workspace 부가기능 열은 개발자 프리뷰 상태에 있습니다.

열거형
HORIZONTAL_SIZE_STYLE_UNSPECIFIED	사용하지 마세요. 지정되지 않았습니다.
FILL_AVAILABLE_SPACE	기본값 열은 사용 가능한 공간을 카드 너비의 최대 70% 까지 채웁니다. 두 열이 모두 FILL_AVAILABLE_SPACE: 각 열이 공간의 50% 를 채웁니다.
FILL_MINIMUM_SPACE	열은 가능한 최소 공간을 채우고 카드 너비의 30% 를 넘지 않아야 합니다.

HorizontalAlignment

위젯을 열의 왼쪽, 오른쪽 또는 가운데에 정렬할지 지정합니다.

Google Chat 앱에서는 사용할 수 있지만 Google Workspace 부가기능에서는 사용할 수 없습니다.

열거형
HORIZONTAL_ALIGNMENT_UNSPECIFIED	사용하지 마세요. 지정되지 않았습니다.
START	기본값 열의 시작 위치에 위젯을 정렬합니다. 왼쪽에서 오른쪽 레이아웃의 경우 왼쪽으로 정렬합니다. 오른쪽에서 왼쪽으로 쓰는 레이아웃의 경우 오른쪽으로 정렬합니다.
CENTER	위젯을 열 중앙에 정렬합니다.
END	열의 끝 위치에 위젯을 정렬합니다. 왼쪽에서 오른쪽 레이아웃의 경우 위젯을 오른쪽으로 정렬합니다. 오른쪽에서 왼쪽으로 레이아웃의 경우 위젯을 왼쪽으로 정렬합니다.

VerticalAlignment

위젯을 열의 상단, 하단, 가운데에 정렬할지 지정합니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다. Google Workspace 부가기능 열은 개발자 프리뷰 상태에 있습니다.

열거형
VERTICAL_ALIGNMENT_UNSPECIFIED	사용하지 마세요. 지정되지 않았습니다.
CENTER	기본값 위젯을 열 중앙에 정렬합니다.
TOP	위젯을 열 상단에 정렬합니다.
BOTTOM	위젯을 열 하단에 정렬합니다.

위젯

열에 포함할 수 있는 지원되는 위젯입니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다. Google Workspace 부가기능 열은 개발자 프리뷰 상태에 있습니다.

JSON 표현

{ // Union field data can be only one of the following: "textParagraph": { object (TextParagraph) }, "image": { object (Image) }, "decoratedText": { object (DecoratedText) }, "buttonList": { object (ButtonList) }, "textInput": { object (TextInput) }, "selectionInput": { object (SelectionInput) }, "dateTimePicker": { object (DateTimePicker) } // End of list of possible types for union field data. }

필드
공용체 필드 data data 다음 중 하나여야 합니다.
textParagraph	object (TextParagraph) TextParagraph 위젯에 추가합니다.
image	object (Image) Image 위젯에 추가합니다.
decoratedText	object (DecoratedText) DecoratedText 위젯에 추가합니다.
buttonList	object (ButtonList) ButtonList 위젯에 추가합니다.
textInput	object (TextInput) TextInput 위젯에 추가합니다.
selectionInput	object (SelectionInput) SelectionInput 위젯에 추가합니다.
dateTimePicker	object (DateTimePicker) DateTimePicker 위젯에 추가합니다.

DividerStyle

카드의 구분선 스타일입니다. 현재는 카드 섹션 사이의 구분선에만 사용됩니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

열거형
DIVIDER_STYLE_UNSPECIFIED	사용하지 마세요. 지정되지 않았습니다.
SOLID_DIVIDER	기본 옵션입니다. 섹션 사이에 단색 구분선을 렌더링합니다.
NO_DIVIDER	설정하면 섹션 간에 구분선이 렌더링되지 않습니다.

CardAction

카드 작업은 카드와 연결된 작업입니다. 예를 들어 인보이스 카드에는 인보이스 삭제, 인보이스 이메일 발송, 브라우저에서 인보이스 열기와 같은 작업이 포함될 수 있습니다.

Google Workspace 부가기능에서는 사용할 수 있지만 Google Chat 앱에서는 사용할 수 없습니다.

JSON 표현
{ "actionLabel": string, "onClick": { object (OnClick) } }

필드
actionLabel	string 작업 메뉴 항목으로 표시되는 라벨입니다.
onClick	object (OnClick) 이 onClick 지정할 수 있습니다.

CardFixedFooter

카드 하단에 표시되는 영구적인 (고정) 바닥글입니다.

설정 fixedFooter 포드의 상태를 primaryButton 또는 <ph type="x-smartling-placeholder">secondaryButton</ph> 오류가 발생합니다.

Chat 앱의 경우 대화상자로 대체될 수 있지만 카드 메시지. Google Chat 앱의 예는 다음을 참고하세요. 영구 바닥글을 추가합니다.

Google Chat 앱 및 Google Workspace 부가기능에서 사용할 수 있습니다.

JSON 표현
{ "primaryButton": { object (Button) }, "secondaryButton": { object (Button) } }

필드
primaryButton	object (Button) 고정 바닥글의 기본 버튼입니다. 버튼은 텍스트와 색상이 설정된 텍스트 버튼이어야 합니다.
secondaryButton	object (Button) 고정 바닥글의 보조 버튼입니다. 버튼은 텍스트와 색상이 설정된 텍스트 버튼이어야 합니다. 만약 secondaryButton 가 설정되면 primaryButton입니다.

DisplayStyle

Google Workspace 부가기능에서 카드가 표시되는 방식을 결정합니다.

Google Workspace 부가기능에서는 사용할 수 있지만 Google Chat 앱에서는 사용할 수 없습니다.

열거형
DISPLAY_STYLE_UNSPECIFIED	사용하지 마세요. 지정되지 않았습니다.
PEEK	카드 헤더는 사이드바 하단에 표시되며 스택의 현재 상단 카드를 부분적으로 가립니다. 헤더를 클릭하면 카드가 카드 스택으로 팝됩니다. 카드에 헤더가 없으면 생성된 헤더가 대신 사용됩니다.
REPLACE	기본값 카드 스택에서 상단 카드 보기가 바뀌면서 카드가 표시됩니다.