Griglia

Un widget Grid mostra una griglia con una raccolta di elementi.

Il widget supporta i suggerimenti, che consentono agli utenti di inserire dati uniformi e le azioni in modifica, Actions che vengono eseguite quando si verifica una modifica nel campo di immissione di testo, ad esempio un utente aggiunge o elimina testo.

Una griglia supporta un numero qualsiasi di colonne ed elementi. Il numero di righe è determinato da elementi divisi per colonne. Una griglia con 10 elementi e 2 colonne contiene 5 righe. Una griglia con 11 elementi e 2 colonne contiene 6 righe.

Le app di chat ricevono e possono elaborare il valore degli elementi selezionati durante gli eventi di input del modulo. Per informazioni dettagliate sull'utilizzo degli input del modulo, consulta Ricevere i dati del modulo.

Supportato solo dalle dialoghi. A breve saranno supportati i messaggi relativi alle carte.

Esempio: una griglia a due colonne con un singolo elemento

La seguente immagine mostra una finestra di dialogo composta da un widget grid. Viene creata una griglia a due colonne con un singolo elemento.

Ecco il codice JSON della scheda:

JSON

{
  "cardsV2": [
    {
      "cardId": "exampleCard",
      "card": {
        "sections": [
          {
            "widgets": [
              {
                "grid": {
                  "title": "A fine collection of items",
                  "numColumns": 2,
                  "borderStyle": {
                    "type": "STROKE",
                    "cornerRadius": 4.0
                  },
                  "items": [
                    {
                      "image": {
                        "imageUri": "https://developers.google.com/static/chat/images/chat-app-hero-image_1440.png",
                        "cropStyle": {
                          "type": "SQUARE"
                        },
                        "borderStyle": {
                          "type": "STROKE"
                        }
                      },
                      "title": "An item",
                      "textAlignment": "CENTER"
                    }
                  ],
                  "onClick": {
                    "openLink": {
                      "url": "https://developers.google.com/chat"
                    }
                  }
                }
              }
            ]
          }
        ]
      }
    }
  ]
}

Grid Rappresentazione e campi JSON

Rappresentazione JSON 
{
  "title": string,
  "items": [
    {
      object (GridItem)
    }
  ],
  "borderStyle": {
    object (BorderStyle)
  },
  "columnCount": integer,
  "onClick": {
    object (OnClick)
  }
}
Campi
title

string

Il testo visualizzato nell'intestazione della griglia.

items[]

object ( GridItem )

Gli elementi da visualizzare nella griglia.

borderStyle

object ( BorderStyle )

Lo stile del bordo da applicare a ciascun elemento della griglia.

columnCount

integer

Il numero di colonne da visualizzare nella griglia. Se questo campo non è specificato, viene utilizzato un valore predefinito diverso e il valore predefinito varia a seconda della posizione di visualizzazione della griglia (finestra di dialogo e companion).

onClick

object ( OnClick )

Questo callback viene riutilizzato da ogni singolo elemento della griglia, ma con l'identificatore e l'indice dell'elemento dell'elenco aggiunti ai parametri del callback.

GridItem

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

string

Un identificatore specificato dall'utente per questo elemento della griglia. Questo identificatore viene restituito nei parametri di callback ValueTrack della griglia principale.

image

object ( ImageComponent )

L'immagine visualizzata nell'elemento della griglia.

title

string

Il titolo dell'elemento della griglia.

subtitle

string

Il sottotitolo dell'elemento della griglia.

layout

enum ( GridItemLayout )

Il layout da utilizzare per l'elemento della griglia.

BorderStyle

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

enum ( BorderType )

Il tipo di bordo.

strokeColor

object ( Color )

I colori da utilizzare quando il tipo è BORDER_TYPE_STROKE .

cornerRadius

integer

Il raggio dell'angolo del bordo.

BorderType

Enum
BORDER_TYPE_UNSPECIFIED Nessun valore specificato.
NO_BORDER Valore predefinito. Nessun bordo.
STROKE Contorno.

Onclick

Rappresenta come rispondere quando gli utenti fanno clic su un elemento interattivo su una scheda, ad esempio un pulsante.

