I componenti aggiuntivi di Google Workspace presentano informazioni e controlli utente nella barra laterale dell'UI dell'applicazione host. Un componente aggiuntivo è costituito da una barra degli strumenti di identificazione principale insieme a una o più schede.
Ogni scheda rappresenta una determinata "pagina" dell'interfaccia utente del componente aggiuntivo e navigare a una nuova scheda in genere significa solo creare la scheda e inviarla a una pila interna. Puoi definire i flussi di navigazione tra le schede per un'esperienza di interazione ottimale.
Le schede possono essere non contestuali o contestuali. Le schede contestuali vengono presentate all'utente quando l'applicazione host si trova in un contesto specifico. Ad esempio, quando apri un messaggio Gmail o un evento nel calendario. Le schede non contestuali (ad esempio le home page) vengono presentate all'utente al di fuori di un contesto specifico dell'host. ad esempio, quando l'utente visualizza la Posta in arrivo di Gmail, la cartella principale di Drive o il calendario.
I componenti aggiuntivi di Google Workspace integrati in Apps Script utilizzano Card Service per creare interfacce utente a partire dalle schede. I componenti aggiuntivi creati in altre lingue devono restituire JSON nel formato corretto affinché l'interfaccia possa essere visualizzata sotto forma di schede.
Ogni scheda è costituita da un'intestazione e da una o più sezioni di schede. Ogni sezione è composta da un insieme di widget. I widget mostrano informazioni all'utente o forniscono controlli di interazione, come i pulsanti.
Le interfacce basate su schede offrono i seguenti vantaggi:
- Per creare interfacce basate su schede, non è richiesta alcuna conoscenza di HTML o CSS.
- Schede e widget sono automaticamente stilizzati per funzionare bene con le applicazioni Google Workspace estese.
Le interfacce basate su schede funzionano su dispositivi desktop e mobili, ma è sufficiente definire l'interfaccia una sola volta.
Creazione di interfacce basate su schede
Quando crei componenti aggiuntivi basati su schede, è importante comprendere determinati concetti e schemi di progettazione. Le seguenti guide forniscono le informazioni necessarie per creare componenti aggiuntivi efficaci basati sulle schede:
- Schede
- Home page
- Widget
- Azioni
- Oggetti evento
- Creare le schede
- Creare schede interattive
- Navigare tra le schede
- Utilizzare le azioni universali
- Aggiunta del completamento automatico agli input di testo
- Accesso alle impostazioni internazionali e ai fusi orari degli utenti
- Connessione a servizi non Google
- Guida di stile
- Best practice
Fai riferimento a queste pagine quando crei schede e implementi il comportamento dell'interfaccia utente. Potresti trovare utili anche i seguenti esempi aggiuntivi a cui fare riferimento durante l'implementazione del componente aggiuntivo:
Guida rapida "Gatti" per il componente aggiuntivo di Google Workspace
Questo esempio di componente aggiuntivo mostra una semplice UI del componente aggiuntivo di Google Workspace con più pagine e home page.
Componente aggiuntivo di Google Workspace: "Traduci"
Questo esempio di componente aggiuntivo mostra un componente aggiuntivo di Google Workspace che consente agli utenti di tradurre testo da Documenti, Fogli e Presentazioni.
Componente aggiuntivo di Google Workspace: "Elenco team"
Questo esempio di componente aggiuntivo mostra un esempio di componente aggiuntivo di Google Workspace più complesso, che mostra le informazioni relative agli utenti sui destinatari dei messaggi di Gmail, sugli editor di file di Drive o sui partecipanti a eventi di Calendar. Puoi utilizzare questo componente aggiuntivo solo all'interno di un dominio, poiché utilizza l'API Directory per recuperare le informazioni sugli utenti.