Nei capitoli precedenti abbiamo cominciato a lavorare sulle interfacce dando una prima schematizzazione grafica dell’applicazione e cominciando a parlare di eventi associati a pulsanti. Il metodo più ovvio per comunicare con l‘utente finale è comunque il contenuto, quindi, prima di proseguire nel nostro tutorial su XUL, approfondiamo l'argomento testo.

Facendo un paragone con HTML, per permettere all’utente di immettere testo ci servirebbe un oggetto equivalente al tag input. La controparte di XUL si chiama textbox, ma al contrario dell’HTML è possibile inserire molto più di una singola riga, se correttamente descritto dai suoi attributi.
L’attributo multiline permette l’inserimento di più righe, ma è necessario distinguere tra il numero di linee possibili per l’inserimento e il numero di linee visualizzate. Nel caso il primo numero superi il secondo allora comparirà una barra a scorrimento verticale. Il numero di linee visualizzate è esprimibile tramite l’attributo rows, mentre value, similmente ad HTML, permette di specificare un testo di default da visualizzare nel campo testo.

Il numero massimo di testo possibile è invece specificato da maxlength mentre size ne specifica il numero di caratteri. Infine timeout, ultimo attributo dell’oggetto textbox permette la temporizzazione di eventi, ma ne parleremo in seguito.

Dopo aver specificato gli attributi parliamo dei tipi di textbox: XUL ne prevede quattro in base alle funzionalità che devono ricoprire, e oltre a quella base nei nostri progetti possiamo utilizzare autocomplete che prevede le funzionalità di auto completamento, password che non permette la visualizzazione del testo quando questo viene inserito dall’utente, e timed, che utilizzato in congiunzione con l’attributo timeout, aggiunge la possibilità di applicare un ritardo dopo che il testo viene inserito nella textbox.

Di solito in congiunzione con le textbox vengono utilizzate anche le etichette o label, le quali consistono appunto in semplici linee di testo esplicative:La differenza con il tag description, visto nei capitoli precedenti che sicuramente ricorderete, è che una label può essere associata anche ad altri componenti tramite l’attributo control che specifica l’id del componente a cui associare l’etichetta stessa. Ad esempio, se una textbox ha un identificatore "tb" l’attributo control da assegnare alla label sarà specificato così:Facciamo un esempio ancora più completo. Se volessimo realizzare un campo di testo a riga singola, ma che permetta l’inserimento di più linee di testo scriveremmo:Ovviamente per gestire la visualizzazione abbiamo associato del codice JavaScript al gestore degli eventi, che controlla il bottone di visualizzazione. Come si può notare l’accesso del codice al contenuto dell’oggetto è ottenuto tramite il DOM e il metodo getElementByID nel più classico degli stili JavaScript. Il DOM diventa quindi fondamentale anche per XUL, come vedremo nei prossimi capitoli.

Infine per vedere la differenza tra i vari tipi di textbox provate a sostituire la definizione dell’elemento con:A parte l’ovvia inutilità di visualizzare la password segreta potete osservare come l’utilità della box cambia radicalmente.

• Pubblicazioni correlate:
• 25-02-2009 Un tutorial su XUL: introduzione (1/25)
• 26-02-2009 Un tutorial su XUL: documentazione e riferimenti (2/25)
• 27-02-2009 Un tutorial su XUL: i vantaggi del linguaggio (3/25)
• 02-03-2009 Un tutorial su XUL: i benefici per la personalizzazione (4/25)
• 03-03-2009 Un tutorial su XUL: tecnologie esterne (5/25)
• 06-03-2009 Un tutorial su XUL: approccio al linguaggio (6/25)
• 10-03-2009 Un tutorial su XUL: struttura del linguaggio (7/25)
• 11-03-2009 Un tutorial su XUL: i file manifesto (8/25)
• 16-03-2009 Un tutorial su XUL: un primo programma (9/25)
• 17-03-2009 Un tutorial su XUL: finestre e box (10/25)
• 18-03-2009 Un tutorial su XUL: bottoni (11/25)
• 24-03-2009 Un tutorial su XUL: le immagini (13/25)
• 27-03-2009 Un tutorial su XUL: liste e tabelle (14/25)
• 31-03-2009 Un tutorial su XUL: un primo approccio ai menu (15/25)
• 01-04-2009 Un tutorial su XUL: menu evoluti (16/25)
• 06-04-2009 Un tutorial su XUL: barre degli strumenti (17/25)
• 17-04-2009 Un tutorial su XUL: alberi (18/25)
• 23-04-2009 Un tutorial su XUL: alberi dinamici (19/25)