Comincio con questo articolo una breve serie di pubblicazioni che avranno come argomento la programmazione in Qt. In questo primo articolo illustrerò come sviluppare il classico "Hello world". Il prossimo articolo invece sarà un po' più complesso, si tratterà di accedere ed interagire con un database.
Per scrivere la nostra prima applicazione abbiamo bisogno di pochi strumenti: il toolkit Qt (disponibile non solo per GNU/Linux) ed un editor di testo.
Il toolkit Qt comprende le librerie Qt ed alcuni software, tra cui troviamo un compilatore ed una interfaccia per disegnare le GUI. In questo articolo la versione del toolkit Qt utilizzata è la 3.3.
Qt Designer
Con il comando
designersi avvia l'editor di interfacce grafiche. All'avvio un wizard ci chiede l'operazione che vogliamo eseguire. Qui possiamo scegliere Dialog.
La nostra prima applicazione sarà il classico Hello World.
Per prima cosa inseriamo tramite la palette degli strumenti laterali due PushButton. Li posizioniamo uno in alto nel form ed uno in basso.
Successivamente inseriamo un controllo di tipo TextLabel al centro del form.
Ora possiamo impostare alcune proprietà di questi oggetti tramite la palette "Properties". Selezioniamo il primo PushButton e modifichiamo la proprietà text scrivendo
&HelloIl contenuto del pulsante dovrebbe cambiare in "Hello". Da notare il fatto che (come in altri ambienti di sviluppo di interfaccie) il simbolo & anteposto ad un altro carattere, abilita la scorciatoia da tastiera su quel carattere.
Per il secondo pulsante invece scriveremo:
&CloseCancelliamo quindi il contenuto della proprietà text dell'oggetto di tipo TextLabel.
Signal & Slot
Un aspetto fondamentale della programmazione tramite le librerie Qt è il meccanismo di comunicazione Signal & Slot. Tale metodo permette di associare ad un evento una certa funzione.
Nel nostro caso possiamo quindi associare la funzione Close() al pulsante di chiusura appena creato in pochi semplici passi.
Dal menu edit selezioniamo la voce connections per aprire la finestra di gestione delle connessioni, da qui clicchiamo sul pulsante new. Alla voce Sender selezioniamo il pulsante pushButton2, come segnale clicked(), il ricevitore è il form1 ed infine la funzione da eseguire (lo slot) che in questo caso sarà close().
Possiamo quindi salvare il progetto in una directory di prova, con il nome form1.ui.
Il programma principale
Con un editor di testo creiamo un file di nome main.cpp all'interno della directory di prova contenente il file .ui dell'interfaccia.
Il codice di main.cpp è banale:
#include <qapplication.h>
#include "form1.h"
main (int argc, char *argv[]) {
QApplication app(argc, argv);
Form1 *form1=new Form1;
app.setMainWidget(form1);
form1->show();
return app.exec();
}Anche chi non conosce la sintassi di C/C++ non dovrebbe far fatica a capire questo codice. In breve si includono due header, il primo relativo alla classe QApplication, il secondo relativo al form che abbiamo creato precedentemente tramite il Qt Designer. Il programma istanzia la classe QApplication e genera la finestra principale che viene agganciata alla classe.
A questo punto possiamo compilare l'applicazione che, allo stato attuale, avrà un pulsante di chiusura funzionante ed un pulsante inutilizzato.
Per questo dobbiam prima preparare il file di progetto con il comando qmake. Da una shell ci posizioniamo nella directory che contiene i file form1.ui e main.cpp e digitiamo:
qmake -project
qmakeCosì facendo otterremo il Makefile, il file form1.h e, se la directory si chiama "hello", avremo il file hello.pro. Ora possiamo compilare il programma tramite.
makeper ottenere il file eseguibile (con il nome del file di progetto senza l'estensione .pro).
Il pulsante Hello!
Ora che abbiamo creato la nostra applicazione principale possiamo cominciare ad aggiungere un po' di funzionalità. Per prima cosa clicchiamo con il tasto destro del mouse nella form e selezioniamo la voce Source. Creiamo il nuovo file ui.h. A questo punto possiamo creare la funzione (slot) che sarà attivata dal pulsante pushButton1.
void Form1::showLabel() {
QString s = "Hello my Friend";
textLabel1->setText(s);
}Anche qui il codice è banale: si crea un oggetto s di tipo QString e gli si assegna il valore desiderato, all'etichetta textLabel1 si imposta quindi la proprietà text tramite il metodo setText.
Fatto questo possiamo tornare nella finestra di gestione delle connessioni e crearne una nuova dove il sender sarà pushButton1, il segnale clicked() ed il ricevitore form1. Questa volta invece lo slot sarà showLabel().
Ricompiliamo il nostro progetto per ottenere il nostro primo semplice programma in Qt.
Bravo! Finalmente cominci ad ascoltarmi :)
Intanto uno screenshot di kdevelop con designer integrato:
http://www.kdevelop.org/doc/technotes/cpprad1.png
Poi un consiglio: fai vedere anche il codice generato, così da vedere la gestione dei segnali e degli slot.
Ora invece una domanda: Fanculo anche alla qstring! Si può usare invece la classe string delle stl? C'è integrazione tra le qt e l'stl?
Per quanto riguarda il codice che ho generato allego un file con tutto il progetto.
Mi sono un attimo documentato a proposito della STL: nel sito della Trolltech si trova una pagina con la spiegazione di come usare codice STL all'interno del codice per Qt...
Nel frattempo ho provato a scrivere una piccola applicazione in Qt che si connette ad un DB, per ora sembra abbastanza banale il funzionamento. Devo però approfondire se ad esempio il widget DataTable si può gestire in maniera migliore e come vanno utilizzati gli altri widget per l'accesso ai dati. Comunque il tutto sembra abbastanza semplice ed intuitivo.
Bene per caso si fa anche in modo visuale? Ovviamente adesso aspetto un articoletto sul collegamento al database e magari qualche commento sui campi di lookup, se si possono fare e magari se si possono integrare in una griglia.
Sì, si riesce a farlo in modo visuale, non è male l'interfaccia, devo finire un paio di prove, entro un paio di giorni scriverò un resoconto e... ok, ci saranno anche degli screenshot :-)
Grande!!! Semplice chiaro ed efficace. Se fossero tutti come te linux sarebbe molto più diffuso. Complimenti anche x il resto del sito molto ben fatto con una grafica molto gradevole.
Grazie x "l'introduzione a QT".
Enrico
Prego Enrico, grazie a te per esserti fermato qui! :-)
Aspettando: "Il prossimo articolo invece sarà un po' più complesso, si tratterà di accedere ed interagire con un database" mi sono fermato su tuo: "Comunque il tutto sembra abbastanza semplice ed intuitivo." e mi sono vergognato e depresso. In realtà con qt aperto è stato semplice connettersi ad un database MySQL e visualizzare tabelle ma una volta compilato il programmino non funziona +. Mi sfugge qualcosa di abbastanza grosso credo tipo la gestione delle classi qsqldatabase ecc..
Mi puoi aiutare?
Grazie enrico
Ciao ho provato a seguire il tuo tutorial ma mi sono imbattuto in un errore, credo per mia ignoranza.
Dopo aver diligentemente creato i 2 file da te spiegati
form1.ui e main.cpp dopo aver lanciato qmake -project e qmake
non mi esce un form1.h ma un ui_form1.h devo crearlo a mano il form1.h? se si come?
Ho provato anche a fare
#include "ui_form1.h"
ma poi andando a lanciare make mi da i seguenti errori
main.cpp:6: error: ‘Form1’ was not declared in this scope
main.cpp:6: error: ‘form1’ was not declared in this scope
main.cpp:6: error: expected type-specifier before ‘Form1’
main.cpp:6: error: expected ‘;’ before ‘Form1’
main.cpp:7: error: ‘class QApplication’ has no member named ‘setMainWidget’
Ammetto di aver copincollato il codice del main.cpp può essere quello il problema?
Grazie Alan