Class: Google::Apps::Card::V1::Widget
- Inherits:
-
Object
- Object
- Google::Apps::Card::V1::Widget
- Extended by:
- Protobuf::MessageExts::ClassMethods
- Includes:
- Protobuf::MessageExts
- Defined in:
- proto_docs/google/apps/card/v1/card.rb
Overview
Each card is made up of widgets.
A widget is a composite object that can represent one of text, images, buttons, and other object types.
Defined Under Namespace
Modules: HorizontalAlignment, ImageType
Instance Attribute Summary collapse
-
#button_list ⇒ ::Google::Apps::Card::V1::ButtonList
A list of buttons.
-
#columns ⇒ ::Google::Apps::Card::V1::Columns
Displays up to 2 columns.
-
#date_time_picker ⇒ ::Google::Apps::Card::V1::DateTimePicker
Displays a widget that lets users input a date, time, or date and time.
-
#decorated_text ⇒ ::Google::Apps::Card::V1::DecoratedText
Displays a decorated text item.
-
#divider ⇒ ::Google::Apps::Card::V1::Divider
Displays a horizontal line divider between widgets.
-
#grid ⇒ ::Google::Apps::Card::V1::Grid
Displays a grid with a collection of items.
-
#horizontal_alignment ⇒ ::Google::Apps::Card::V1::Widget::HorizontalAlignment
Specifies whether widgets align to the left, right, or center of a column.
-
#image ⇒ ::Google::Apps::Card::V1::Image
Displays an image.
-
#selection_input ⇒ ::Google::Apps::Card::V1::SelectionInput
Displays a selection control that lets users select items.
-
#text_input ⇒ ::Google::Apps::Card::V1::TextInput
Displays a text box that users can type into.
-
#text_paragraph ⇒ ::Google::Apps::Card::V1::TextParagraph
Displays a text paragraph.
Instance Attribute Details
#button_list ⇒ ::Google::Apps::Card::V1::ButtonList
Returns A list of buttons.
For example, the following JSON creates two buttons. The first is a blue text button and the second is an image button that opens a link:
"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"
}
}
}
]
}
```.
651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 |
# File 'proto_docs/google/apps/card/v1/card.rb', line 651 class Widget include ::Google::Protobuf::MessageExts extend ::Google::Protobuf::MessageExts::ClassMethods # The shape used to crop the image. # # [Google Workspace Add-ons and Chat # apps](https://developers.google.com/workspace/extend): module ImageType # Default value. Applies a square mask to the image. For example, a 4x3 # image becomes 3x3. SQUARE = 0 # Applies a circular mask to the image. For example, a 4x3 image becomes a # circle with a diameter of 3. CIRCLE = 1 end # Specifies whether widgets align to the left, right, or center of a column. # # [Google Chat apps](https://developers.google.com/workspace/chat): module HorizontalAlignment # Don't use. Unspecified. HORIZONTAL_ALIGNMENT_UNSPECIFIED = 0 # Default value. Aligns widgets to the start position of the column. For # left-to-right layouts, aligns to the left. For right-to-left layouts, # aligns to the right. START = 1 # Aligns widgets to the center of the column. CENTER = 2 # Aligns widgets to the end position of the column. For left-to-right # layouts, aligns widgets to the right. For right-to-left layouts, aligns # widgets to the left. HorizontalAlignment::END = 3 end end |
#columns ⇒ ::Google::Apps::Card::V1::Columns
Returns Displays up to 2 columns.
To include more than 2 columns, or to use rows, use the Grid
widget.
For example, the following JSON creates 2 columns that each contain text paragraphs:
"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"
}
}
]
}
]
}
```.
651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 |
# File 'proto_docs/google/apps/card/v1/card.rb', line 651 class Widget include ::Google::Protobuf::MessageExts extend ::Google::Protobuf::MessageExts::ClassMethods # The shape used to crop the image. # # [Google Workspace Add-ons and Chat # apps](https://developers.google.com/workspace/extend): module ImageType # Default value. Applies a square mask to the image. For example, a 4x3 # image becomes 3x3. SQUARE = 0 # Applies a circular mask to the image. For example, a 4x3 image becomes a # circle with a diameter of 3. CIRCLE = 1 end # Specifies whether widgets align to the left, right, or center of a column. # # [Google Chat apps](https://developers.google.com/workspace/chat): module HorizontalAlignment # Don't use. Unspecified. HORIZONTAL_ALIGNMENT_UNSPECIFIED = 0 # Default value. Aligns widgets to the start position of the column. For # left-to-right layouts, aligns to the left. For right-to-left layouts, # aligns to the right. START = 1 # Aligns widgets to the center of the column. CENTER = 2 # Aligns widgets to the end position of the column. For left-to-right # layouts, aligns widgets to the right. For right-to-left layouts, aligns # widgets to the left. HorizontalAlignment::END = 3 end end |
#date_time_picker ⇒ ::Google::Apps::Card::V1::DateTimePicker
Returns Displays a widget that lets users input a date, time, or date and time.
For example, the following JSON creates a date time picker to schedule an appointment:
"dateTimePicker": {
"name": "appointment_time",
"label": "Book your appointment at:",
"type": "DATE_AND_TIME",
"valueMsEpoch": "796435200000"
}
```.
651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 |
# File 'proto_docs/google/apps/card/v1/card.rb', line 651 class Widget include ::Google::Protobuf::MessageExts extend ::Google::Protobuf::MessageExts::ClassMethods # The shape used to crop the image. # # [Google Workspace Add-ons and Chat # apps](https://developers.google.com/workspace/extend): module ImageType # Default value. Applies a square mask to the image. For example, a 4x3 # image becomes 3x3. SQUARE = 0 # Applies a circular mask to the image. For example, a 4x3 image becomes a # circle with a diameter of 3. CIRCLE = 1 end # Specifies whether widgets align to the left, right, or center of a column. # # [Google Chat apps](https://developers.google.com/workspace/chat): module HorizontalAlignment # Don't use. Unspecified. HORIZONTAL_ALIGNMENT_UNSPECIFIED = 0 # Default value. Aligns widgets to the start position of the column. For # left-to-right layouts, aligns to the left. For right-to-left layouts, # aligns to the right. START = 1 # Aligns widgets to the center of the column. CENTER = 2 # Aligns widgets to the end position of the column. For left-to-right # layouts, aligns widgets to the right. For right-to-left layouts, aligns # widgets to the left. HorizontalAlignment::END = 3 end end |
#decorated_text ⇒ ::Google::Apps::Card::V1::DecoratedText
Returns Displays a decorated text item.
For example, the following JSON creates a decorated text widget showing email address:
"decoratedText": {
"icon": {
"knownIcon": "EMAIL"
},
"topLabel": "Email Address",
"text": "[email protected]",
"bottomLabel": "This is a new Email address!",
"switchControl": {
"name": "has_send_welcome_email_to_sasha",
"selected": false,
"controlType": "CHECKBOX"
}
}
```.
651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 |
# File 'proto_docs/google/apps/card/v1/card.rb', line 651 class Widget include ::Google::Protobuf::MessageExts extend ::Google::Protobuf::MessageExts::ClassMethods # The shape used to crop the image. # # [Google Workspace Add-ons and Chat # apps](https://developers.google.com/workspace/extend): module ImageType # Default value. Applies a square mask to the image. For example, a 4x3 # image becomes 3x3. SQUARE = 0 # Applies a circular mask to the image. For example, a 4x3 image becomes a # circle with a diameter of 3. CIRCLE = 1 end # Specifies whether widgets align to the left, right, or center of a column. # # [Google Chat apps](https://developers.google.com/workspace/chat): module HorizontalAlignment # Don't use. Unspecified. HORIZONTAL_ALIGNMENT_UNSPECIFIED = 0 # Default value. Aligns widgets to the start position of the column. For # left-to-right layouts, aligns to the left. For right-to-left layouts, # aligns to the right. START = 1 # Aligns widgets to the center of the column. CENTER = 2 # Aligns widgets to the end position of the column. For left-to-right # layouts, aligns widgets to the right. For right-to-left layouts, aligns # widgets to the left. HorizontalAlignment::END = 3 end end |
#divider ⇒ ::Google::Apps::Card::V1::Divider
Returns Displays a horizontal line divider between widgets.
For example, the following JSON creates a divider:
"divider": {
}
```.
651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 |
# File 'proto_docs/google/apps/card/v1/card.rb', line 651 class Widget include ::Google::Protobuf::MessageExts extend ::Google::Protobuf::MessageExts::ClassMethods # The shape used to crop the image. # # [Google Workspace Add-ons and Chat # apps](https://developers.google.com/workspace/extend): module ImageType # Default value. Applies a square mask to the image. For example, a 4x3 # image becomes 3x3. SQUARE = 0 # Applies a circular mask to the image. For example, a 4x3 image becomes a # circle with a diameter of 3. CIRCLE = 1 end # Specifies whether widgets align to the left, right, or center of a column. # # [Google Chat apps](https://developers.google.com/workspace/chat): module HorizontalAlignment # Don't use. Unspecified. HORIZONTAL_ALIGNMENT_UNSPECIFIED = 0 # Default value. Aligns widgets to the start position of the column. For # left-to-right layouts, aligns to the left. For right-to-left layouts, # aligns to the right. START = 1 # Aligns widgets to the center of the column. CENTER = 2 # Aligns widgets to the end position of the column. For left-to-right # layouts, aligns widgets to the right. For right-to-left layouts, aligns # widgets to the left. HorizontalAlignment::END = 3 end end |
#grid ⇒ ::Google::Apps::Card::V1::Grid
Returns Displays a grid with a collection of items.
A grid supports any number of columns and items. The number of rows is determined by the upper bounds of the number items divided by the number of columns. A grid with 10 items and 2 columns has 5 rows. A grid with 11 items and 2 columns has 6 rows.
Google Workspace Add-ons and Chat apps:
For example, the following JSON creates a 2 column grid with a single item:
"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"
}
}
}
```.
651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 |
# File 'proto_docs/google/apps/card/v1/card.rb', line 651 class Widget include ::Google::Protobuf::MessageExts extend ::Google::Protobuf::MessageExts::ClassMethods # The shape used to crop the image. # # [Google Workspace Add-ons and Chat # apps](https://developers.google.com/workspace/extend): module ImageType # Default value. Applies a square mask to the image. For example, a 4x3 # image becomes 3x3. SQUARE = 0 # Applies a circular mask to the image. For example, a 4x3 image becomes a # circle with a diameter of 3. CIRCLE = 1 end # Specifies whether widgets align to the left, right, or center of a column. # # [Google Chat apps](https://developers.google.com/workspace/chat): module HorizontalAlignment # Don't use. Unspecified. HORIZONTAL_ALIGNMENT_UNSPECIFIED = 0 # Default value. Aligns widgets to the start position of the column. For # left-to-right layouts, aligns to the left. For right-to-left layouts, # aligns to the right. START = 1 # Aligns widgets to the center of the column. CENTER = 2 # Aligns widgets to the end position of the column. For left-to-right # layouts, aligns widgets to the right. For right-to-left layouts, aligns # widgets to the left. HorizontalAlignment::END = 3 end end |
#horizontal_alignment ⇒ ::Google::Apps::Card::V1::Widget::HorizontalAlignment
Returns Specifies whether widgets align to the left, right, or center of a column.
651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 |
# File 'proto_docs/google/apps/card/v1/card.rb', line 651 class Widget include ::Google::Protobuf::MessageExts extend ::Google::Protobuf::MessageExts::ClassMethods # The shape used to crop the image. # # [Google Workspace Add-ons and Chat # apps](https://developers.google.com/workspace/extend): module ImageType # Default value. Applies a square mask to the image. For example, a 4x3 # image becomes 3x3. SQUARE = 0 # Applies a circular mask to the image. For example, a 4x3 image becomes a # circle with a diameter of 3. CIRCLE = 1 end # Specifies whether widgets align to the left, right, or center of a column. # # [Google Chat apps](https://developers.google.com/workspace/chat): module HorizontalAlignment # Don't use. Unspecified. HORIZONTAL_ALIGNMENT_UNSPECIFIED = 0 # Default value. Aligns widgets to the start position of the column. For # left-to-right layouts, aligns to the left. For right-to-left layouts, # aligns to the right. START = 1 # Aligns widgets to the center of the column. CENTER = 2 # Aligns widgets to the end position of the column. For left-to-right # layouts, aligns widgets to the right. For right-to-left layouts, aligns # widgets to the left. HorizontalAlignment::END = 3 end end |
#image ⇒ ::Google::Apps::Card::V1::Image
Returns Displays an image.
For example, the following JSON creates an image with alternative text:
"image": {
"imageUrl":
"https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png",
"altText": "Chat app avatar"
}
```.
651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 |
# File 'proto_docs/google/apps/card/v1/card.rb', line 651 class Widget include ::Google::Protobuf::MessageExts extend ::Google::Protobuf::MessageExts::ClassMethods # The shape used to crop the image. # # [Google Workspace Add-ons and Chat # apps](https://developers.google.com/workspace/extend): module ImageType # Default value. Applies a square mask to the image. For example, a 4x3 # image becomes 3x3. SQUARE = 0 # Applies a circular mask to the image. For example, a 4x3 image becomes a # circle with a diameter of 3. CIRCLE = 1 end # Specifies whether widgets align to the left, right, or center of a column. # # [Google Chat apps](https://developers.google.com/workspace/chat): module HorizontalAlignment # Don't use. Unspecified. HORIZONTAL_ALIGNMENT_UNSPECIFIED = 0 # Default value. Aligns widgets to the start position of the column. For # left-to-right layouts, aligns to the left. For right-to-left layouts, # aligns to the right. START = 1 # Aligns widgets to the center of the column. CENTER = 2 # Aligns widgets to the end position of the column. For left-to-right # layouts, aligns widgets to the right. For right-to-left layouts, aligns # widgets to the left. HorizontalAlignment::END = 3 end end |
#selection_input ⇒ ::Google::Apps::Card::V1::SelectionInput
Returns Displays a selection control that lets users select items. Selection controls can be checkboxes, radio buttons, switches, or dropdown menus.
For example, the following JSON creates a dropdown menu that lets users choose a size:
"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
}
]
}
```.
651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 |
# File 'proto_docs/google/apps/card/v1/card.rb', line 651 class Widget include ::Google::Protobuf::MessageExts extend ::Google::Protobuf::MessageExts::ClassMethods # The shape used to crop the image. # # [Google Workspace Add-ons and Chat # apps](https://developers.google.com/workspace/extend): module ImageType # Default value. Applies a square mask to the image. For example, a 4x3 # image becomes 3x3. SQUARE = 0 # Applies a circular mask to the image. For example, a 4x3 image becomes a # circle with a diameter of 3. CIRCLE = 1 end # Specifies whether widgets align to the left, right, or center of a column. # # [Google Chat apps](https://developers.google.com/workspace/chat): module HorizontalAlignment # Don't use. Unspecified. HORIZONTAL_ALIGNMENT_UNSPECIFIED = 0 # Default value. Aligns widgets to the start position of the column. For # left-to-right layouts, aligns to the left. For right-to-left layouts, # aligns to the right. START = 1 # Aligns widgets to the center of the column. CENTER = 2 # Aligns widgets to the end position of the column. For left-to-right # layouts, aligns widgets to the right. For right-to-left layouts, aligns # widgets to the left. HorizontalAlignment::END = 3 end end |
#text_input ⇒ ::Google::Apps::Card::V1::TextInput
Returns Displays a text box that users can type into.
For example, the following JSON creates a text input for an email address:
"textInput": {
"name": "mailing_address",
"label": "Mailing Address"
}
As another example, the following JSON creates a text input for a programming language with static suggestions:
"textInput": {
"name": "preferred_programing_language",
"label": "Preferred Language",
"initialSuggestions": {
"items": [
{
"text": "C++"
},
{
"text": "Java"
},
{
"text": "JavaScript"
},
{
"text": "Python"
}
]
}
}
```.
651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 |
# File 'proto_docs/google/apps/card/v1/card.rb', line 651 class Widget include ::Google::Protobuf::MessageExts extend ::Google::Protobuf::MessageExts::ClassMethods # The shape used to crop the image. # # [Google Workspace Add-ons and Chat # apps](https://developers.google.com/workspace/extend): module ImageType # Default value. Applies a square mask to the image. For example, a 4x3 # image becomes 3x3. SQUARE = 0 # Applies a circular mask to the image. For example, a 4x3 image becomes a # circle with a diameter of 3. CIRCLE = 1 end # Specifies whether widgets align to the left, right, or center of a column. # # [Google Chat apps](https://developers.google.com/workspace/chat): module HorizontalAlignment # Don't use. Unspecified. HORIZONTAL_ALIGNMENT_UNSPECIFIED = 0 # Default value. Aligns widgets to the start position of the column. For # left-to-right layouts, aligns to the left. For right-to-left layouts, # aligns to the right. START = 1 # Aligns widgets to the center of the column. CENTER = 2 # Aligns widgets to the end position of the column. For left-to-right # layouts, aligns widgets to the right. For right-to-left layouts, aligns # widgets to the left. HorizontalAlignment::END = 3 end end |
#text_paragraph ⇒ ::Google::Apps::Card::V1::TextParagraph
Returns Displays a text paragraph. Supports simple HTML formatted text. For more information about formatting text, see Formatting text in Google Chat apps and Formatting text in Google Workspace Add-ons.
For example, the following JSON creates a bolded text:
"textParagraph": {
"text": " <b>bold text</b>"
}
```.
651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 |
# File 'proto_docs/google/apps/card/v1/card.rb', line 651 class Widget include ::Google::Protobuf::MessageExts extend ::Google::Protobuf::MessageExts::ClassMethods # The shape used to crop the image. # # [Google Workspace Add-ons and Chat # apps](https://developers.google.com/workspace/extend): module ImageType # Default value. Applies a square mask to the image. For example, a 4x3 # image becomes 3x3. SQUARE = 0 # Applies a circular mask to the image. For example, a 4x3 image becomes a # circle with a diameter of 3. CIRCLE = 1 end # Specifies whether widgets align to the left, right, or center of a column. # # [Google Chat apps](https://developers.google.com/workspace/chat): module HorizontalAlignment # Don't use. Unspecified. HORIZONTAL_ALIGNMENT_UNSPECIFIED = 0 # Default value. Aligns widgets to the start position of the column. For # left-to-right layouts, aligns to the left. For right-to-left layouts, # aligns to the right. START = 1 # Aligns widgets to the center of the column. CENTER = 2 # Aligns widgets to the end position of the column. For left-to-right # layouts, aligns widgets to the right. For right-to-left layouts, aligns # widgets to the left. HorizontalAlignment::END = 3 end end |