Cards v2

Karta

Interfejs karty wyświetlany w wiadomości w Google Chat lub dodatku Google Workspace.

Karty mogą mieć zdefiniowany układ, interaktywne elementy interfejsu (np. przyciski) i multimedia, np. obrazy. Używaj kart, aby prezentować szczegółowe informacje, zbierać informacje od użytkowników i pomagać im w wykonaniu kolejnych kroków.

Projektuj karty i wyświetlaj ich podgląd za pomocą kreatora kart.

Otwórz kreator kart

Aby dowiedzieć się, jak tworzyć karty, zapoznaj się z tą dokumentacją:

Przykład: wiadomość na karcie w aplikacji Google Chat

Przykładowa wizytówka

Aby utworzyć przykładową wiadomość do karty w Google Chat, użyj tego kodu 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": "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"
                             }
                           ]
                         }
                       }
                     }
                   ]
                 }
               }
             ]
           }
         ]
       }
    }
  ]
}
Zapis JSON 
{
  "header": {
    object (CardHeader)
  },
  "sections": [
    {
      object (Section)
    }
  ],
  "sectionDividerStyle": enum (DividerStyle),
  "cardActions": [
    {
      object (CardAction)
    }
  ],
  "name": string,
  "fixedFooter": {
    object (CardFixedFooter)
  },
  "displayStyle": enum (DisplayStyle),
  "peekCardHeader": {
    object (CardHeader)
  }
}
Pola
header

object (CardHeader)

Nagłówek karty. Nagłówek zwykle zawiera obraz początkowy i tytuł. Nagłówki są zawsze wyświetlane na górze karty.

sections[]

object (Section)

Zawiera kolekcję widżetów. Każda sekcja ma własny, opcjonalny nagłówek. Sekcje są wizualnie oddzielone linią. Przykład dotyczący aplikacji Google Chat znajdziesz tutaj: Zdefiniuj sekcję karty.

sectionDividerStyle

enum (DividerStyle)

Styl podziału między sekcjami.

cardActions[]

object (CardAction)

Działania na karcie. Działania są dodawane do menu na pasku narzędzi karty.

Dostępne w przypadku dodatków do Google Workspace i niedostępne w aplikacjach Google Chat.

Na przykład ten plik JSON tworzy menu czynności karty z Settings oraz Send Feedback opcje: 

"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

Nazwa karty. Używany jako identyfikator karty w nawigacji po kartach.

Dostępne w przypadku dodatków do Google Workspace i niedostępne w aplikacjach Google Chat.

displayStyle

enum (DisplayStyle)

W Dodatkach do Google Workspace ustawia właściwości wyświetlania peekCardHeader

Dostępne w przypadku dodatków do Google Workspace i niedostępne w aplikacjach Google Chat.

peekCardHeader

object (CardHeader)

Podczas wyświetlania treści kontekstowych nagłówek karty podglądu pełni funkcję obiektu zastępczego, dzięki któremu użytkownik może przechodzić między kartami na stronie głównej a kartami kontekstowymi.

Dostępne w przypadku dodatków do Google Workspace i niedostępne w aplikacjach Google Chat.

CardHeader

Reprezentuje nagłówek karty. Przykład dotyczący aplikacji Google Chat znajdziesz tutaj: Dodaj nagłówek.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

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

string

Wymagane. Tytuł nagłówka karty. Nagłówek ma stałą wysokość: jeśli określono zarówno tytuł, jak i podtytuł, każdy z nich zajmuje po jednym wierszu. Jeśli określono tylko tytuł, tekst zajmuje oba wiersze.

subtitle

string

Podtytuł nagłówka karty. Jeśli została określona, pojawia się w osobnym wierszu pod nagłówkiem title

imageType

enum (ImageType)

Kształt użyty do przycięcia obrazu.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

imageUrl

string

Adres URL HTTPS obrazu w nagłówku karty.

imageAltText

string

Alternatywny tekst tego obrazu używany w ułatwieniach dostępu.

ImageType

Kształt użyty do przycięcia obrazu.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Wartości w polu enum
SQUARE Wartość domyślna. Stosuje do obrazu maskę kwadratową. Na przykład obraz o wymiarach 4 x 3 zmieni się na 3 x 3.
CIRCLE Stosuje do obrazu okrągłą maskę. Na przykład obraz o wymiarach 4 x 3 zmieni się w okrąg o średnicy 3 pikseli.

Sekcja

Sekcja zawiera zbiór widżetów, które są renderowane w pionie w określonej kolejności.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis JSON 
{
  "header": string,
  "widgets": [
    {
      object (Widget)
    }
  ],
  "collapsible": boolean,
  "uncollapsibleWidgetsCount": integer,
  "collapseControl": {
    object (CollapseControl)
  }
}
Pola
header

string

Tekst widoczny u góry sekcji. Obsługuje prosty tekst w formacie HTML. Więcej informacji o formatowaniu tekstu znajdziesz w sekcji Formatowanie tekstu w aplikacjach Google Chat oraz Formatowanie tekstu w dodatkach do Google Workspace

widgets[]

object (Widget)

Wszystkie widżety w sekcji. Musi zawierać co najmniej jeden widżet.

collapsible

boolean

Wskazuje, czy sekcję można zwijać.

Zwijane sekcje ukrywają niektóre lub wszystkie widżety, ale użytkownicy mogą rozwinąć sekcję, aby pokazać ukryte widżety, klikając Pokaż więcej. Użytkownicy mogą ponownie ukryć widżety, klikając Pokaż mniej.

Aby określić, które widżety są ukryte, wpisz uncollapsibleWidgetsCount

uncollapsibleWidgetsCount

integer

Liczba widżetów niezwijanych, które pozostają widoczne nawet po zwinięciu sekcji.

Na przykład, jeśli sekcja zawiera pięć widżetów, a sekcja uncollapsibleWidgetsCount jest ustawiona na 2, pierwsze dwa widżety są zawsze widoczne, a trzy ostatnie są domyślnie zwinięte. uncollapsibleWidgetsCount jest brany pod uwagę tylko wtedy, collapsible to true

collapseControl

object (CollapseControl)

Opcjonalnie: Zdefiniuj przycisk rozwijania i zwijania sekcji. Ten przycisk jest widoczny tylko w przypadku zwijania sekcji. Jeśli to pole nie jest skonfigurowane, używany jest przycisk domyślny. Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Widżet

Każda karta składa się z widżetów.

Widżet to obiekt złożony, który może reprezentować tekst, obrazy, przyciski i inne typy obiektów.

Zapis 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)
  },
  "chipList": {
    object (ChipList)
  }
  // End of list of possible types for union field data.
}
Pola
horizontalAlignment

enum (HorizontalAlignment)

Określa, czy widżety mają być wyrównane do lewej, prawej czy do środka kolumny.

Pole sumy data Widżet może zawierać tylko jeden z tych elementów. Aby wyświetlić więcej elementów, możesz użyć wielu pól widżetu. data może być tylko jednym z tych elementów:
textParagraph

object (TextParagraph)

Wyświetla akapit tekstu. Obsługuje prosty tekst w formacie HTML. Więcej informacji o formatowaniu tekstu znajdziesz w sekcji Formatowanie tekstu w aplikacjach Google Chat oraz Formatowanie tekstu w dodatkach do Google Workspace

Na przykład następujący kod JSON tworzy pogrubiony tekst: 

"textParagraph": {
  "text": "  <b>bold text</b>"
}
image

object (Image)

Wyświetla obraz.

Na przykład ten kod JSON tworzy obraz z tekstem alternatywnym: 

"image": {
  "imageUrl":
  "https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png",
  "altText": "Chat app avatar"
}
decoratedText

object (DecoratedText)

Wyświetla ozdobiony element tekstowy.

Na przykład ten plik JSON tworzy widżet dekorowanego tekstu z adresem e-mail: 

"decoratedText": {
  "icon": {
    "knownIcon": "EMAIL"
  },
  "topLabel": "Email Address",
  "text": "sasha@example.com",
  "bottomLabel": "This is a new Email address!",
  "switchControl": {
    "name": "has_send_welcome_email_to_sasha",
    "selected": false,
    "controlType": "CHECKBOX"
  }
}
buttonList

object (ButtonList)

Lista przycisków.

Na przykład ten plik JSON tworzy 2 przyciski. Pierwszy to niebieski przycisk tekstowy, a drugi to przycisk obrazu, który otwiera link: 

"buttonList": {
  "buttons": [
    {
      "text": "Edit",
      "color": {
        "red": 0,
        "green": 0,
        "blue": 1,
      },
      "disabled": true,
    },
    {
      "icon": {
        "knownIcon": "INVITE",
        "altText": "check calendar"
      },
      "onClick": {
        "openLink": {
          "url": "https://example.com/calendar"
        }
      }
    }
  ]
}
textInput

object (TextInput)

Wyświetla pole tekstowe, w którym użytkownicy mogą pisać.

Na przykład ten plik JSON tworzy pole tekstowe adresu e-mail: 

"textInput": {
  "name": "mailing_address",
  "label": "Mailing Address"
}

