Capitolo 7. Interazioni logiche tra gli elementi della GUI

Logica della GUI

Tutti i concetti di base per la creazione di un'estensione per RKWard sono stati descritti nei capitoli precedenti. Tali concetti di base dovrebbero essere sufficienti per molti, se non nella maggior parte dei casi. Tuttavia, a volte si potrebbe desiderare un maggiore controllo sul comportamento della GUI della propria estensione.

Ad esempio, supponiamo di voler estendere l'esempio del test t utilizzato in questa documentazione per consentire entrambi: il confronto di una variabile con un'altra variabile (come mostrato) e il confronto di una variabile con un valore costante. Ora, un modo per farlo sarebbe quello di aggiungere un controllo radio che commuta tra le due modalità e aggiungere una casella di selezione per inserire il valore costante da confrontare. Considera questo esempio semplificato:

<!DOCTYPE rkplugin>
<document>
        <code file="code.js"/>

        <dialog label="T-Test">
                <row>
                        <varselector id="vars"/>
                        <column>
                                <varslot id="x" types="number" source="vars" required="true" label="compare"/>
                                <radio id="mode" label="Compare against">
                                        <option value="variable" checked="true" label="another variable (select below)"/>
                                        <option value="constant" label="a constant value (set below)"/>
                                </radio>
                                <varslot id="y" types="number" source="vars" required="true" label="variable" i18n_context="Noun; a variable"/>
                                <spinbox id="constant" initial="0" label="constant" i18n_context="Noun; a constant"/>
                        </column>
                </row>
        </dialog>
</document>
        

Fin qui tutto bene, ma ci sono diversi problemi con questa GUI. Innanzitutto vengono sempre visualizzati sia il varslot che la spinbox, mentre solo uno dei due viene realmente utilizzato. Peggio ancora, varslot richiede sempre una selezione valida, anche se confrontata con una costante. Ovviamente, se creiamo una GUI in questo modo, vogliamo maggiore flessibilità. Immettere: la sezione <logic> (inserita allo stesso livello di <code>, <dialog> o <wizard>).

[...]
        <code file="code.js"/>

        <logic>
                <convert id="varmode" mode="equals" sources="mode.string" standard="variable" />

                <connect client="y.visible" governor="varmode" />
                <connect client="constant.visible" governor="varmode.not" />
        </logic>

        <dialog label="T-Test">
        [...]
        

La prima riga all'interno della sezione logica è un tag <convert>. Fondamentalmente, questo fornisce una nuova proprietà booleana (on o off, true o false), che può essere utilizzata in seguito. Questa proprietà ("varmode") è vera ogni volta che viene selezionato il pulsante di opzione superiore e falsa ogni volta che viene selezionato il pulsante di opzione inferiore. Come si fa?

Innanzitutto, sotto sources, sono elencate le proprietà delle fonti su cui lavorare (in questo caso solo una ciascuna; potresti elencarne diverse come sources="mode.string;somethingelse", quindi "varmode" sarebbe vero solo se sia "mode.string" che "qualcosa" sono uguali alla stringa "variabile"). Notare che in questo caso non scriviamo solo "mode" (come faremmo in getString("mode")), ma "mode.string". Questo è in realtà il modo interno in cui funziona un radiocomando: ha una proprietà «string», che ne mantiene il valore stringa. getString("mode") è solo una scorciatoia ed equivalente a getString("mode.string"). Vedere il riferimento per tutte le proprietà dei diversi elementi della GUI.

In secondo luogo, impostiamo la modalità di conversione su mode="uguale a". Ciò significa che vogliamo verificare se la(e) fonte(i) è(sono) uguale a un certo valore. Infine standard è il valore con cui confrontare, quindi con standard="variabile", controlliamo se la proprietà "mode.string" è uguale alla stringa "variabile" (il valore dell'opzione radio superiore). Se è uguale, la proprietà varmode è vera, altrimenti è falsa.

Veniamo ora alle cose reali: <connect> la proprietà "varmode" a y.visible, che controlla se il varslot "y" viene mostrato o meno. Tenere presente che qualsiasi elemento reso invisibile è implicitamente non obbligatorio. Pertanto, se viene selezionata l'opzione radio superiore, il varslot "y" è richiesto e visibile. Altrimenti non è richiesto e nascosto.

Per la spinbox, vogliamo l'esatto contrario. Fortunatamente, non abbiamo bisogno di un altro <convert> per questo: le proprietà booleane possono essere negate molto facilmente aggiungendo il modificatore "not", quindi <connect> "varmode.not" alla proprietà di visibilità della casella numerica. In effetti, viene mostrato e richiesto il varslot, o la casella numerica - a seconda dell'opzione selezionata nel radiocomando. La GUI si sta modificando in base all'opzione radio. Provare l'esempio, se lo si desidera.

Per un elenco completo delle proprietà, fare riferimento alla guida. Un'altra proprietà, tuttavia, è speciale in quanto tutte gli elementi della GUI la hanno: «enabled». Questo è leggermente meno drastico di «visibile». Non mostra/nasconde l'elemento della GUI, ma lo abilita/disabilita solamente. Gli elementi disabilitati sono generalmente visualizzati in grigio e non reagiscono al comando dell'utente.

Nota

Oltre a <convert> e <connect>, sono disponibili diversi altri elementi utilizzabili nella sezione <logic>. Ad esempio, i costrutti condizionali possono essere implementati anche utilizzando l'elemento <switch>. Per maggiori dettagli, consultare il riferimento sugli elementi logici.