Aggiungere widgets

Per iniziare inseriremo un testo all'inizio della finestra del programma che è mostrata in Figura 4. Questo testo spiega all'utente come usare il programma. Questo tipo di widget è chiamato Label e ne puoi aggiungere uno al programma così:

Devi poi seguire più o meno la stessa procedura per inserire ogni tipo di widget disponibile in Qt Designer: selezionalo, inseriscilo e infine modifica le sue proprietà e dimensioni.

Un interessante punto in QT Designer è che i widget possono contenere a loro volta altri widget. Questo sarà dimostrato nel nostro prossimo passo, che è quello di creare dei box di input all'interno di una cornice. Come si vede in Figura 8 abbiamo un po' di label e di text boxes all'interno della cornice. Questa cornice è chiamata Group Box e funziona come contenitore per i labels e le text boxes al suo interno. Iniziamo col creare la cornice selezionando il GroupBox all'interno della finestra Toolbox ->Containers oppure Tools->Containers->GroupBox dalla barra dei menu. Trascina il mouse per creare la box proprio sotto la label che abbiamo creato in precedenza. All'interno dell'Editor delle proprietà puoi cambiare il titolo per modificare il testo all'interno della cornice. Aggiungi i dettagli nel campo del titolo. Puoi così notare un simbolo + all'interno dell'Editor delle proprietà: questo indica che la proprietà ha delle sotto-proprietà che sono state cambiate a loro volta.

Una volta che hai creato il contorno (ad esempio il GroupBox), crea altri tre label come prima ma, quando li disegni, posizionati all'interno della cornice del GroupBox. Puoi così vedere nel box Object Explorer (Windows menu -> Views -> Object Explorer) alla destra come i label siano diventati figli del GroupBox. Guarda la Figura 12 sottostante.

Cambia il testo delle etichette facendo doppio-click sopra di esse.

Una volta che hai fatto questo, passiamo a creare le text boxes. Serviranno all'utente per inserire il suo nome e indirizzo email. Usiamo il più semplice tipo di text boxes: un widget chiamato QLineEdit che permette all'utente di inserire una sola linea di testo alla volta. Crea due QLineEdit: una per il nome e l'altra per l'indirizzo email attraverso il menu Tools, Input e in seguito LineEdit; disegnale vicino ai label 'tuo nome' e 'tuo indirizzo' rispettivamente.

I commenti intelligenti saranno scelti dall'utente. Usiamo perciò una ComboBox che presenterà all'utente tre commenti tra cui scegliere. Fai click sull'icona ComboBox o selezionala attraverso il menu Tools-> Input-> ComboBox. Disegnala vicino al label 'Commento intelligente'. Fai doppio-click sulla ComboBox. Apparirà una finestra in cui puoi aggungere le 3 scelte da presentare all'utente. Fai click sul bottone 'New Item' e scrivi i commenti nella text box alla sua destra. Fai nuovamente click su 'New Item' per il secondo e il terzo commento. Alla fine fai click su OK quando hai finito.

Aggiusta le dimensioni dei differenti widgets così che sia posizionati in un modo carino.

Dare un nome i nostri widgets: Fino ad ora non abbiamo dato nessun nome ai widget posizionati nella Form. E' molto utile mettere un nome interno per i widget, così da poterli chiamare facilmente all'interno del programma. I labels non svolgono nessuna azione, per cui non c'è bisogno di assegnare loro un nome. Ma gli altri widget sono molto importanti, come ad esempio le text boxes. Avremo bisogno di gestire i dati in ingresso da tre widget e quindi dobbiamo dare loro dei nomi, così da poterli richiamare in futuro facilmente e velocemente. I nomi devono avere un senso oltre che indicare la funziona del widget. I nomi sono assegnati attraverso la proprietà all'inizio dell'Editor delle proprietà. Chiamiamo quindi la prima LineEdit nameBox e la seconda mailBox. Mentre ComboBox commBox. Facendo ciò avremo accesso ai commenti. Per cui fai click su ognuna LineEdit e, all'interno dell'Editor delle proprietà, scrivi nameBox e mailBox nel campo proprio soto il nome. Stessa procedura per il ComboBox e chiamalo commBox.

Completiamo il design grafico aggiungendo una label con scritto 'Firma Generata' come testo. Sotto di essa aggiungiamo un TextEdit (Tools->Input->TextEdit) dove la firma generata sarà visualizzata. Rinominiamolo 'sigBox'. E infine aggiungiamo due PushButtons alla fine della finestra ('Crea!' e 'Cancel'). Non hanno bisogno di nomi, ma li puoi modificare se preferisci.

Salva la tua form. Puoi ora avere una veloce preview selezionanado il menu Preview-> Preview Form.

Figura 13: La Form prima della gestione dei layout