Kolejny przykład to przykładowy kod JSON, który tworzy pole tekstowe dla języka programowania ze statycznymi sugestiami: 

"textInput": {
  "name": "preferred_programing_language",
  "label": "Preferred Language",
  "initialSuggestions": {
    "items": [
      {
        "text": "C++"
      },
      {
        "text": "Java"
      },
      {
        "text": "JavaScript"
      },
      {
        "text": "Python"
      }
    ]
  }
}
selectionInput

object (SelectionInput)

Wyświetla element sterujący, który umożliwia użytkownikom wybieranie elementów. Elementy sterujące zaznaczaniem mogą być polami wyboru, opcjami, przełącznikami i menu.

Na przykład ten plik JSON tworzy menu, które pozwala użytkownikom wybrać rozmiar: 

"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)

Wyświetla widżet, który umożliwia użytkownikom wpisanie daty, godziny lub daty i godziny.

Na przykład ten plik JSON tworzy selektor daty i godziny w celu zaplanowania spotkania: 

"dateTimePicker": {
  "name": "appointment_time",
  "label": "Book your appointment at:",
  "type": "DATE_AND_TIME",
  "valueMsEpoch": "796435200000"
}
divider

object (Divider)

Wyświetla poziomą linię między widżetami.

Na przykład ten kod JSON tworzy separator: 

"divider": {
}
grid

object (Grid)

Wyświetla siatkę z kolekcją elementów.

Siatka może zawierać dowolną liczbę kolumn i elementów. Liczba wierszy jest określana przez górne granice liczby elementów podzielone przez liczbę kolumn. Siatka z 10 elementami i 2 kolumnami ma 5 wierszy. Siatka z 11 elementami i 2 kolumnami ma 6 wierszy.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Na przykład ten plik JSON tworzy siatkę z 2 kolumnami z jednym elementem: 

"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)

Wyświetla maksymalnie 2 kolumny.

Aby uwzględnić więcej niż 2 kolumny lub użyć wierszy, użyj funkcji Grid widżet.

Na przykład ten plik JSON tworzy 2 kolumny, z których każda zawiera akapity: 

"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"
          }
        }
      ]
    }
  ]
}
chipList

object (ChipList)

Lista elementów.

Na przykład ten plik JSON tworzy 2 elementy. Pierwszy to element tekstowy, a drugi to element ikony, który umożliwia otwarcie linku: 

"chipList": {
  "chips": [
    {
      "text": "Edit",
      "disabled": true,
    },
    {
      "icon": {
        "knownIcon": "INVITE",
        "altText": "check calendar"
      },
      "onClick": {
        "openLink": {
          "url": "https://example.com/calendar"
        }
      }
    }
  ]
}

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

TextParagraph

Akapit z tekstem, który można sformatować. Przykład dotyczący aplikacji Google Chat znajdziesz tutaj: Dodaj akapit sformatowanego tekstu. Więcej informacji o formatowaniu tekstu znajdziesz w sekcji Formatowanie tekstu w aplikacjach Google Chat oraz Formatowanie tekstu w dodatkach do Google Workspace

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis JSON 
{
  "text": string,
  "maxLines": integer
}
Pola
text

string

Tekst wyświetlany w widżecie.

maxLines

integer

Maksymalna liczba wierszy tekstu wyświetlanych w widżecie. Jeśli tekst przekracza określoną maksymalną liczbę wierszy, nadmiarowe treści są ukryte za pokaż więcej Przycisk Jeśli tekst jest równy lub krótszy niż określona maksymalna liczba wierszy, funkcja pokaż więcej nie jest wyświetlany.

Wartość domyślna to 0. W takim przypadku widoczny jest cały kontekst. Wartości ujemne są ignorowane. Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Obraz

Obraz, który został określony za pomocą adresu URL i może mieć atrybut onClick działania. Na przykład zobacz Dodaj obraz.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis JSON 
{
  "imageUrl": string,
  "onClick": {
    object (OnClick)
  },
  "altText": string
}
Pola
imageUrl

string

Adres URL HTTPS, który hostuje obraz.

Na przykład: 

https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png
onClick

object (OnClick)

Gdy użytkownik kliknie obraz, kliknięcie wywoła to działanie.

altText

string

Alternatywny tekst tego obrazu używany w ułatwieniach dostępu.

OnClick

Wskazuje, jak zareagować, gdy użytkownik kliknie interaktywny element na karcie, np. przycisk.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis JSON 
{

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

Pole sumy data

data może być tylko jednym z tych elementów:

action

object (Action)

Jeśli określisz działanie, będzie ono wywoływane przez onClick

card

object (Card)

Nowa karta jest przekazywana do stosu kart po kliknięciu, jeśli została określona.

Dostępne w przypadku dodatków do Google Workspace i niedostępne w aplikacjach Google Chat.

overflowMenu

object (OverflowMenu)

Jeśli zostanie określony, onClick otwiera rozszerzone menu. Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Działanie

Działanie opisujące zachowanie po przesłaniu formularza. Możesz na przykład wywołać skrypt Apps Script do obsługi formularza. Jeśli działanie zostanie wywołane, wartości z formularza zostaną przesłane do serwera.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

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

string

Funkcja niestandardowa wywoływana po kliknięciu lub w inny sposób aktywowanego elementu zawierającego jej treść.

Na przykład informacje o wykorzystaniu znajdziesz w artykule Odczytywanie danych formularzy.

parameters[]

object (ActionParameter)

Lista parametrów działań.

loadIndicator

enum (LoadIndicator)

Określa wskaźnik wczytywania, który wyświetla się podczas wezwania do działania.

persistValues

boolean

Wskazuje, czy wartości formularza utrzymują się po wykonaniu działania. Wartość domyślna to false

Jeśli true, wartości formularza pozostają po wywołaniu działania. Aby umożliwić użytkownikowi wprowadzanie zmian w trakcie przetwarzania działania, ustaw: LoadIndicator do NONE Dla: wiadomości z kart w aplikacjach do obsługi czatu, musisz też ustawić działanie ResponseType. do UPDATE_MESSAGE i użyj tych samych wartości cardId z karty, która zawiera działanie.

Jeśli false, wartości formularza są wyczyszczone po wywołaniu działania. Aby uniemożliwić użytkownikowi wprowadzanie zmian podczas przetwarzania działania, ustaw LoadIndicator do SPINNER

interaction

enum (Interaction)

Opcjonalnie: Wymagane przy otwieraniu okno.

Co zrobić w reakcji na interakcję z użytkownikiem, np. kliknięcie przycisku w wiadomości na karcie.

Jeśli nie określono inaczej, aplikacja zareaguje, wykonując action – np. otwarcie linku lub uruchomienie funkcji.

Określając parametr interaction, aplikacja może odpowiadać w specjalny sposób interaktywny. Na przykład: interaction do OPEN_DIALOG, aplikacja może otwierać okno. Jeśli ją określisz, wskaźnik wczytywania nie będzie się wyświetlał. Jeśli określisz dodatek w przypadku dodatku, cała karta będzie usunięta i nic nie będzie widoczne w kliencie.

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

requiredWidgets[]

string

. Opcjonalna. Wypełnij tę listę nazwami widżetów, których ta akcja potrzebuje do prawidłowego przesłania zgłoszenia.

Jeśli wymienione tu widżety nie mają wartości w momencie wywołania tego działania, przesyłanie formularza jest przerywane.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

allWidgetsAreRequired

boolean

. Opcjonalna. Jeśli tak, wszystkie widżety są uznawane za wymagane w ramach tego działania.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

ActionParameter

Lista parametrów ciągu znaków, które mają być podawane po wywołaniu metody działania. Weźmy na przykład 3 przyciski drzemki: Odłóż teraz, Odłóż w przypadku jednego dnia i Odłóż w przyszłym tygodniu. Możesz użyć action method = snooze() przekazuje typ drzemki i czas drzemki na liście parametrów ciągu znaków.

Więcej informacji: CommonEventObject

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis JSON 
{
  "key": string,
  "value": string
}
Pola
key

string

Nazwa parametru skryptu działania.

value

string

Wartość parametru.

LoadIndicator

Określa wskaźnik wczytywania, który wyświetla się podczas wezwania do działania.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Wartości w polu enum
SPINNER Wyświetla wskaźnik postępu ładowania treści.
NONE Nic nie jest wyświetlane.

Interakcja

Opcjonalnie: Wymagane przy otwieraniu okno.

Co zrobić w reakcji na interakcję z użytkownikiem, np. kliknięcie przycisku w wiadomości na karcie.

Jeśli nie określono inaczej, aplikacja zareaguje, wykonując action – np. otwarcie linku lub uruchomienie funkcji.

Określając parametr interaction, aplikacja może odpowiadać w specjalny sposób interaktywny. Na przykład: interaction do OPEN_DIALOG, aplikacja może otwierać okno.

Jeśli ją określisz, wskaźnik wczytywania nie będzie się wyświetlał. Jeśli określisz dodatek w przypadku dodatku, cała karta będzie usunięta i nic nie będzie widoczne w kliencie.

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Wartości w polu enum
INTERACTION_UNSPECIFIED Wartość domyślna. action jest wykonywane normalnie.
OPEN_DIALOG

Otwiera okno – okna, opartego na kartach interfejsu, którego aplikacje Google Chat używają do interakcji z użytkownikami.

Obsługiwane tylko przez aplikacje do obsługi czatu w odpowiedzi na kliknięcia przycisków w wiadomościach dotyczących kart. Jeśli określisz dodatek w przypadku dodatku, cała karta będzie usunięta i nic nie będzie widoczne w kliencie.

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

OpenAs

Gdy OnClick otwiera link, a klient może otworzyć go jako okno pełnowymiarowe (jeśli to ramka używana przez klienta) lub jako nakładkę (np. wyskakujące okienko). Implementacja zależy od możliwości platformy klienta, a wybrana wartość może być ignorowana, jeśli klient jej nie obsługuje. FULL_SIZE jest obsługiwany przez wszystkich klientów.

Dostępne w przypadku dodatków do Google Workspace i niedostępne w aplikacjach Google Chat.

Wartości w polu enum
FULL_SIZE Link zostanie otwarty jako pełnowymiarowe okno (jeśli to ramka używana przez klienta).
OVERLAY Link otwiera się jako nakładka, np. w wyskakującym okienku.

OnClose

Co robi klient, gdy link otwiera się przez OnClick działanie jest zamknięte.

Wdrożenie zależy od możliwości platformy klienta. Na przykład przeglądarka może otworzyć link w wyskakującym okienku z OnClose .

Jeśli oba OnOpen oraz OnClose a platforma kliencka nie może obsługiwać obu wartości, OnClose ma pierwszeństwo.

Dostępne w przypadku dodatków do Google Workspace i niedostępne w aplikacjach Google Chat.

Wartości w polu enum
NOTHING Wartość domyślna. Karta nie wczytuje się ponownie. nic się nie dzieje.
RELOAD

Wczytuje kartę ponownie po zamknięciu okna podrzędnego.

W połączeniu z OpenAs.OVERLAY, okno podrzędne działa jak okno modalne, a karta nadrzędna jest blokowana do momentu zamknięcia okna podrzędnego.

OverflowMenu

Widżet wyświetlający wyskakujące menu z co najmniej 1 działaniem, które użytkownicy mogą wywołać. Dotyczy to na przykład wyświetlania na karcie działań innych niż główne. Możesz użyć tego widżetu, gdy działania nie mieszczą się w dostępnym miejscu. Aby go użyć, określ ten widżet w sekcji OnClick na widżetach, które je obsługują. Na przykład w parametrze Button

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Zapis JSON 
{
  "items": [
    {
      object (OverflowMenuItem)
    }
  ]
}
Pola
items[]

object (OverflowMenuItem)

Wymagane. Lista opcji menu.

OverflowMenuItem

. Opcja, którą użytkownicy mogą wywołać z rozszerzonego menu.

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Zapis JSON 
{
  "startIcon": {
    object (Icon)
  },
  "text": string,
  "onClick": {
    object (OnClick)
  },
  "disabled": boolean
}
Pola
startIcon

object (Icon)

Ikona wyświetlana przed tekstem.

text

string

Wymagane. Tekst, który identyfikuje lub opisuje produkt użytkownikom.

onClick

object (OnClick)

Wymagane. Działanie jest wywoływane po wybraniu opcji menu. Ten OnClick nie może zawierać OverflowMenu, dowolny określony OverflowMenu zostanie usunięte, a pozycja menu wyłączona.

disabled

boolean

Określa, czy opcja menu jest wyłączona. Wartość domyślna to fałsz.

Ikona

Ikona wyświetlana w widżecie na karcie. Przykład dotyczący aplikacji Google Chat znajdziesz tutaj: Dodaj ikonę.

Obsługiwane wbudowany oraz niestandardowy .

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis 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.
}
Pola
altText

