CardFixedFooter

Stay organized with collections Save and categorize content based on your preferences.

Only supported in dialogs. Not supported for card messages.

CardFixedFooter represents the footer of a card. Footers can include a primary button and a secondary button.

Example

The following image displays a card consisting of a CardFixedFooter component.

A dialog in Google Chat depicting a CardFixedFooter.
Figure 1: A dialog asks the user to specify the preferred programming language.

Here's the card's JSON:

JSON

{
  "actionResponse": {
    "type": "DIALOG",
    "dialogAction": {
      "dialog": {
        "body": {
          "fixed_footer": {
            "primaryButton": {
              "text": "Submit",
              "color": {
                "red": 0,
                "blue": 1,
                "green": 0
              },
              "onClick": {
                "action": {
                  "function": "setLanguageType",
                  "parameters": [
                    {
                      "key": "languageType",
                      "value": "C++"
                    }
                  ]
                }
              }
            },
            "secondaryButton": {
              "text": "Cancel",
              "onClick": {
                "action": {
                  "function": "reset"
                }
              }
            }
          },
          "sections": [
            {
              "widgets": [
                {
                  "textInput": {
                    "name": "preferred_programing_language",
                    "label": "Preferred Language",
                    "initialSuggestions": {
                      "items": [
                        {
                          "text": "C++"
                        },
                        {
                          "text": "Java"
                        },
                        {
                          "text": "JavaScript"
                        },
                        {
                          "text": "Python"
                        }
                      ]
                    }
                  }
                }
              ]
            }
          ],
        }
      }
    }
  }
}

CardFixedFooter JSON representation and fields

A persistent (sticky) footer that that appears at the bottom of the card.

Setting fixedFooter without specifying a primaryButton or a secondaryButton causes an error.

Chat apps support fixedFooter in dialogs , but not in card messages .

JSON representation 
{
  "primaryButton": {
    object (Button)
  },
  "secondaryButton": {
    object (Button)
  }
}
Fields
primaryButton

object ( Button )

The primary button of the fixed footer. The button must be a text button with text and color set.

secondaryButton

object ( Button )

The secondary button of the fixed footer. The button must be a text button with text and color set. primaryButton must be set if secondaryButton is set.

Button

A text, icon, or text + icon button that users can click.

To make an image a clickable button, specify an Image (not an ImageComponent ) and set an onClick action.

Currently supported in Chat apps (including dialogs and card messages ) and Google Workspace Add-ons.

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

string

The text displayed inside the button.

icon

object ( Icon )

The icon image. If both icon and text are set, then the icon appears before the text.

color

object ( Color )

If set, the button is filled with a solid background color and the font color changes to maintain contrast with the background color. For example, setting a blue background will likely result in white text.

If unset, the image background is white and the font color is blue.

For red, green and blue, the value of each field is a float number that can be expressed in either of two ways: as a number between 0 and 255 divided by 255 (153/255) or as a value between 0 and 1 (0.6). 0 represents the absence of a color and 1 or 255/255 represent the full presence of that color on the RGB scale.

Optionally set alpha, which sets a level of transparency using this equation: 

pixel color = alpha * (this color) + (1.0 - alpha) * (background color)

For alpha, a value of 1 corresponds with a solid color, and a value of 0 corresponds with a completely transparent color.

For example, the following color represents a half transparent red: 

"color": {
   "red": 1,
   "green": 0,
   "blue": 0,
   "alpha": 0.5
}
onClick

object ( OnClick )

Required. The action to perform when the button is clicked, such as opening a hyperlink or running a custom function.

disabled

boolean

If true , the button is displayed in an inactive state and doesn't respond to user actions.

altText

string

The alternative text used for accessibility.

Set descriptive text that lets users know what the button does. For example, if a button opens a hyperlink, you might write: "Opens a new browser tab and navigates to the Google Chat developer documentation at https://developers.google.com/chat" .