Come impostare il colore dei widget da un trigger
  • 31 Oct 2023
  • 2 Minuti da leggere
  • Contributori

Come impostare il colore dei widget da un trigger


Sommario dell'articolo

Ecco come utilizzare le variabili di colore per cambiare dinamicamente il colore di diversi widget.

In questo articolo imparerete:

  • Come utilizzare le variabili "Colore"".
  • Come aggiungere un colore specifico a un campo di una tabella

Scopo

Tulip consente di cambiare dinamicamente i colori di pulsanti, indicatori e molti altri widget.

Come fare

Per ottenere questo risultato, è necessario memorizzare un colore in una variabile o in un campo di una tabella.

Ecco come creare una nuova variabile Colore tramite la finestra di dialogo Variabili nel riquadro contestuale:

Ecco un esempio di come impostare un campo "Colore" in una tabella:

Quindi, dopo aver creato una variabile colore, è possibile selezionarla manualmente in quasi tutti i colorpicker facendo clic sulla scheda "Variabili" nel colorpicker:

Questo applicherà il colore memorizzato nella variabile al widget.

Questa guida mostra un paio di esempi comuni di utilizzo delle variabili colore e dei campi colore nelle applicazioni.

Cambiare il colore di un pulsante

Supponiamo di avere un pulsante "Avanti" nella nostra applicazione e di volerne cambiare il colore in base al superamento di un controllo di qualità.

Per iniziare, occorre creare una variabile chiamata "check_status_color" e impostare il valore predefinito su "rosso" tramite la finestra di dialogo Variabili nel riquadro contestuale.

Ecco dove aggiungere una nuova variabile nel Riquadro contestuale:

Ecco come creare la variabile e impostarla su rosso:

Si vuole che il rosso sia il colore predefinito, perché una persona non può avanzare finché non ha superato il controllo di qualità.

Quindi, impostare il colore del pulsante sulla variabile corretta nella scheda Widget, facendo clic su "Colore pulsante" e scegliendo poi le variabili:

Infine, quando il controllo qualità viene superato, è necessario aggiornare il colore della variabile tramite l'azione Trigger "Data Manipulation". In questo modo:

  • "Manipolazione dati" "Memorizza" dati: "Valore statico" "colore" (blu) posizione: "variabile" "check_status_color"

Un'altra cosa: si potrebbe aggiungere un'istruzione "if" al pulsante "Avanti" per impedire all'operatore di avanzare finché il controllo di qualità non viene superato.

Ecco come fare utilizzando un'istruzione "if":

IF

  • "Variabile" "test1" "è vero"

ALLORA

  • "Vai al passo" "Successivo"

Cambiare la visibilità di un pulsante

Oltre a cambiare il colore, è possibile rendere invisibile un pulsante modificandone dinamicamente la trasparenza.

A tale scopo, collegare il colore di un pulsante a una variabile di colore, come mostrato sopra.

Per modificare la trasparenza di un pulsante, impostare un'istruzione "Then" simile a quella precedente. Quindi, trascinare il cursore "trasparenza" completamente a sinistra.

In questo modo:

Ecco come appare il cursore della trasparenza sul colorpicker:

Indicare uno stato in una tabella

Supponiamo di voler creare un cruscotto Kamishibai o di tenere traccia dello stato di più linee di produzione in un unico posto.

È possibile farlo memorizzando il valore di un colore in una tabella, come mostrato sopra, e caricandolo poi in un'applicazione.

Innanzitutto, memorizzare un colore in un campo colore di una tabella. Ecco un esempio di come apparirà:

Quindi, caricare il record della tabella nell'applicazione.

Infine, aggiungere un "record di tabella" sotto il widget "Testo":

Quindi, scegliere il campo Colore dall'elenco a discesa nel riquadro contestuale all'interno del segnaposto record creato in precedenza:

Il campo colore verrà aggiunto automaticamente al passo aperto in un riquadro di delimitazione:

Quando si apre l'applicazione in Tulip Player, si vedrà il colore apparire all'interno del riquadro di delimitazione:

Ulteriori letture


Avete trovato quello che cercavate?

Potete anche andare su community.tulip.co per postare la vostra domanda o vedere se altri hanno affrontato una domanda simile!


Questo articolo è stato utile?