string

Opcjonalnie: Opis ikony używanej w ułatwieniach dostępu. Jeśli wartość nie zostanie określona, zostanie użyta wartość domyślna Button Najlepiej jest ustawić przydatny opis zawartości ikony i – w odpowiednich przypadkach – do czego służy. Przykład: A user's account portrait lub Opens a new browser tab and navigates to the Google Chat developer documentation at https://developers.google.com/workspace/chat

Jeśli ikona jest ustawiona w Button, altText pojawia się jako tekst pomocniczy, gdy użytkownik najedzie kursorem na przycisk. Jeśli jednak przycisk text, ikona altText jest ignorowany.

imageType

enum (ImageType)

Styl przycinania zastosowany do obrazu. W niektórych przypadkach zastosowanie CIRCLE przycięcie powoduje, że rysowany obraz jest większy niż wbudowana ikona.

Pole sumy icons Ikona wyświetlana w widżecie na karcie. icons może być tylko jednym z tych elementów:
knownIcon

string

Wyświetl jedną z wbudowanych ikon dostępnych w Google Workspace.

Na przykład, aby wyświetlić ikonę samolotu, wpisz AIRPLANE W przypadku autobusu wpisz BUS

Pełną listę obsługiwanych ikon znajdziesz w sekcji wbudowanych ikon.

iconUrl

string

wyświetlać ikonę niestandardową pod adresem URL HTTPS.

Na przykład: 

"iconUrl":
"https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png"

Obsługiwane typy plików obejmują .png oraz .jpg

materialIcon

object (MaterialIcon)

Wyświetl jedną z Ikony Material Google.

Aby na przykład wyświetlić ikonę pola wyboru, użyj 

"materialIcon": {
  "name": "check_box"
}

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

MaterialIcon

O Ikona Google Material Design, która obejmuje ponad 2500 opcji.

Aby na przykład wyświetlić ikonę pola wyboru z dostosowanym wagą i stopniem, napisz: 

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

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Zapis JSON 
{
  "name": string,
  "fill": boolean,
  "weight": integer,
  "grade": integer
}
Pola
name

string

Nazwa ikony zdefiniowana w Google Material Icon, check_box Wszelkie nieprawidłowe nazwy zostaną porzucone i zastąpione pustym ciągiem znaków, co spowoduje błąd renderowania ikony.

fill

boolean

Określa, czy ikona jest wyświetlana jako wypełniona. Wartość domyślna to false.

Aby zobaczyć podgląd różnych ustawień ikon, otwórz Ikony czcionek Google i dostosuj ustawienia w sekcji Dostosuj.

weight

integer

Grubość kreski ikony. Masz do wyboru opcje: {100, 200, 300, 400, 500, 600, 700}. Jeśli go nie podano, domyślną wartością jest 400. Jeśli podasz inną wartość, zostanie użyta wartość domyślna.

Aby zobaczyć podgląd różnych ustawień ikon, otwórz Ikony czcionek Google i dostosuj ustawienia w sekcji Dostosuj.

grade

integer

Waga i stopień wpływają na grubość symbolu. Zmiany oceny są bardziej szczegółowe niż korekty wagi i mają niewielki wpływ na wielkość symbolu. Masz do wyboru {-25, 0, 200}. Jeśli go nie podano, domyślną wartością jest 0. Jeśli podasz inną wartość, zostanie użyta wartość domyślna.

Aby zobaczyć podgląd różnych ustawień ikon, otwórz Ikony czcionek Google i dostosuj ustawienia w sekcji Dostosuj.

DecoratedText

Widżet z tekstem, z opcjonalnymi dekoracjami, takimi jak etykieta nad lub pod tekstem, ikona przed tekstem, widżet wyboru lub przycisk po tekście. Przykład dotyczący aplikacji Google Chat znajdziesz tutaj: Wyświetlaj tekst z tekstem dekoracyjnym.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis 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.
}
Pola
icon
(deprecated)

object (Icon)

Wycofano, zastępując startIcon

startIcon

object (Icon)

Ikona wyświetlana przed tekstem.

topLabel

string

Tekst widoczny powyżej text Zawsze skraca.

text

string

Wymagane. Tekst główny.

Obsługuje proste formatowanie. Więcej informacji o formatowaniu tekstu znajdziesz w sekcji Formatowanie tekstu w aplikacjach Google Chat oraz Formatowanie tekstu w dodatkach do Google Workspace

wrapText

boolean

Ustawienie zawijania tekstu. Jeśli true, tekst zawija się i wyświetla w kilku wierszach. W przeciwnym razie tekst zostanie obcięty.

Dotyczy tylko text, nie topLabel oraz bottomLabel

bottomLabel

string

Tekst widoczny poniżej text Zawsze zawija.

onClick

object (OnClick)

To działanie jest wywoływane, gdy użytkownik kliknie topLabel lub bottomLabel

Pole sumy control Przycisk, przełącznik, pole wyboru lub obraz wyświetlany po prawej stronie tekstu w decoratedText widżet. control może być tylko jednym z tych elementów:
button

object (Button)

Przycisk, który użytkownik może kliknąć, aby wywołać działanie.

switchControl

object (SwitchControl)

Widżet przełączania, który użytkownik może kliknąć, aby zmienić swój stan i wywołać działanie.

endIcon

object (Icon)

Ikona wyświetlana po tekście.

Obsługiwane wbudowany oraz niestandardowy .

Przycisk

