Interfacce basate su scheda

Scheda componente aggiuntivo di esempio

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 particolare "pagina" dell'interfaccia utente del componente aggiuntivo e passare a una nuova scheda di solito significa semplicemente creare la scheda e inserirla in una pila di schede interne. Puoi definire i flussi di navigazione tra le schede per un'esperienza di interazione avanzata.

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 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 a partire da schede. I componenti aggiuntivi creati in altre lingue devono restituire un codice 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 mostrano informazioni all'utente o forniscono controlli di interazione come i pulsanti.

Le interfacce basate su schede offrono i seguenti vantaggi:

  • Non è richiesta alcuna conoscenza di HTML o CSS per creare interfacce basate su schede.
  • Le schede e i widget vengono formattati automaticamente per funzionare correttamente con le applicazioni Google Workspace che estendono.
  • Le interfacce basate su schede funzionano sia su computer che su dispositivi mobili, ma devi definirle una sola volta.

Creazione di interfacce basate su schede

Quando crei componenti aggiuntivi basati su schede, è importante comprendere alcuni concetti e pattern di progettazione. Le seguenti guide forniscono le informazioni necessarie per creare componenti aggiuntivi basati su schede efficaci:

Fai riferimento a queste pagine quando crei schede e implementi il comportamento dell'interfaccia utente. Potresti trovare utili anche i seguenti esempi aggiuntivi da consultare durante l'implementazione del componente aggiuntivo: