I componenti aggiuntivi di Google Workspace presentano informazioni e controlli utente nella barra laterale dell'interfaccia utente dell'applicazione host. Un componente aggiuntivo è costituito da una barra degli strumenti di identificazione principale e da una o più schede.
Ogni scheda rappresenta una determinata "pagina" dell'interfaccia utente del componente aggiuntivo e solitamente passare a una nuova scheda è solo una questione di creazione della scheda e inserimento in una serie di schede interne. Puoi definire flussi di navigazione tra le schede per un'esperienza di interazione completa.
Le schede possono essere non contestuali o contestuali. Le schede contestuali vengono mostrate all'utente quando l'applicazione host si trova in un contesto specifico. Ad esempio, quando apri un messaggio di Gmail o un evento di Calendar. 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 Calendar.
I componenti aggiuntivi di Google Workspace creati in Apps Script utilizzano il servizio Schede per creare interfacce utente da schede. I componenti aggiuntivi creati in altri linguaggi devono restituire JSON formattato correttamente affinché l'interfaccia venga visualizzata come schede.
Ogni scheda è composta da un'intestazione e da una o più sezioni. Ogni sezione è composta da un insieme di widget. I widget visualizzano informazioni all'utente o forniscono controlli di interazione come i pulsanti.
Le interfacce basate su schede presentano i seguenti vantaggi:
- Non è richiesta alcuna conoscenza di HTML o CSS per creare interfacce basate su schede.
- Le schede e i widget vengono stilizzati automaticamente per funzionare bene con le applicazioni Google Workspace che estendono.
Le interfacce basate su schede funzionano sia su computer che su dispositivi mobili, ma devi definirle solo una volta.
Creazione di interfacce basate su schede
Quando crei componenti aggiuntivi basati su schede, è importante comprendere determinati concetti e pattern di progettazione. Le seguenti guide forniscono le informazioni necessarie per creare componenti aggiuntivi basati su schede efficaci:
- Schede
- Home page
- Widget
- Azioni
- Oggetti evento
- Creare le schede
- Creare schede interattive
- Spostarsi tra le schede
- Utilizzare le azioni universali
- Aggiunta del completamento automatico agli input di testo
- Accedere alle impostazioni internazionali e ai fusi orari dell'utente
- Connessione a servizi non Google
- Style guide
- Best practice
Fai riferimento a queste pagine quando crei le schede e implementi il comportamento dell'interfaccia utente. Potresti anche trovare utili i seguenti esempi aggiuntivi da consultare durante l'implementazione del tuo componente aggiuntivo:
Guida rapida al componente aggiuntivo di Google Workspace "Gatti"
Questo componente aggiuntivo di esempio mostra una semplice interfaccia utente 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 il testo da Documenti, Fogli e Presentazioni.
Componente aggiuntivo di Google Workspace: "Elenco team"
Questo componente aggiuntivo di esempio mostra un componente aggiuntivo di Google Workspace più complesso, che mostra informazioni utente sui destinatari dei messaggi Gmail, sugli editor dei file di Drive o sui partecipanti agli eventi di Calendar. Puoi utilizzare questo componente aggiuntivo solo all'interno di un dominio, poiché utilizza l'API Directory per recuperare le informazioni utente.