Tekst, ikona lub przycisk z tekstem i ikoną, który użytkownicy mogą kliknąć. Przykład dotyczący aplikacji Google Chat znajdziesz tutaj: Dodaj przycisk.

Aby przekształcić obraz w klikalny przycisk, podaj w atrybucie Image (nie ImageComponent) i ustaw wartość onClick działania.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis JSON 
{
  "text": string,
  "icon": {
    object (Icon)
  },
  "color": {
    object (Color)
  },
  "onClick": {
    object (OnClick)
  },
  "disabled": boolean,
  "altText": string,
  "type": enum (Type)
}
Pola
text

string

Tekst wyświetlany na przycisku.

icon

object (Icon)

Ikona wyświetlana wewnątrz przycisku. Jeśli oba icon oraz text zostanie ustawiona, ikona pojawi się przed tekstem.

color

object (Color)

Opcjonalnie: Kolor przycisku. Jeśli jest ustawiony, przycisk type jest ustawiona na FILLED oraz kolor text oraz icon mają kontrastowy kolor, aby zwiększyć czytelność. Jeśli na przykład kolor przycisku jest niebieski, wszystkie fragmenty tekstu i ikony na przycisku są białe.

Aby ustawić kolor przycisku, podaj w atrybucie red, green i blue . Wartość musi być liczbą zmiennoprzecinkową z zakresu od 0 do 1 na podstawie wartości koloru RGB, gdzie 0 (0/255) oznacza brak koloru i 1 (255/255) reprezentuje maksymalną intensywność koloru.

W przykładzie poniżej pokazujemy, że kolor jest czerwony z maksymalną intensywnością: 

"color": {
   "red": 1,
   "green": 0,
   "blue": 0,
}

alpha pole jest niedostępne dla koloru przycisku. Jeśli pole jest określone, jest ignorowane.

onClick

object (OnClick)

Wymagane. Działanie, które ma być wykonywane po kliknięciu przycisku przez użytkownika, na przykład otwarcie hiperlinku lub uruchomienie funkcji niestandardowej.

disabled

boolean

Jeśli true, przycisk jest wyświetlany w stanie nieaktywnym i nie reaguje na działania użytkownika.

altText

string

Tekst alternatywny używany w ułatwieniach dostępu.

Ustaw opis, który poinformuje użytkowników o działaniu przycisku. Jeśli na przykład przycisk otwiera hiperlink, możesz napisać: „Otwiera nową kartę przeglądarki i przechodzi do dokumentacji Google Chat dla deweloperów na stronie https://developers.google.com/workspace/chat&quot;.

type

enum (Type)

Opcjonalnie: Typ przycisku. Jeśli zasada jest nieskonfigurowana, domyślnym typem przycisku jest OUTLINED Jeśli color jest ustawiony, typ przycisku musi być FILLED i wszelkie wartości ustawione w tym polu będą ignorowane.

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Kolor

Reprezentuje kolor w przestrzeni kolorów RGBA. Ta reprezentacja ma na celu uproszczenie procesu konwersji i zmiany kolorów w różnych językach, a nie ich kompaktowości. Na przykład pola tej reprezentacji można w prosty sposób przekazać do konstruktora java.awt.Color w języku Java; można ją też trywialnie przekazywać do interfejsu UIColor +colorWithRed:green:blue:alpha w systemie iOS. a przy niewielkim nakładzie pracy można go łatwo sformatować do formatu CSS rgba() w JavaScripcie.

Na tej stronie referencyjnej nie ma informacji o bezwzględnej przestrzeni kolorów, która powinna być wykorzystywana do interpretacji wartości RGB, np. sRGB, Adobe RGB, DCI-P3 i BT.2020. Domyślnie aplikacje powinny przyjąć przestrzeń kolorów sRGB.

Gdy należy ustalić równość kolorów, implementacje (o ile nie udokumentowano inaczej) traktuje 2 kolory jako równe, jeśli wszystkie ich wartości czerwonego, zielonego, niebieskiego i alfa różnią się co najmniej o maksymalnie 1e-5

Przykład (Java): 

 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();
 }
 // ...

Przykład (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;
}
// ...

Przykład (JavaScript): 

// ...

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('');
};

// ...
Zapis JSON 
{
  "red": number,
  "green": number,
  "blue": number,
  "alpha": number
}
Pola
red

number

Ilość czerwonego koloru jako wartość z przedziału [0, 1].

green

number

Ilość zielonego koloru jako wartość przedziału [0, 1].

blue

number

Ilość niebieskiego koloru jako wartość z przedziału [0, 1].

alpha

number

Część tego koloru, która powinna zostać zastosowana do piksela. Oznacza to, że końcowy kolor w pikselach jest określony za pomocą tego równania:

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

Oznacza to, że wartość 1,0 odpowiada jednolitym kolorowi, a wartość 0,0 – kolorowi całkowicie przezroczystemu. Wykorzystuje komunikat opakowany, a nie prosty zmiennoprzecinkowy element skalarny, dzięki czemu można odróżnić wartość domyślną od nieskonfigurowanej wartości. Jeśli ten obiekt koloru zostanie pominięty, będzie on renderowany jako jednolity kolor (jak gdyby wartość alfa miała jednoznacznie przypisaną wartość 1,0).

Typ

Opcjonalnie: type jednego przycisku. Jeśli color wartość pola jest ustawiona, type zmuszony do FILLED

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Wartości w polu enum
TYPE_UNSPECIFIED Nie używaj. Nie określono.
OUTLINED Przyciski z konturem to przyciski ze średnim natężeniem nacisku. Zazwyczaj zawierają one ważne działania, ale nie są głównymi działaniami w aplikacji Google Chat ani dodatku.
FILLED Wypełniony przycisk ma pojemnik w jednolitym kolorze. Ma on największy wpływ wizualny i jest zalecany w przypadku ważnego i głównego działania w aplikacji Google Chat lub dodatku.
FILLED_TONAL Wypełniony przycisk tonalny stanowi alternatywny środek pomiędzy wypełnionymi i zarysowanymi przyciskami. Są przydatne w sytuacjach, gdy przycisk o niższym priorytecie wymaga nieco większego podkreślenia niż przycisk konturu.
BORDERLESS Przycisk nie ma niewidocznego kontenera w stanie domyślnym. Często używa się go w przypadku działań o najniższym priorytecie, zwłaszcza wtedy, gdy prezentujesz wiele opcji.

SwitchControl

Przełącznik typu przełącznika lub pole wyboru w decoratedText widżet.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Obsługiwane tylko w decoratedText widżet.

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

string

Nazwa, według której widżet przełącznika jest identyfikowany w zdarzeniu wprowadzania danych w formularzu.

Szczegółowe informacje o pracy z danymi wejściowymi formularza znajdziesz w artykule Odbieranie danych formularzy.

value

string

Wartość wpisana przez użytkownika, zwrócona w ramach zdarzenia wprowadzania danych w formularzu.

Szczegółowe informacje o pracy z danymi wejściowymi formularza znajdziesz w artykule Odbieranie danych formularzy.

selected

boolean

Kiedy true, przełącznik jest wybrany.

onChangeAction

object (Action)

Działanie, które ma zostać wykonane po zmianie stanu przełącznika, np. która funkcja ma zostać uruchomiona.

controlType

enum (ControlType)

Wygląd przełącznika w interfejsie.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

ControlType

Wygląd przełącznika w interfejsie.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Wartości w polu enum
SWITCH Przełącznik w stylu przełącznika.
CHECKBOX Wycofano, zastępując CHECK_BOX
CHECK_BOX Pole wyboru.

ButtonList

Lista przycisków rozmieszczonych poziomo. Przykład dotyczący aplikacji Google Chat znajdziesz tutaj: Dodaj przycisk.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis JSON 
{
  "buttons": [
    {
      object (Button)
    }
  ]
}
Pola
buttons[]

object (Button)

Tablica przycisków.

TextInput

Pole, w którym użytkownicy mogą wpisywać tekst. obsługuje sugestie i działania w odpowiedzi na zmiany. Przykład dotyczący aplikacji Google Chat znajdziesz tutaj: Dodaj pole, w którym użytkownik może wpisywać tekst

Aplikacje do obsługi czatu odbierają i mogą przetwarzać wartość wpisanego tekstu podczas zdarzeń wprowadzania danych w formularzu. Szczegółowe informacje o pracy z danymi wejściowymi formularza znajdziesz w artykule Odbieranie danych formularzy.

Jeśli chcesz zebrać nieokreślone lub abstrakcyjne dane od użytkowników, użyj wprowadzania tekstowego. Aby zbierać zdefiniowane lub określone dane od użytkowników, użyj funkcji SelectionInput widżet.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis 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
}
Pola
name

string

Nazwa, pod którą wpisany tekst jest rozpoznawany w zdarzeniu wprowadzania tekstu.

Szczegółowe informacje o pracy z danymi wejściowymi formularza znajdziesz w artykule Odbieranie danych formularzy.

label

string

Tekst wyświetlany nad polem do wprowadzania tekstu w interfejsie.

Podaj tekst, który pomoże użytkownikowi podać informacje, których potrzebuje Twoja aplikacja. Jeśli na przykład pytasz kogoś o imię, a konkretnie nazwiska, wpisz surname zamiast name

