Scopi delle Proprietà

La maggior parte delle proprietà dei componenti (come testo e posizionamento) può essere configurata per utilizzare valori alternativi in base all'ambito corrente di un widget. L'ambito è legato alla lingua, al breakpoint e alla variante attuali del widget.

Casi d'uso

• Widget multilingue — Lo stesso widget può essere utilizzato su siti web che supportano più lingue definendo valori alternativi per i componenti di testo e pulsante in base all'ambito della lingua del widget.
• Widget responsivi — I widget possono essere adattati a diverse larghezze di browser e dispositivi regolando la posizione e le dimensioni dei componenti in base all'ambito del breakpoint del widget.
• Design alternativi — Un singolo widget può essere configurato con uno o più design alternativi che vengono attivati in base all'ambito della variante del widget.

Come vengono determinati i valori delle proprietà?

Gli ambiti delle proprietà utilizzano un modello di ereditarietà. I valori iniziali specificati per le proprietà dei componenti sono memorizzati nell'ambito Predefinito. I valori nell'ambito predefinito costituiscono una base che viene ereditata e sovrascritta da altri ambiti più specifici.

Ad esempio, un componente Pulsante potrebbe avere valori predefiniti per il suo testo e le sue dimensioni (larghezza e altezza). Il testo potrebbe essere sovrascritto per fornire una traduzione specifica in francese e le dimensioni potrebbero essere sovrascritte per rendere il pulsante più piccolo per i dispositivi mobili.

INFO

Nell'esempio seguente, se il widget viene visualizzato in una lingua diversa dal francese, il testo del pulsante sarà "Hello".

Figura: Esempio di ereditarietà delle proprietà per un componente chiamato "Button1"

Modifica degli ambiti di modifica

L'ambito di modifica delle proprietà corrente può essere modificato dai menu a tendina situati nella parte superiore dell'editor. Questi menu a tendina per l'ambito dell'editor sono visibili solo se sono stati definiti ambiti di proprietà aggiuntivi tramite le Impostazioni Widget.

Figura: Menu a tendina per l'ambito di modifica

Ambito della lingua

La lingua di un widget è legata all'offerta corrente a cui è associato. Ogni offerta definita nel Portale Fanplayr ha un attributo di lingua e i widget assumono questo valore in fase di esecuzione.

Ambito del Breakpoint

I breakpoint consentono di creare widget responsivi che utilizzano stili alternativi in base al dispositivo utilizzato per visualizzare il sito web. I breakpoint possono essere utilizzati in due diverse modalità: semplice e avanzata.

Breakpoint Semplici

La modalità semplice divide l'ambito del breakpoint in due tipi: desktop o mobile. Questo può essere utilizzato per apportare semplici modifiche a un widget per assicurarsi che il suo design funzioni sia per schermi grandi che piccoli. In fase di esecuzione, il widget assumerà il breakpoint appropriato in base al dispositivo che lo visualizza.

Breakpoint Avanzati

La modalità avanzata consente di definire e nominare ambiti di breakpoint specifici basati sulla larghezza massima dei componenti di visualizzazione.

Ad esempio, questo può essere utilizzato per creare un banner incorporabile che si adatta in modo responsivo a diverse dimensioni dello schermo. Il componente di visualizzazione può essere impostato per occupare il 100% della larghezza del suo contenitore e quindi stilizzato in modo diverso a larghezze specifiche per ridurre progressivamente il contenuto visibile nel widget per schermi più piccoli.

Ambito della Variante

L'ambito della variante può essere utilizzato per sovrascrivere determinate proprietà in un widget per creare design alternativi che non sono necessariamente correlati a traduzioni o design responsivo.

Similmente all'ambito della lingua, la variante di un widget è legata all'offerta corrente a cui è associato. Ogni offerta definita nel Portale Fanplayr ha un attributo nome variante e i widget assumono questo valore in fase di esecuzione.

Ad esempio, si potrebbero usare le varianti per creare design alternativi per ogni stagione invece di dover creare un widget completamente nuovo.

Conferma Eliminazione Componente

È importante notare che quando si elimina un componente, esso viene rimosso interamente dal widget, non solo dall'ambito particolare che si sta modificando. Se si desidera che un componente sia nascosto per un particolare ambito (ad esempio, nascosto per dispositivi più piccoli utilizzando un ambito di breakpoint) è sufficiente impostare la proprietà Visible del componente su "hidden" per quell'ambito.

Quando si tenta di eliminare un componente in un widget che ha proprietà con ambito, verrà visualizzata una finestra di dialogo di conferma simile a quella sottostante. Questo per proteggervi dall'eliminazione accidentale di un componente interamente quando la vostra intenzione potrebbe essere stata solo quella di nasconderlo.

Figura: Finestra di dialogo di conferma eliminazione componente

Aggiunta di Componenti ad Ambiti Non Predefiniti

Quando si aggiunge un componente al proprio widget mentre si sta modificando in un ambito non predefinito, le proprietà del componente saranno inizialmente configurate in modo che sia visibile solo per l'ambito corrente. Ciò consente di aggiungere rapidamente e comodamente componenti al proprio widget che sono visibili solo all'ambito di modifica corrente, senza doverli nascondere dagli altri ambiti definiti.

L'editor lo fa automaticamente:

1. Impostando la proprietà Visible predefinita del componente su "hidden".
2. Impostando la proprietà Visible del componente per l'ambito di modifica corrente su "visible".

Ciò fa sì che tutti gli altri ambiti delle proprietà ereditino la proprietà "hidden" dall'ambito predefinito.