카드 또는 대화상자의 구성요소 디자인

이 페이지에서는 Google Chat에서 카드 메시지의 기본 UI 구성요소를 디자인하고 만드는 방법을 설명합니다.

카드는 정의된 레이아웃, 대화형 UI 요소(예: 버튼), 리치 미디어(예: 이미지)를 지원합니다. 카드를 사용하여 정보를 표시하거나, 입력을 수집하거나, 카드 메시지 및 대화상자를 통해 사용자에게 다음 단계를 제공할 수 있습니다.

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

카드 빌더 열기

카드와 대화상자에는 일반적으로 다음과 같은 구성요소가 있습니다.

  • 카드 제목이 포함된 CardHeader입니다.
  • 카드의 기본 본문을 구성하는 하나 이상의 CardSection 위젯입니다.
  • 대화상자 전용 CardFixedFooter 위젯입니다.

기본 요건

  • Google Chat에 액세스할 수 있는 Google Workspace 계정
  • 게시된 채팅 앱입니다. 채팅 앱을 빌드하려면 이 quickstart을 따르세요.

    • 헤더 추가

    CardHeader 위젯은 카드의 헤더를 나타냅니다. 헤더에는 카드의 제목, 부제목, 아바타 이미지를 포함할 수 있습니다.

    카드 메시지 및 대화상자에 CardHeader를 포함할 수 있습니다.

    다음은 CardHeader의 예입니다.

    카드의 섹션 정의

    CardSection 위젯은 카드 내의 상위 수준 컨테이너입니다. 카드 섹션을 사용하여 카드 내에서 위젯을 그룹화합니다. 각 카드 섹션에 헤더와 하나 이상의 위젯을 포함할 수 있습니다.

    카드 메시지 및 대화상자에 CardSection를 포함할 수 있습니다.

    다음은 두 개의 textParagraph 위젯이 포함된 CardSection의 예입니다.

    CardFixedFooter 위젯은 채팅 앱에서 보낸 대화상자 메시지의 바닥글을 나타냅니다. 바닥글에는 기본 버튼과 보조 버튼이 포함될 수 있습니다.

    CardFixedFooter 위젯은 대화상자에서만 사용할 수 있습니다.

    다음은 버튼이 두 개인 CardFixedFooter 위젯의 예입니다.

    문제 해결

    Google Chat 앱 또는 카드에서 오류를 반환하면 Chat 인터페이스에 '문제 발생' 또는 '요청을 처리할 수 없습니다'라는 메시지가 표시됩니다. 채팅 UI에는 오류 메시지가 표시되지 않지만 채팅 앱 또는 카드에서 예기치 않은 결과가 발생하는 경우가 있습니다. 예를 들어 카드 메시지가 표시되지 않을 수 있습니다.

    Chat UI에 오류 메시지가 표시되지 않더라도 채팅 앱에 대한 오류 기록이 사용 설정되어 있을 때 오류를 수정하는 데 도움이 되는 자세한 오류 메시지와 로그 데이터가 제공됩니다. 오류를 확인, 디버깅, 수정하는 데 도움이 필요하면 Google Chat 오류 문제 해결 및 수정하기를 참고하세요.