Wymagany, jeśli hintText nie określono. W przeciwnym razie jest to opcjonalne.

hintText

string

Tekst wyświetlany pod polem do wprowadzania tekstu, który ma ułatwić użytkownikom wpisanie określonej wartości. Ten tekst jest zawsze widoczny.

Wymagany, jeśli label nie określono. W przeciwnym razie jest to opcjonalne.

value

string

Wartość wpisana przez użytkownika, zwrócona w ramach zdarzenia wprowadzania danych w formularzu.

Szczegółowe informacje o pracy z danymi wejściowymi formularza znajdziesz w artykule Odbieranie danych formularzy.

type

enum (Type)

Sposób wyświetlania pola do wprowadzania tekstu w interfejsie. na przykład czy to pole jest jedno- czy wielowierszowe.

onChangeAction

object (Action)

Co zrobić, gdy nastąpi zmiana w polu do wprowadzania tekstu Może to być na przykład dodanie do pola lub usunięcie tekstu.

Przykładowe działania to uruchomienie funkcji niestandardowej lub otwarcie okno w Google Chat.

initialSuggestions

object (Suggestions)

Sugerowane wartości, które użytkownicy mogą wpisać. Te wartości pojawiają się po kliknięciu przez użytkownika pola do wprowadzania tekstu. W miarę pisania przez użytkowników sugerowane wartości są dynamicznie filtrowane zgodnie z tym, co wpisali użytkownicy.

Na przykład pole tekstowe do wprowadzania danych w języku programowania może sugerować Java, JavaScript, Python i C++. Gdy użytkownicy zaczną pisać Jav, listę filtrów sugestii, które pozwalają wyświetlać tylko Java oraz JavaScript

Sugerowane wartości pomagają zachęcać użytkowników do wpisywania wartości, które Twoja aplikacja może zrozumieć. W przypadku JavaScriptu niektórzy użytkownicy mogą wpisać javascript i inne java script Sugerowanie JavaScript pozwalają ustandaryzować sposób, w jaki użytkownicy korzystają z aplikacji.

Jeśli określisz parametr, TextInput.type to zawsze SINGLE_LINE, nawet jeśli ustawiona jest wartość MULTIPLE_LINE

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

autoCompleteAction

object (Action)

Opcjonalnie: Określ, co ma się stać, gdy pole do wprowadzania tekstu będzie podpowiadać użytkownikom, którzy z niego korzystają.

Jeśli nie określono inaczej, sugestie będą generowane przez initialSuggestions i przetwarzane przez klienta.

Jeśli określisz działanie, aplikacja wykona określone tutaj działanie, np. uruchomi funkcję niestandardową.

Dostępne w przypadku dodatków do Google Workspace i niedostępne w aplikacjach Google Chat.

validation

object (Validation)

. Określ weryfikację niezbędną dla tego pola tekstowego.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

placeholderText

string

Tekst, który pojawia się w polu do wprowadzania tekstu, gdy pole jest puste. Wpisz w nim wartość, korzystając z tego tekstu. Przykład: Enter a number from 0 to 100

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Typ

Sposób wyświetlania pola do wprowadzania tekstu w interfejsie. Może to być na przykład jednowierszowe pole do wprowadzania danych lub pole do wprowadzania danych wielowierszowych. Jeśli initialSuggestions , type to zawsze SINGLE_LINE, nawet jeśli ustawiona jest wartość MULTIPLE_LINE

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Wartości w polu enum
SINGLE_LINE Pole do wprowadzania tekstu ma stałą wysokość 1 wiersza.
MULTIPLE_LINE Pole do wprowadzania tekstu ma stałą wysokość wielu wierszy.

RenderActions

zestaw instrukcji renderowania, które informują kartę, że ma wykonać określone działanie; informuje aplikację hosta dodatku lub aplikację Google Chat, aby wykonała specyficzne działanie dla aplikacji.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Pola
action

Action

Działanie

Pola
navigations[]

Navigation

Przekaż lub zaktualizuj wyświetlone karty.

Dodaj nową kartę do stosu (przejdź dalej). W przypadku aplikacji do obsługi czatu dostępne tylko na stronie głównej aplikacji.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

navigations: {
  pushCard: CARD
}

Zastąp górną kartę nową kartą. W przypadku aplikacji do obsługi czatu dostępne tylko na stronie głównej aplikacji.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

navigations: {
  updateCard: CARD
}

Sugestie

Sugerowane wartości, które użytkownicy mogą wpisać. Te wartości pojawiają się po kliknięciu przez użytkownika pola do wprowadzania tekstu. W miarę pisania przez użytkowników sugerowane wartości są dynamicznie filtrowane zgodnie z tym, co wpisali użytkownicy.

Na przykład pole tekstowe do wprowadzania danych w języku programowania może sugerować Java, JavaScript, Python i C++. Gdy użytkownicy zaczną pisać Jav, lista filtrów sugestii do wyświetlenia Java oraz JavaScript

Sugerowane wartości pomagają zachęcać użytkowników do wpisywania wartości, które Twoja aplikacja może zrozumieć. W przypadku JavaScriptu niektórzy użytkownicy mogą wpisać javascript i inne java script Sugerowanie JavaScript pozwalają ustandaryzować sposób, w jaki użytkownicy korzystają z aplikacji.

Jeśli określisz parametr, TextInput.type to zawsze SINGLE_LINE, nawet jeśli ustawiona jest wartość MULTIPLE_LINE

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis JSON 
{
  "items": [
    {
      object (SuggestionItem)
    }
  ]
}
Pola
items[]

object (SuggestionItem)

Lista sugestii używanych do autouzupełniania rekomendacji w polach do wprowadzania tekstu.

SuggestionItem

Jedna sugerowana wartość, którą użytkownicy mogą wpisać w polu do wprowadzania tekstu.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis JSON 
{

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

Pole sumy content

content może być tylko jednym z tych elementów:

text

string

Wartość sugerowanej wartości wejściowej w polu do wprowadzania tekstu. Jest to odpowiednik danych wpisywanych przez użytkowników.

Weryfikacja

. Reprezentuje dane niezbędne do weryfikacji widżetu, do którego jest dołączony.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis JSON 
{
  "characterLimit": integer,
  "inputType": enum (InputType)
}
Pola
characterLimit

integer

. Określ limit znaków dla widżetów do wprowadzania tekstu. Jest on używany wyłącznie do wprowadzania tekstu i ignorowany w przypadku innych widżetów.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

inputType

enum (InputType)

. Określ typ widżetów wejściowych.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

InputType

Typ widżetu wejściowego.

Wartości w polu enum
INPUT_TYPE_UNSPECIFIED Nieokreślony typ. Nie używać.
TEXT Zwykły tekst, w którym można wpisać wszystkie znaki.
INTEGER Wartość całkowita.
FLOAT Wartość zmiennoprzecinkowa.
EMAIL Adres e-mail.
EMOJI_PICKER Emotikon wybrany z dostarczonego przez system selektora emotikonów.

SelectionInput

Widżet tworzący co najmniej 1 element interfejsu, który użytkownicy mogą wybrać. Może to być na przykład menu lub pola wyboru. Możesz używać tego widżetu do zbierania danych, które można przewidzieć lub wyliczyć. Przykład dotyczący aplikacji Google Chat znajdziesz tutaj: Dodaj elementy interfejsu, które można wybrać.

Aplikacje do obsługi czatu mogą przetwarzać wartości elementów wybranych lub wprowadzonych przez użytkowników. Szczegółowe informacje o pracy z danymi wejściowymi formularza znajdziesz w artykule Odbieranie danych formularzy.

Aby zbierać nieokreślone lub abstrakcyjne dane o użytkownikach, użyj funkcji TextInput widżet.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis 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.
}
Pola
name

string

Wymagane. Nazwa identyfikująca dane wejściowe w zdarzeniu danych wejściowych w formularzu.

Szczegółowe informacje o pracy z danymi wejściowymi formularza znajdziesz w artykule Odbieranie danych formularzy.

label

string

Tekst wyświetlany w interfejsie nad polem wyboru do wprowadzania danych.

Podaj tekst, który pomoże użytkownikowi podać informacje, których potrzebuje Twoja aplikacja. Jeśli na przykład użytkownicy wybierają z menu pilność zgłoszenia do pracy, etykieta może mieć etykietę „Pilne”. lub „Wybierz pilność”.

type

enum (SelectionType)

Typ produktów wyświetlanych użytkownikom w SelectionInput widżet. Typy wyboru obsługują różne typy interakcji. Użytkownicy mogą na przykład zaznaczyć jedno lub więcej pól wyboru, ale tylko jedną wartość w menu.

items[]

object (SelectionItem)

Tablica elementów do wyboru. Może to być np. tablica przycisków opcji lub pól wyboru. Obsługuje do 100 elementów.

onChangeAction

object (Action)

Jeśli określisz formularz, zostanie on przesłany po zmianie wyboru. Jeśli go nie podasz, musisz dodać osobny przycisk do przesyłania formularza.

Szczegółowe informacje o pracy z danymi wejściowymi formularza znajdziesz w artykule Odbieranie danych formularzy.

