Google Apps Chat V1 Client - Class Card (0.12.1)

Reference documentation and code samples for the Google Apps Chat V1 Client class Card.

A card interface displayed in a Google Chat message or Google Workspace Add-on.

Cards support a defined layout, interactive UI elements like buttons, and rich media like images. Use cards to present detailed information, gather information from users, and guide users to take a next step. Card builder To learn how to build cards, see the following documentation:

  • For Google Chat apps, see Design the components of a card or dialog.
  • For Google Workspace Add-ons, see Card-based interfaces. Example: Card message for a Google Chat app Example contact
card To create the sample card message in Google Chat, use the following JSON: php { "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": "sasha@example.com" } }, { "decoratedText": { "startIcon": { "knownIcon": "PERSON" }, "text": "<font color=\"#80e27e\">Online</font>" } }, { "decoratedText": { "startIcon": { "knownIcon": "PHONE" }, "text": "+1 (555) 555-1234" } }, { "buttonList": { "buttons": [ { "text": "Share", "onClick": { "openLink": { "url": "https://example.com/share" } } }, { "text": "Edit", "onClick": { "action": { "function": "goToView", "parameters": [ { "key": "viewType", "value": "EDIT" } ] } } } ] } } ] } ] } } ] }

Generated from protobuf message google.apps.card.v1.Card

Namespace

Google \ Apps \ Card \ V1

Methods

__construct

Constructor.

Parameters
Name Description
data array

Optional. Data for populating the Message object.

↳ header Card\CardHeader

The header of the card. A header usually contains a leading image and a title. Headers always appear at the top of a card.

↳ sections array<Card\Section>

Contains a collection of widgets. Each section has its own, optional header. Sections are visually separated by a line divider. For an example in Google Chat apps, see Define a section of a card.

↳ section_divider_style int

The divider style between sections.

↳ card_actions array<Card\CardAction>

The card's actions. Actions are added to the card's toolbar menu. Google Workspace Add-ons: For example, the following JSON constructs a card action menu with Settings and Send Feedback options: "card_actions": [ { "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

Name of the card. Used as a card identifier in card navigation. Google Workspace Add-ons:

↳ fixed_footer Card\CardFixedFooter

The fixed footer shown at the bottom of this card. Setting fixedFooter without specifying a primaryButton or a secondaryButton causes an error. For Chat apps, you can use fixed footers in dialogs, but not card messages. Google Workspace Add-ons and Chat apps:

↳ display_style int

In Google Workspace Add-ons, sets the display properties of the peekCardHeader. Google Workspace Add-ons:

↳ peek_card_header Card\CardHeader

When displaying contextual content, the peek card header acts as a placeholder so that the user can navigate forward between the homepage cards and the contextual cards. Google Workspace Add-ons:

getHeader

The header of the card. A header usually contains a leading image and a title. Headers always appear at the top of a card.

Returns
Type Description
Card\CardHeader|null

hasHeader

clearHeader

setHeader

The header of the card. A header usually contains a leading image and a title. Headers always appear at the top of a card.

Parameter
Name Description
var Card\CardHeader
Returns
Type Description
$this

getSections

Contains a collection of widgets. Each section has its own, optional header. Sections are visually separated by a line divider. For an example in Google Chat apps, see Define a section of a card.

Returns
Type Description
Google\Protobuf\Internal\RepeatedField

setSections

Contains a collection of widgets. Each section has its own, optional header. Sections are visually separated by a line divider. For an example in Google Chat apps, see Define a section of a card.

Parameter
Name Description
var array<Card\Section>
Returns
Type Description
$this

getSectionDividerStyle

The divider style between sections.

Returns
Type Description
int Enum of type DividerStyle.

setSectionDividerStyle

The divider style between sections.

Parameter
Name Description
var int

Enum of type DividerStyle.

Returns
Type Description
$this

getCardActions

The card's actions. Actions are added to the card's toolbar menu.

Google Workspace Add-ons: For example, the following JSON constructs a card action menu with Settings and Send Feedback options:

"card_actions": [
  {
    "actionLabel": "Settings",
    "onClick": {
      "action": {
        "functionName": "goToView",
        "parameters": [
          {
            "key": "viewType",
            "value": "SETTING"
         }
        ],
        "loadIndicator": "LoadIndicator.SPINNER"
      }
    }
  },
  {
    "actionLabel": "Send Feedback",
    "onClick": {
      "openLink": {
        "url": "https://example.com/feedback"
      }
    }
  }
]
Returns
Type Description
Google\Protobuf\Internal\RepeatedField

setCardActions

The card's actions. Actions are added to the card's toolbar menu.

Google Workspace Add-ons: For example, the following JSON constructs a card action menu with Settings and Send Feedback options:

"card_actions": [
  {
    "actionLabel": "Settings",
    "onClick": {
      "action": {
        "functionName": "goToView",
        "parameters": [
          {
            "key": "viewType",
            "value": "SETTING"
         }
        ],
        "loadIndicator": "LoadIndicator.SPINNER"
      }
    }
  },
  {
    "actionLabel": "Send Feedback",
    "onClick": {
      "openLink": {
        "url": "https://example.com/feedback"
      }
    }
  }
]
Parameter
Name Description
var array<Card\CardAction>
Returns
Type Description
$this

getName

Name of the card. Used as a card identifier in card navigation.

Google Workspace Add-ons:

Returns
Type Description
string

setName

Name of the card. Used as a card identifier in card navigation.

Google Workspace Add-ons:

Parameter
Name Description
var string
Returns
Type Description
$this

getFixedFooter

The fixed footer shown at the bottom of this card.

Setting fixedFooter without specifying a primaryButton or a secondaryButton causes an error. For Chat apps, you can use fixed footers in dialogs, but not card messages. Google Workspace Add-ons and Chat apps:

Returns
Type Description
Card\CardFixedFooter|null

hasFixedFooter

clearFixedFooter

setFixedFooter

The fixed footer shown at the bottom of this card.

Setting fixedFooter without specifying a primaryButton or a secondaryButton causes an error. For Chat apps, you can use fixed footers in dialogs, but not card messages. Google Workspace Add-ons and Chat apps:

Parameter
Name Description
var Card\CardFixedFooter
Returns
Type Description
$this

getDisplayStyle

In Google Workspace Add-ons, sets the display properties of the peekCardHeader.

Google Workspace Add-ons:

Returns
Type Description
int Enum of type DisplayStyle.

setDisplayStyle

In Google Workspace Add-ons, sets the display properties of the peekCardHeader.

Google Workspace Add-ons:

Parameter
Name Description
var int

Enum of type DisplayStyle.

Returns
Type Description
$this

getPeekCardHeader

When displaying contextual content, the peek card header acts as a placeholder so that the user can navigate forward between the homepage cards and the contextual cards.

Google Workspace Add-ons:

Returns
Type Description
Card\CardHeader|null

hasPeekCardHeader

clearPeekCardHeader

setPeekCardHeader

When displaying contextual content, the peek card header acts as a placeholder so that the user can navigate forward between the homepage cards and the contextual cards.

Google Workspace Add-ons:

Parameter
Name Description
var Card\CardHeader
Returns
Type Description
$this