Rappresentazione JSON 
{

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

Campo Union data .

data può essere solo uno dei seguenti:

action

object ( Action )

Se specificato, un'azione viene attivata da onClick .

card

object ( Card )

Se selezionata, viene eseguito il push di una nuova scheda nell'elenco di schede dopo aver fatto clic.

Supportato dai componenti aggiuntivi di Google Workspace, ma non dalle app di chat.

Action

Azione che descrive il comportamento al momento dell'invio del modulo. Ad esempio, uno script di Apps Script può essere richiamato per gestire il modulo.

Rappresentazione JSON 
{
  "function": string,
  "parameters": [
    {
      object (ActionParameter)
    }
  ],
  "loadIndicator": enum (LoadIndicator),
  "persistValues": boolean,
  "interaction": enum (Interaction)
}
Campi
function

string

Una funzione personalizzata da richiamare quando viene fatto clic sull'elemento contenitore o attivato in modo orizzontale.

Ad esempio, consulta Creare schede interattive .

parameters[]

object ( ActionParameter )

Elenco dei parametri delle azioni.

loadIndicator

enum ( LoadIndicator )

Specifica l'indicatore di caricamento visualizzato dall'azione durante l'invito all'azione.

persistValues

boolean

Indica se i valori del modulo persistono dopo l'azione. Il valore predefinito è false .

Se true , i valori del modulo rimangono dopo l'attivazione dell'azione. Quando utilizzi LoadIndicator.NONE per le azioni, è consigliabile persistValues = true e assicurare che eventuali modifiche apportate dall'utente dopo l'invio del modulo o le azioni di modifica al server non vengano sovrascritte dalla risposta.

Se false , i valori del modulo vengono cancellati quando viene attivata l'azione. Se persistValues è impostato su false , è vivamente consigliato utilizzare la scheda LoadIndicator.SPINNER per tutte le azioni, poiché questa operazione blocca la UI per garantire che l'utente non apporti modifiche durante l'elaborazione.

Funzionalità non supportata dalle app di chat.

interaction

enum ( Interaction )

(Facoltativo) Obbligatorio quando apri una finestra di dialogo .

Che cosa fare in risposta a un'interazione con un utente, ad esempio se un utente fa clic sul pulsante nel messaggio di una scheda.

Se non specificati, l'app risponde eseguendo un action (come l'apertura di un link o eseguendo una funzione) come di consueto.

Se specifichi un interaction , l'app può rispondere in modi speciali e interattivi. Ad esempio, impostando interaction su OPEN_DIALOG , l'app può aprire una finestra di dialogo .

Se specificato, non viene mostrato un indicatore di caricamento.

Supportato dalle app di chat, ma non dai componenti aggiuntivi di Google Workspace. Se si specifica un componente aggiuntivo, si rimuove l'intera scheda e non viene mostrato nulla nel client.

ActionParameter

Elenco di parametri stringa da fornire quando viene richiamato il metodo dell'azione. Ad esempio, considera tre pulsanti di posticipazione: posticipa ora, posticipa di 1 giorno, posticipa la settimana successiva Puoi utilizzare il metodo di azione = posticipa(), passando il tipo di posticipazione e il tempo di posticipazione nell'elenco dei parametri della stringa.

Per scoprire di più, consulta CommonEventObject .

Rappresentazione JSON 
{
  "key": string,
  "value": string
}
Campi
key

string

Il nome del parametro per lo script di azione.

value

string

Il valore del parametro.

LoadIndicator

Specifica l'indicatore di caricamento visualizzato dall'azione durante l'invito all'azione.

Enum
SPINNER Viene visualizzata una rotellina che indica che i contenuti sono in fase di caricamento.
NONE Nessun messaggio visualizzato.

Interaction

(Facoltativo) Obbligatorio quando apri una finestra di dialogo .

Che cosa fare in risposta a un'interazione con un utente, ad esempio se un utente fa clic sul pulsante nel messaggio di una scheda.

Se non specificati, l'app risponde eseguendo un action (come l'apertura di un link o eseguendo una funzione) come di consueto.

Se specifichi un interaction , l'app può rispondere in modi speciali e interattivi. Ad esempio, impostando interaction su OPEN_DIALOG , l'app può aprire una finestra di dialogo .

Se specificato, non viene mostrato un indicatore di caricamento.

Supportato dalle app di chat, ma non dai componenti aggiuntivi di Google Workspace. Se si specifica un componente aggiuntivo, si rimuove l'intera scheda e non viene mostrato nulla nel client.

Enum
INTERACTION_UNSPECIFIED Valore predefinito. action viene eseguito normalmente.
OPEN_DIALOG

Consente di aprire una finestra di dialogo , un'interfaccia con finestra basata su schede che le app di chat utilizzano per interagire con gli utenti.

Supportato solo dalle app di Chat in risposta ai clic sui pulsanti nei messaggi delle schede.

Non supportati dai componenti aggiuntivi di Google Workspace. Se si specifica un componente aggiuntivo, si rimuove l'intera scheda e non viene mostrato nulla nel client.