multiSelectMaxSelectedItems

integer

W przypadku menu wielokrotnego wyboru jest to maksymalna liczba elementów, które użytkownik może wybrać. Minimalna wartość to 1 element. Jeśli nie określono inaczej, domyślna wartość to 3 elementy.

multiSelectMinQueryLength

integer

W przypadku menu wielokrotnego wyboru liczba znaków, które użytkownik wpisze, zanim aplikacja wyśle zapytanie do użytkownika, jest uzupełniana automatycznie i wyświetla sugerowane elementy w menu.

Jeśli nie określono inaczej, domyślna wartość to 0 znaków w przypadku statycznych źródeł danych i 3 znaki w przypadku zewnętrznych źródeł danych.

validation

object (Validation)

Weryfikacja tego pola wyboru w przypadku menu rozwijanych.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Pole sumy multi_select_data_source W przypadku menu wyboru wielokrotnego jest to źródło danych, które wypełnia elementy zaznaczenia.

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace. multi_select_data_source może być tylko jednym z tych elementów:

externalDataSource

object (Action)

Zewnętrzne źródło danych, takie jak relacyjna baza danych.

platformDataSource

object (PlatformDataSource)

Źródło danych z Google Workspace.

SelectionType

Format elementów, które użytkownicy mogą wybierać. Różne opcje obsługują różne typy interakcji. Na przykład użytkownicy mogą zaznaczyć wiele pól wyboru, ale tylko jeden element w menu.

Każde dane wejściowe obsługują 1 typ wyboru. Na przykład miksowanie pól wyboru i przełączników nie jest obsługiwane.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Wartości w polu enum
CHECK_BOX Zestaw pól wyboru. Użytkownicy mogą zaznaczyć co najmniej 1 pole wyboru.
RADIO_BUTTON Zestaw opcji. Użytkownik może wybrać 1 przycisk.
SWITCH Zestaw przełączników. Użytkownicy mogą włączać 1 lub więcej przełączników.
DROPDOWN Menu. Użytkownicy mogą wybrać 1 element z menu.
MULTI_SELECT

Menu wyboru wielokrotnego dla danych statycznych lub dynamicznych. Na pasku menu użytkownicy wybierają co najmniej 1 element. Użytkownicy mogą też wprowadzać wartości, aby wypełniać dane dynamiczne. Na przykład użytkownicy mogą zacząć wpisywać nazwę pokoju w Google Chat, a widżet automatycznie zasugeruje taki pokój.

Aby dodać elementy do menu wielokrotnego wyboru, możesz użyć jednego z tych typów źródeł danych:

  • Dane statyczne: elementy są określane jako SelectionItem obiekty w widżecie. Maksymalnie 100 elementów.
  • Dane Google Workspace: elementy są wypełniane na podstawie danych z Google Workspace, takich jak użytkownicy Google Workspace czy pokoje Google Chat.
  • Dane zewnętrzne: elementy są wypełniane z zewnętrznego źródła danych spoza Google Workspace.

Przykłady implementacji menu wielokrotnego wyboru znajdziesz w sekcji Dodaj menu wielokrotnego wyboru.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

SelectionItem

Element, który użytkownicy mogą wybrać w polu wyboru, np. pole wyboru lub przełącznik.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis JSON 
{
  "text": string,
  "value": string,
  "selected": boolean,
  "startIconUri": string,
  "bottomText": string
}
Pola
text

string

Tekst, który identyfikuje lub opisuje produkt użytkownikom.

value

string

Wartość powiązana z tym elementem. Klient powinien użyć tej wartości jako wartości wejściowej formularza.

Szczegółowe informacje o pracy z danymi wejściowymi formularza znajdziesz w artykule Odbieranie danych formularzy.

selected

boolean

Określa, czy element jest wybierany domyślnie. Jeśli pole wyboru akceptuje tylko jedną wartość (np. w przypadku przycisków lub menu), ustaw to pole tylko dla 1 elementu.

startIconUri

string

W przypadku menu wielokrotnego wyboru adres URL ikony wyświetlanej obok elementu text . Obsługuje pliki PNG i JPEG. Musi to być format: HTTPS Adres URL. Przykład: https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png

bottomText

string

w przypadku menu wielokrotnego wyboru – opis tekstowy lub etykieta wyświetlana pod nagłówkiem text .

PlatformDataSource

Dla SelectionInput widżet z menu wielokrotnego wyboru, źródłem danych z Google Workspace. Służy do wypełniania elementów w menu wielokrotnego wyboru.

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Zapis 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.
}
Pola
Pole sumy data_source Źródło danych. data_source może być tylko jednym z tych elementów:
commonDataSource

enum (CommonDataSource)

Źródło danych współdzielone przez wszystkie aplikacje Google Workspace, takie jak użytkownicy w organizacji Google Workspace.

hostAppDataSource

object (HostAppDataSourceMarkup)

Źródło danych unikalne dla aplikacji hosta Google Workspace, takie jak pokoje w Google Chat.

To pole obsługuje biblioteki klienta interfejsów API Google, ale nie jest dostępne w bibliotekach klienta Cloud. Więcej informacji: Zainstaluj biblioteki klienta.

CommonDataSource

Źródło danych wspólne dla wszystkich Aplikacje Google Workspace

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Wartości w polu enum
UNKNOWN Wartość domyślna. Nie używaj.
USER Użytkownicy Google Workspace. Użytkownik może tylko wyświetlać i wybierać użytkowników ze swojej organizacji Google Workspace.

HostAppDataSourceMarkup

Dla SelectionInput widżet z menu wielokrotnego wyboru, źródłem danych z aplikacji Google Workspace. Źródło danych wypełnia elementy zaznaczenia menu wielokrotnego wyboru.

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Zapis 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.
}
Pola
Pole sumy data_source Aplikacja Google Workspace, która wypełnia elementy menu wielokrotnego wyboru. data_source może być tylko jednym z tych elementów:
chatDataSource

object (ChatClientDataSourceMarkup)

Źródło danych z Google Chat.

ChatClientDataSourceMarkup

Dla SelectionInput widżet z menu wielokrotnego wyboru, źródłem danych z Google Chat. Źródło danych wypełnia elementy zaznaczenia menu wielokrotnego wyboru. Na przykład użytkownik może wybrać pokoje Google Chat, do których należy.

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Zapis JSON 
{

  // Union field source can be only one of the following:
  "spaceDataSource": {
    object (SpaceDataSource)
  }
  // End of list of possible types for union field source.
}
Pola
Pole sumy source Źródło danych Google Chat. source może być tylko jednym z tych elementów:
spaceDataSource

object (SpaceDataSource)

Pokoje Google Chat, do których należy użytkownik.

SpaceDataSource

Źródło danych, które wypełnia pokoje Google Chat jako elementy wyboru menu wielokrotnego wyboru. To pole zawiera tylko te pokoje, do których należy użytkownik.

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Zapis JSON 
{
  "defaultToCurrentSpace": boolean
}
Pola
defaultToCurrentSpace

boolean

Jeśli jest ustawiona na true, w menu wyboru wielokrotnego domyślnie wybierany jest obecny pokój Google Chat.

DateTimePicker

Umożliwia użytkownikom wpisanie daty, godziny lub zarówno daty, jak i godziny. Przykład dotyczący aplikacji Google Chat znajdziesz tutaj: Pozwól użytkownikowi wybrać datę i godzinę.

Użytkownicy mogą wpisywać tekst lub wybierać daty i godziny za pomocą selektora. Jeśli użytkownicy wpiszą nieprawidłową datę lub godzinę, w selektorze pojawi się komunikat o błędzie z prośbą o prawidłowe wpisanie informacji.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

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

string

Nazwa, według której DateTimePicker jest wykrywany w zdarzeniu danych wejściowych formularza.

Szczegółowe informacje o pracy z danymi wejściowymi formularza znajdziesz w artykule Odbieranie danych formularzy.

label

string

Tekst, który prosi użytkowników o podanie daty, godziny lub daty i godziny. Jeśli na przykład użytkownicy planują spotkanie, użyj etykiety takiej jak Appointment date lub Appointment date and time

type

enum (DateTimePickerType)

Określa, czy widżet umożliwia wpisywanie daty, godziny lub daty i godziny.

valueMsEpoch

string (int64 format)

Domyślna wartość wyświetlana w widżecie (w milisekundach) od Czas uniksowy.

Określ wartość w zależności od typu selektora ( DateTimePickerType):

  • DATE_AND_TIME : data i godzina w kalendarzu w czasie UTC. Aby na przykład podać datę 1 stycznia 2023 r. o 12:00 czasu UTC, użyj ciągu 1672574400000
  • DATE_ONLY : dzień kalendarzowy o godzinie 00:00:00 czasu UTC. Na przykład do określenia daty 1 stycznia 2023 r. użyj zapisu 1672531200000
  • TIME_ONLY : czas w strefie czasowej UTC. Na przykład aby podać godzinę 12:00, użyj wartości 43200000 (lub 12 * 60 * 60 * 1000).
timezoneOffsetDate

integer

Liczba reprezentująca przesunięcie strefy czasowej w stosunku do czasu UTC (w minutach). Jeśli jest ustawiony, parametr valueMsEpoch jest wyświetlany w określonej strefie czasowej. Jeśli zasada jest nieskonfigurowana, domyślnie przyjmuje się ustawienie strefy czasowej użytkownika.

onChangeAction

object (Action)

Wywoływane, gdy użytkownik kliknie reklamę. Zapisz lub Wyczyść z DateTimePicker za pomocą prostego interfejsu online.

validation

object (Validation)

. Opcjonalna. Określ weryfikację wymaganą dla tego selektora licznika daty.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

DateTimePickerType

Format daty i godziny w DateTimePicker widżet. Określa, czy użytkownicy mogą wprowadzać datę, godzinę lub jednocześnie datę i godzinę.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Wartości w polu enum
DATE_AND_TIME Użytkownicy wpisują datę i godzinę.
DATE_ONLY Użytkownicy wpisują datę.
TIME_ONLY Użytkownicy wpisują godzinę.

Separator

Ten typ nie zawiera pól.

Wyświetla separator między widżetami w postaci poziomej linii. Przykład dotyczący aplikacji Google Chat znajdziesz tutaj: Dodaj poziomy separator między widżetami.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Na przykład ten kod JSON tworzy separator: 

"divider": {}

Siatka

Wyświetla siatkę z kolekcją elementów. Elementy mogą zawierać tylko tekst lub obrazy. Jeśli chcesz używać kolumn elastycznych lub chcesz uwzględnić więcej niż tekst i obrazy, użyj funkcji Columns Przykład dotyczący aplikacji Google Chat znajdziesz tutaj: Wyświetl siatkę z kolekcją elementów.

Siatka może zawierać dowolną liczbę kolumn i elementów. Liczba wierszy jest określana przez podział elementów przez kolumny. Siatka z 10 elementami i 2 kolumnami ma 5 wierszy. Siatka z 11 elementami i 2 kolumnami ma 6 wierszy.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Na przykład ten plik JSON tworzy siatkę z 2 kolumnami z jednym elementem: 

"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"
    }
  }
}
Zapis JSON 
{
  "title": string,
  "items": [
    {
      object (GridItem)
    }
  ],
  "borderStyle": {
    object (BorderStyle)
  },
  "columnCount": integer,
  "onClick": {
    object (OnClick)
  }
}
Pola
title

string

Tekst wyświetlany w nagłówku siatki.

items[]

object (GridItem)

Elementy wyświetlane w siatce.

borderStyle

object (BorderStyle)

Styl obramowania, który ma być stosowany do każdego elementu siatki.

columnCount

integer

Liczba kolumn wyświetlanych w siatce. Jeśli to pole nie jest określone, używana jest wartość domyślna. Zależy ona od tego, gdzie wyświetla się siatka (dialog czy reklama towarzysząca).

onClick

object (OnClick)

To wywołanie zwrotne jest ponownie używane przez każdy element siatki, ale z identyfikatorem i indeksem elementu na liście elementów dodanymi do parametrów wywołania zwrotnego.

GridItem

Reprezentuje element w układzie siatki. Elementy mogą zawierać tekst, obraz lub zarówno tekst, jak i obraz.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

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

string

Określony przez użytkownika identyfikator tego elementu siatki. Ten identyfikator jest zwracany w siatce nadrzędnej onClick parametrów wywołania zwrotnego.

image

object (ImageComponent)

Obraz wyświetlany w elemencie siatki.

title

string

Tytuł elementu siatki.

subtitle

string

Podtytuł elementu siatki.

layout

enum (GridItemLayout)

Układ, który ma być używany w elemencie siatki.

ImageComponent

Reprezentuje obraz.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

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

string

Adres URL obrazu.

altText

string

Etykieta ułatwień dostępu do obrazu.

cropStyle

object (ImageCropStyle)

Styl przycinania, który zostanie zastosowany do obrazu.

borderStyle

object (BorderStyle)

Styl obramowania, który zostanie zastosowany do obrazu.

ImageCropStyle

Reprezentuje styl przycinania zastosowany do obrazu.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Na przykład w ten sposób możesz zastosować współczynnik proporcji 16:9: 

cropStyle {
 "type": "RECTANGLE_CUSTOM",
 "aspectRatio": 16/9
}
Zapis JSON 
{
  "type": enum (ImageCropType),
  "aspectRatio": number
}
Pola
type

enum (ImageCropType)

Typ przycięcia.

aspectRatio

number

Format obrazu używany, gdy typ przycięcia to RECTANGLE_CUSTOM

Na przykład w ten sposób możesz zastosować współczynnik proporcji 16:9: 

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

ImageCropType

Reprezentuje styl przycinania zastosowany do obrazu.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Wartości w polu enum
IMAGE_CROP_TYPE_UNSPECIFIED Nie używaj. Nie określono.
SQUARE Wartość domyślna. Stosuje przycięcie kwadratowe.
CIRCLE Powoduje przycięcie na planie koła.
RECTANGLE_CUSTOM Stosuje prostokątne przycięcie z niestandardowym formatem obrazu. Ustaw niestandardowy format obrazu za pomocą aspectRatio
RECTANGLE_4_3 Stosuje prostokątne przycięcie o współczynniku proporcji 4:3.

BorderStyle

Opcje stylu obramowania karty lub widżetu, w tym typ i kolor obramowania.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

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

enum (BorderType)

Typ obramowania.

strokeColor

object (Color)

Kolory, które mają być używane, gdy typ to BORDER_TYPE_STROKE

Aby ustawić kolor kreski, podaj wartość red, green i blue . Wartość musi być liczbą zmiennoprzecinkową z zakresu od 0 do 1 na podstawie wartości koloru RGB, gdzie 0 (0/255) oznacza brak koloru i 1 (255/255) reprezentuje maksymalną intensywność koloru.

W przykładzie poniżej pokazujemy, że kolor jest czerwony z maksymalną intensywnością: 

"color": {
   "red": 1,
   "green": 0,
   "blue": 0,
}

alpha pole jest niedostępne dla koloru kreski. Jeśli pole jest określone, jest ignorowane.

cornerRadius

integer

Promień narożnika obramowania.

BorderType

Reprezentuje typy obramowania zastosowane do widżetów.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Wartości w polu enum
BORDER_TYPE_UNSPECIFIED Nie używaj. Nie określono.
NO_BORDER Wartość domyślna. Brak obramowania.
STROKE konspekt.

GridItemLayout

Reprezentuje różne opcje układu dostępne dla elementu siatki.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Wartości w polu enum
GRID_ITEM_LAYOUT_UNSPECIFIED Nie używaj. Nie określono.
TEXT_BELOW Tytuł i podtytuł są wyświetlane pod obrazem elementu siatki.
TEXT_ABOVE Tytuł i podtytuł są wyświetlane nad obrazem elementu siatki.

Kolumny

Columns wyświetla maksymalnie 2 kolumny na karcie lub w oknie. Do każdej kolumny możesz dodać widżety. widżety pojawiają się w kolejności, w jakiej zostały określone. Przykład dotyczący aplikacji Google Chat znajdziesz tutaj: Wyświetlaj karty i okna w kolumnach.

Wysokość każdej kolumny jest określana na podstawie wyższej kolumny. Jeśli na przykład pierwsza kolumna jest wyższa od drugiej, obie kolumny będą mieć wysokość pierwszej kolumny. Każda kolumna może zawierać różną liczbę widżetów, więc nie można definiować wierszy ani wyrównywać widżetów między kolumnami.

Kolumny są wyświetlane obok siebie. Możesz dostosować szerokość każdej kolumny za pomocą parametru HorizontalSizeStyle . Jeśli szerokość ekranu użytkownika jest zbyt wąska, druga kolumna otacza się pierwszą kolumną:

  • W przypadku internetu druga kolumna zawija się, jeśli szerokość ekranu jest mniejsza niż lub równa 480 pikseli.
  • Na urządzeniach z iOS druga kolumna zawija się, jeśli szerokość ekranu jest mniejsza niż lub równa 300 punktów.
  • Na urządzeniach z Androidem druga kolumna zawija się, jeśli szerokość ekranu jest mniejsza niż lub równa 320 dp.

Aby uwzględnić więcej niż 2 kolumny lub użyć wierszy, użyj funkcji Grid widżet.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis JSON 
{
  "columnItems": [
    {
      object (Column)
    }
  ]
}
Pola
columnItems[]

object (Column)

Tablica kolumn. Na karcie lub w oknie dialogowym możesz umieścić maksymalnie 2 kolumny.

Kolumna

Kolumna.

Dodatki do Google Workspace i aplikacje Google Chat

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

enum (HorizontalSizeStyle)

Określa, jak kolumna wypełnia szerokość karty.

horizontalAlignment

enum (HorizontalAlignment)

Określa, czy widżety mają być wyrównane do lewej, prawej czy do środka kolumny.

verticalAlignment

enum (VerticalAlignment)

Określa, czy widżety mają się znajdować na górze, na dole czy na środku kolumny.

widgets[]

object (Widgets)

Tablica widżetów w kolumnie. Widżety są wyświetlane w kolejności, w jakiej zostały określone.

HorizontalSizeStyle

Określa, jak kolumna wypełnia szerokość karty. Szerokość każdej kolumny zależy od HorizontalSizeStyle oraz szerokość widżetów w kolumnie.

Dodatki do Google Workspace i aplikacje Google Chat

Wartości w polu enum
HORIZONTAL_SIZE_STYLE_UNSPECIFIED Nie używaj. Nie określono.
FILL_AVAILABLE_SPACE Wartość domyślna. Kolumna wypełni dostępną przestrzeń, do 70% szerokości karty. Jeśli obie kolumny mają wartość FILL_AVAILABLE_SPACE, każda kolumna zajmuje 50% miejsca.
FILL_MINIMUM_SPACE Kolumna zajmuje najmniejszą możliwą ilość miejsca i nie więcej niż 30% szerokości karty.

HorizontalAlignment

Określa, czy widżety mają być wyrównane do lewej, prawej czy do środka kolumny.

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Wartości w polu enum
HORIZONTAL_ALIGNMENT_UNSPECIFIED Nie używaj. Nie określono.
START Wartość domyślna. Wyrównuje widżety do pozycji początkowej kolumny. W przypadku układów od lewej do prawej wyrównuje się do lewej. W przypadku układów od prawej do lewej wyrównuje się do prawej.
CENTER Wyrównuje widżety do środka kolumny.
END Wyrównuje widżety do pozycji końcowej kolumny. W przypadku układów od lewej do prawej wyrównuje widżety do prawej strony. W przypadku układów od prawej do lewej wyrównuje widżety do lewej.

VerticalAlignment

Określa, czy widżety mają się znajdować na górze, na dole czy na środku kolumny.

Dodatki do Google Workspace i aplikacje Google Chat

Wartości w polu enum
VERTICAL_ALIGNMENT_UNSPECIFIED Nie używaj. Nie określono.
CENTER Wartość domyślna. Wyrównuje widżety do środka kolumny.
TOP Wyrównuje widżety do górnej części kolumny.
BOTTOM Wyrównuje widżety do dołu kolumny.

Widżety

obsługiwane widżety, które można uwzględnić w kolumnie;

Dodatki do Google Workspace i aplikacje Google Chat

Zapis 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)
  },
  "chipList": {
    object (ChipList)
  }
  // End of list of possible types for union field data.
}
Pola

Pole sumy data

data może być tylko jednym z tych elementów:

textParagraph

object (TextParagraph)

TextParagraph widżet.

image

object (Image)

Image widżet.

decoratedText

object (DecoratedText)

DecoratedText widżet.

buttonList

object (ButtonList)

ButtonList widżet.

textInput

object (TextInput)

TextInput widżet.

selectionInput

object (SelectionInput)

SelectionInput widżet.

dateTimePicker

object (DateTimePicker)

DateTimePicker widżet.

chipList

object (ChipList)

ChipList widżet. Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

ChipList

Lista elementów ułożonych w poziomie, które można przewijać w poziomie lub zawijać do następnego wiersza.

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Zapis JSON 
{
  "layout": enum (Layout),
  "chips": [
    {
      object (Chip)
    }
  ]
}
Pola
layout

enum (Layout)

Określony układ listy elementów.

chips[]

object (Chip)

Tablica elementów.

Układ

Układ listy elementów.

Wartości w polu enum
LAYOUT_UNSPECIFIED Nie używaj. Nie określono.
WRAPPED Wartość domyślna. Jeśli nie ma wystarczającej ilości wolnego miejsca w poziomie, lista elementów zawija się do następnego wiersza.
HORIZONTAL_SCROLLABLE Elementy przewijają się w poziomie, jeśli nie mieszczą się w dostępnym miejscu.

Układ scalony

Tekst, ikona lub element tekstowy i ikona, które użytkownicy mogą kliknąć.

Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Zapis JSON 
{
  "icon": {
    object (Icon)
  },
  "label": string,
  "onClick": {
    object (OnClick)
  },
  "enabled": boolean,
  "disabled": boolean,
  "altText": string
}
Pola
icon

object (Icon)

Obraz ikony. Jeśli oba icon oraz text zostanie ustawiona, ikona pojawi się przed tekstem.

label

string

Tekst wyświetlany w elemencie.

onClick

object (OnClick)

Opcjonalnie: Działanie, które ma być wykonywane po kliknięciu elementu przez użytkownika, na przykład otwarcie hiperlinku lub uruchomienie funkcji niestandardowej.

enabled
(deprecated)

boolean

Określa, czy element jest aktywny i reaguje na działania użytkownika. Domyślna wartość to true Rola wycofana. Używaj disabled .

disabled

boolean

Określa, czy element jest nieaktywny i ignoruje działania użytkownika. Domyślna wartość to false

altText

string

Tekst alternatywny używany w ułatwieniach dostępu.

Ustaw opis, który poinformuje użytkowników, do czego służy dany element. Jeśli na przykład element otwiera hiperlink, napisz: „Otwiera nową kartę przeglądarki i przechodzi do dokumentacji dla deweloperów Google Chat na stronie https://developers.google.com/workspace/chat&quot;.

CollapseControl

Reprezentuje element sterujący zwijaniem i rozwijaniem. Dostępny w aplikacjach Google Chat i niedostępny w przypadku dodatków do Google Workspace.

Zapis JSON 
{
  "horizontalAlignment": enum (HorizontalAlignment),
  "expandButton": {
    object (Button)
  },
  "collapseButton": {
    object (Button)
  }
}
Pola
horizontalAlignment

enum (HorizontalAlignment)

Wyrównanie w poziomie przycisku rozwijania i zwijania.

expandButton

object (Button)

Opcjonalnie: Zdefiniuj przycisk konfigurowalny, aby rozwinąć sekcję. Należy ustawić wartości w polach „expandButton” i „ZwińButton). Tylko jedno ustawienie pola nie będzie działać. Jeśli to pole nie jest skonfigurowane, używany jest przycisk domyślny.

collapseButton

object (Button)

Opcjonalnie: Zdefiniuj przycisk konfigurowalny, który zwija sekcję. Należy ustawić wartości w polach „expandButton” i „ZwińButton). Tylko jedno ustawienie pola nie będzie działać. Jeśli to pole nie jest skonfigurowane, używany jest przycisk domyślny.

DividerStyle

Styl podziału karty. Obecnie używany tylko do oddzielania sekcji kart.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Wartości w polu enum
DIVIDER_STYLE_UNSPECIFIED Nie używaj. Nie określono.
SOLID_DIVIDER Opcja domyślna. Renderuj separator ciągły.
NO_DIVIDER Jeśli jest ustawiony, separator nie jest renderowany. Ten styl całkowicie usuwa separator z układu. Wynik jest odpowiednikiem tego, że w ogóle nie dodano separatora.

CardAction

Działanie związane z kartą to działanie powiązane z kartą. Na przykład karta faktury może zawierać działania takie jak usunięcie faktury, wysłanie faktury e-mailem lub otwarcie faktury w przeglądarce.

Dostępne w przypadku dodatków do Google Workspace i niedostępne w aplikacjach Google Chat.

Zapis JSON 
{
  "actionLabel": string,
  "onClick": {
    object (OnClick)
  }
}
Pola
actionLabel

string

Etykieta wyświetlana jako element menu czynności.

onClick

object (OnClick)

onClick dla tego działania.

CardFixedFooter

Stała (przyklejona) stopka wyświetlana u dołu karty.

Ustawienie fixedFooter bez określania primaryButton lub secondaryButton powoduje błąd.

W aplikacjach do obsługi czatu możesz użyć stałych stopek w okna, ale nie wiadomości z kart. Przykład dotyczący aplikacji Google Chat znajdziesz tutaj: Dodaj trwałą stopkę.

Dostępny w przypadku aplikacji Google Chat i dodatków do Google Workspace.

Zapis JSON 
{
  "primaryButton": {
    object (Button)
  },
  "secondaryButton": {
    object (Button)
  }
}
Pola
primaryButton

object (Button)

Przycisk główny stałej stopki. Przycisk musi być przyciskiem tekstowym z ustawionym tekstem i kolorem.

secondaryButton

object (Button)

Przycisk drugiego przycisku stałej stopki. Przycisk musi być przyciskiem tekstowym z ustawionym tekstem i kolorem. Jeśli secondaryButton jest ustawiony, musisz też primaryButton

DisplayStyle

W Dodatkach do Google Workspace określa sposób wyświetlania karty.

Dostępne w przypadku dodatków do Google Workspace i niedostępne w aplikacjach Google Chat.

Wartości w polu enum
DISPLAY_STYLE_UNSPECIFIED Nie używaj. Nie określono.
PEEK Nagłówek karty pojawia się u dołu paska bocznego, częściowo zasłaniając bieżącą górną kartę stosu. Kliknięcie nagłówka powoduje umieszczenie karty na stosie kart. Jeśli karta nie ma nagłówka, zamiast niego zostanie użyty wygenerowany nagłówek.
REPLACE Wartość domyślna. Karta jest wyświetlana, zastępując widok górnej karty w stosie kart.