Aller au menu - Aller au contenu

[Plan du site] Vous êtes ici --- > Le Site du Zéro > Les tutoriels > Officiels > Programmation > Apprenez à programmer en C++ ! > [Pratique] Créez vos propres fenêtres avec Qt > Compiler votre première fenêtre Qt > Lecture du tutoriel

Compiler votre première fenêtre Qt

Avatar
Auteur : M@teo21
Note : 18 / 20 (19 votes)
Visualisations : 92 732

Plus d'informations Plus d'informations
Bonne nouvelle, votre patience et votre persévérance vont maintenant payer :)
Dans ce chapitre, nous réaliserons notre premier programme utilisant Qt, et nous verrons comment ouvrir notre première fenêtre !

La compilation sous Qt est un peu particulière car elle comporte plusieurs étapes. Je vais vous expliquer pourquoi la compilation avec Qt est différente et comment vous devez procéder pour compiler votre programme.

Let's go !
Sommaire du chapitre :
Icône du chapitre
Chapitre précédent Sommaire Chapitre suivant

Codons notre première fenêtre !

Ok on est parti !
Voilà comment on va procéder : ouvrez votre IDE favori, par exemple Code::Blocks, et créez un nouveau projet console C++ comme vous le faisiez jusqu'ici. Appelez ce projet comme vous voulez, par exemple "Test". Placez votre projet dans un dossier qui ne contient pas d'espace dans le nom, c'est important pour la suite.

Sous Code::Blocks, il y a un assistant de création de nouveau projet Qt. Faites un projet console. J'insiste bien là-dessus, ne vous trompez pas ;)


Le code minimal d'un projet Qt



Votre projet est constitué normalement au départ d'un seul fichier : main.cpp.
Supprimez le code qui a pu être généré par votre IDE, et remplacez-le par celui-ci :

Code : C++
1
2
3
4
5
6
7
8
#include <QApplication>
 
int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
 
    return app.exec();
}


C'est le code minimal d'une application utilisant Qt !

Comme vous pouvez le constater, ce qui est génial c'est que c'est vraiment très court :D
D'autres bibliothèques vous demandent beaucoup plus de lignes de code avant de pouvoir commencer à programmer, tandis qu'avec Qt c'est vraiment très simple et rapide :)

Analysons ce code pas à pas !


Includes un jour, includes toujours



Code : C++
1
#include <QApplication>


C'est le seul include que vous avez besoin de faire au départ. Vous pouvez oublier iostream et compagnie, avec Qt on ne s'en sert plus.
Vous noterez qu'on ne met pas l'extension ".h", c'est voulu. Faites exactement comme moi.

Cet include vous permet d'accéder à la classe QApplication, qui est la classe de base de tout programme Qt.


QApplication, la classe de base



Code : C++
1
QApplication app(argc, argv);


La première ligne du main crée un nouvel objet de type QApplication. On a fait ça tout le long des derniers chapitres, vous ne devriez pas être surpris ;)
Cet objet est appelé app (mais vous pouvez l'appeler comme vous voulez). Le constructeur de QApplication exige que vous lui passiez les arguments du programme, c'est-à-dire les paramètres argc et argv que reçoit la fonction main. Cela permet de démarrer le programme avec certaines options précises, mais on ne s'en servira pas ici.


Lancement de l'application



Code : C++
1
return app.exec();


Cette ligne fait 2 choses :
  1. Elle appelle la méthode exec de notre objet app. Cette méthode démarre notre programme. Si vous ne le faites pas il ne se passera rien.
  2. Elle retourne le résultat de app.exec() pour dire si le programme s'est bien déroulé ou pas. Le return provoque la fin de la fonction main, donc du programme.

C'est un peu du condensé en fait :p
Ce que vous devez vous dire, c'est qu'en gros tout notre programme s'exécute à partir de ce moment-là. La méthode exec est gérée par Qt : tant qu'elle s'exécute, notre programme est ouvert. Dès que la méthode exec est terminée, notre programme s'arrête.


Affichage d'un widget



Dans la plupart des bibliothèques GUI, dont Qt fait partie, tous les éléments d'une fenêtre sont appelés des widgets. Les boutons, les cases à cocher, les images... tout ça ce sont des widgets. La fenêtre elle-même est considérée comme un widget.

Pour provoquer l'affichage d'une fenêtre, il suffit de demander à afficher n'importe quel widget. Ici par exemple, nous allons afficher un bouton.

Voici le code complet que j'aimerais que vous utilisiez. Il utilise le code de base de tout à l'heure mais y ajoute quelques lignes :

Code : C++
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
#include <QApplication>
#include <QPushButton>
 
int main(int argc, char *argv[])
{
    QApplication app(argc, argv);
 
    QPushButton bouton("Salut les Zéros, la forme ?");
    bouton.show();
 
    return app.exec();
}


Les lignes ajoutées ont été surlignées pour bien que vous puissiez les repérer.
On voit entre autres :

Code : C++
1
#include <QPushButton>


Cette ligne va vous permettre de créer des objets de type QPushButton, c'est-à-dire des boutons (vous noterez que sous Qt toutes les classes commencent par un "Q" d'ailleurs !).

Code : C++
1
QPushButton bouton("Salut les Zéros, la forme ?");


Cela crée un nouvel objet de type QPushButton que nous appelons tout simplement bouton, mais on aurait très bien pu l'appeler autrement. Le constructeur attend un paramètre : le texte qui sera affiché sur le bouton.

Malheureusement, le fait de créer un bouton ne suffit pas pour qu'il soit affiché. Il faut appeler sa méthode show :

Code : C++
1
bouton.show();


Et voilà !
Cette ligne commande l'affichage d'un bouton. Comme un bouton ne peut pas "flotter" comme ça sur votre écran, Qt l'insère automatiquement dans une fenêtre. On a en quelque sorte créé une "fenêtre-bouton" :p

Bien entendu, dans un vrai programme plus complexe, on crée d'abord une fenêtre et on y insère ensuite plusieurs widgets, mais là on commence simplement ;)

Notre code est prêt, il ne reste plus qu'à compiler et exécuter le programme !

:euh:

... mais, pour compiler avec Qt c'est un peu particulier. On ne pourra pas se contenter de cliquer sur le bouton "Compiler" de l'IDE.
Je vais maintenant vous expliquer comment procéder pour compiler avec Qt, et je vous rassure ça n'a rien de compliqué, c'est juste un peu différent !

Compiler un projet Qt : la théorie

La bibliothèque Qt est tellement importante qu'elle apporte quelques ajouts au langage C++, en particulier le mécanisme des signaux et slots dont on reparlera un peu plus loin.

Pour ajouter ces fonctionnalités au langage C++, la compilation sort du schéma classique. On va en profiter ici pour revoir (ou voir pour certains :p ) comment la compilation fonctionne d'habitude dans les grandes lignes, puis nous découvrirons comment il faut compiler un programme utilisant Qt.


La compilation "normale", sans Qt



Savez-vous vraiment ce qui se passe lorsque vous cliquez sur "Compiler" dans votre IDE favori (Code::Blocks, Visual Studio...) ?
Il y a en fait 2 grosses étapes :

  1. L'IDE regarde la liste des fichiers de votre projet (.cpp et .h) et génère un fichier appelé Makefile qui contient la liste des fichiers à compiler pour le compilateur.
  2. Ensuite, l'IDE appelle le compilateur (via le programme make). L'utilitaire make recherche un fichier Makefile et l'utilise pour savoir quoi compiler et avec quelles options.


Schématiquement ça donne ça :

Compilation et makefile


En fait, le gros avantage de l'IDE c'est qu'il écrit le fichier Makefile pour vous. On peut écrire le Makefile à la main, mais c'est honnêtement pas très pratique ni toujours très simple, surtout pour de gros projets. En effet, le fichier Makefile est parfois très gros.

Voici un aperçu (raccourci) d'un fichier Makefile pour vous donner une idée :

Code : Autre
1
2
3
4
5
6
7
all: $(PROG)
 
$(PROG): $(OBJS)
     $(CC) $(CFLAGS) $(LDFLAGS) $(LDLIBS) -o $(PROG) $(OBJS)
 
.c.o:
     $(CC) $(CFLAGS) -c $*.c


Qu'un IDE génère le Makefile pour nous n'est donc pas du luxe ^^


La compilation particulière avec Qt



Le problème survient quand vous utilisez des bibliothèques importantes comme Qt. Il faut configurer votre IDE pour qu'il puisse écrire le Makefile correctement, c'est-à-dire indiquer l'emplacement des fichiers .a (ou .lib), des headers de la bibliothèque, etc.

On pourrait en théorie configurer votre IDE pour que ça marche en cliquant sur "Compiler"... mais ce serait un peu long et compliqué (il faudrait une explication par IDE, et parfois par version d'IDE). J'ai à la place choisi de vous montrer une technique universelle : passer par la ligne de commande ! :D

:euh:

Bah pourquoi tout le monde est parti ?
Je vous rassure, ce n'est pas aussi infaisable que ce que vous pouvez croire, ce sera même plus simple que de configurer notre IDE, c'est vous dire ^^

Qt est livré avec un petit programme en ligne de commande appelé "qmake". Ce programme est capable de générer un fichier Makefile à partir d'un fichier spécifique à Qt : le .pro.
Le .pro (qui s'appelle en général nomDeVotreProjet.pro) est un fichier texte court et simple à écrire qui donne la liste de vos fichiers .cpp et .h, ainsi que les options à envoyer à Qt.

Sous Linux, la commande n'est pas qmake mais qmake-qt4.


Ca se passe donc comme ça avec Qt :
Compilation avec qmake


... Je suis obligé d'écrire moi-même le .pro ? Je ne sais pas faire ! Et puis faire la liste des fichiers du projet ça peut être long non ? :euh:


Rassurez-vous, Qt peut vous générer un .pro automatiquement ! Si on utilise d'abord qmake avec l'option -project dans le dossier de notre projet, qmake va analyser les fichiers du dossier et générer un fichier .pro basique (mais suffisant pour nous pour le moment).

Compilation avec qmake


En résumé, pour compiler avec Qt il y a 3 commandes très simples à taper en console. Dans l'ordre :

  1. qmake -project
  2. qmake
  3. make


Normalement, il n'est nécessaire de taper les 2 premières commandes (qmake -project et qmake) que la première fois pour générer le Makefile. Ensuite, vous n'aurez plus besoin que de relancer make pour recompiler votre projet.

Il faudra en fait relancer les commandes qmake -project et qmake à chaque fois que votre projet évoluera, c'est-à-dire à chaque fois que de nouveaux fichiers .cpp et .h seront ajoutés ou supprimés. Tant que la liste des fichiers de votre projet ne change pas, il n'est pas nécessaire de retaper ces 2 premières commandes.

Compiler un projet Qt : la pratique

Bien, si on la compilait cette fenêtre ? :D

Pour commencer, il faut lancer une console. Sous Windows, Qt vous a normalement fait un raccourci dans le menu démarrer appelé "Qt Command Prompt" :

Qt Raccourci


Attention : vous savez peut-être lancer la console sous Windows en passant par un autre raccourci ou encore en faisant Démarrer / Exécuter / "cmd.exe". Mais ici, vous devez utiliser ce raccourci car il précharge certaines informations relatives à Qt.


Normalement, la console s'ouvre et affiche ces informations :

Code : Console
Setting up a MinGW/Qt only environment...
-- QTDIR set to C:\Qt\4.3.2
-- PATH set to C:\Qt\4.3.2\bin
-- Adding C:\MinGW\bin to PATH
-- Adding C:\WINDOWS\System32 to PATH
-- QMAKESPEC set to win32-g++
 
C:\Qt\4.3.2>


Les premières lignes sont importantes. Elles signifient que dans cette console le compilateur connaîtra la position de la bibliothèque Qt ainsi que de ses headers. Ca nous enlève beaucoup beaucoup de maux de tête avec les paramétrages ;)

Pour l'instant, la console indique que nous sommes dans le dossier C:\Qt\4.3.2 (le chemin peut changer en fonction de la version de Qt mais ce n'est pas grave du tout).
Je veux que vous vous rendiez dans le dossier où est enregistré votre projet. Pour cela, le plus simple est de taper dans la console :

Code : Console
cd CheminDeVotreProjet


Attention : vous ne pourrez pas compiler avec make si le nom du dossier de votre projet comporte un espace. Veillez à placer votre projet dans un dossier qui ne contient pas d'espace.


Si vous copiez-collez le chemin depuis l'explorateur de Windows ça devrait aller très vite (il faudra faire un clic droit pour coller le texte dans la console).

Fichiers du premier projet Qt


Dans mon cas j'écrirai donc la commande suivante :

Code : Console
cd C:\Users\Mateo\Projets\Test


Tapez Entrée. Vous devriez vous retrouver dans le dossier de votre projet.


Etape 1 : générer le .pro (qmake -project)



On va commencer par générer le fichier .pro automatiquement. Vous vous souvenez de la commande ? :)

Code : Console
C:\Users\Mateo\Projets\Test>qmake -project
 
C:\Users\Mateo\Projets\Test>


Si tout se passe bien, rien de spécial ne devrait s'afficher après avoir tapé la commande. Par contre, si vous regardez le dossier de votre projet, il contient maintenant un fichier .pro :

Fichiers du premier projet Qt avec le .pro


On ne va pas étudier le contenu du fichier .pro maintenant, mais sachez que vous pouvez l'ouvrir avec un éditeur de texte comme Bloc-Notes sans problème.

Passons à l'étape suivante !

Etape 2 : générer le Makefile (qmake)



Retournez dans la console et tapez tout simplement qmake (sans le -project cette fois).

Code : Console
C:\Users\Mateo\Projets\Test>qmake
 
C:\Users\Mateo\Projets\Test>


Encore une fois, rien de particulier ne devrait s'afficher à l'écran, mais cette fois le fichier Makefile a été généré. Vous devriez en fait trouver plusieurs Makefiles et dossiers (selon si on compile en mode "Debug" pour le débogage, ou "Release" pour la compilation finale lorsque le programme est prêt à être distribué).

Fichiers du premier projet Qt avec le Makefile


Vous pouvez ouvrir par exemple le fichier qui s'appelle "Makefile" (tout court, sans extension) avec un éditeur de texte comme Bloc-Notes. Vous constaterez que ce fichier, destiné à make, est beaucoup plus gros que le .pro. On ne modifiera jamais le Makefile, contrairement au .pro que l'on peut s'amuser à modifier facilement.

Etape 3 : compiler (make)



Il ne vous reste plus qu'à taper make dans la console pour lancer le compilateur ! Celui-ci va rechercher automatiquement le fichier "Makefile" dans le dossier dans lequel vous vous trouvez.

Code : Console
C:\Users\Mateo\Projets\Test>make
mingw32-make -f Makefile.Release
mingw32-make[1]: Entering directory `C:/Users/Mateo/Projets/Test'
g++ -c -O2 -frtti -fexceptions -mthreads -Wall -DUNICODE -DQT_LARGEFILE_SUPPORT
-DQT_DLL -DQT_NO_DEBUG -DQT_GUI_LIB -DQT_CORE_LIB -DQT_THREAD_SUPPORT -DQT_NEEDS
_QMAIN -I"..\..\..\..\Qt\4.3.2\include\QtCore" -I"..\..\..\..\Qt\4.3.2\include\Q
tCore" -I"..\..\..\..\Qt\4.3.2\include\QtGui" -I"..\..\..\..\Qt\4.3.2\include\Qt
Gui" -I"..\..\..\..\Qt\4.3.2\include" -I"." -I"c:\Qt\4.3.2\include\ActiveQt" -I"
release" -I"." -I"..\..\..\..\Qt\4.3.2\mkspecs\win32-g++" -o release\main.o main
.cpp
g++ -enable-stdcall-fixup -Wl,-enable-auto-import -Wl,-enable-runtime-pseudo-rel
oc -Wl,-s -mthreads -Wl -Wl,-subsystem,windows -o "release\Test.exe" release\mai
n.o  -L"c:\Qt\4.3.2\lib" -lmingw32 -lqtmain -lQtGui4 -lQtCore4
mingw32-make[1]: Leaving directory `C:/Users/Mateo/Projets/Test'
 
C:\Users\Mateo\Projets\Test>


Contrairement à qmake, la commande make est un poil plus bavarde :D
Vous voyez toutes les options qui ont été envoyées au compilateur... Et y'en a un paquet !

Le compilateur se charge de compiler tous les fichiers qui ont été modifiés depuis la dernière compilation, puis il appelle le linker pour assembler tous les fichiers objet en un bel exécutable.
Si ce que je viens de vous dire à l'instant est du chinois pour vous, c'est que vous n'avez sûrement pas lu ça.

Si par hasard il y a une erreur de compilation sur un des fichiers, l'erreur s'affichera dans la console. On vous indiquera dans quel fichier et à quelle ligne se trouve l'erreur, après il ne vous reste plus qu'à la corriger ;)

Pensez à configurer votre IDE dans les options pour qu'il affiche les numéros de ligne si ce n'est déjà fait, je ne veux pas vous voir "compter" les lignes à la main pour retrouver la ligne de l'erreur.


Résumé des commandes



En résumé, j'ai tapé les commandes suivantes :

Code : Console
Setting up a MinGW/Qt only environment...
-- QTDIR set to C:\Qt\4.3.2
-- PATH set to C:\Qt\4.3.2\bin
-- Adding C:\MinGW\bin to PATH
-- Adding C:\Windows\System32 to PATH
-- QMAKESPEC set to win32-g++
 
C:\Qt\4.3.2>cd C:\Users\Mateo\Projets\Test
 
C:\Users\Mateo\Projets\Test>qmake -project
 
C:\Users\Mateo\Projets\Test>qmake
 
C:\Users\Mateo\Projets\Test>make
mingw32-make -f Makefile.Release
mingw32-make[1]: Entering directory `C:/Users/Mateo/Projets/Test'
g++ -c -O2 -frtti -fexceptions -mthreads -Wall -DUNICODE -DQT_LARGEFILE_SUPPORT
-DQT_DLL -DQT_NO_DEBUG -DQT_GUI_LIB -DQT_CORE_LIB -DQT_THREAD_SUPPORT -DQT_NEEDS
_QMAIN -I"..\..\..\..\Qt\4.3.2\include\QtCore" -I"..\..\..\..\Qt\4.3.2\include\Q
tCore" -I"..\..\..\..\Qt\4.3.2\include\QtGui" -I"..\..\..\..\Qt\4.3.2\include\Qt
Gui" -I"..\..\..\..\Qt\4.3.2\include" -I"." -I"c:\Qt\4.3.2\include\ActiveQt" -I"
release" -I"." -I"..\..\..\..\Qt\4.3.2\mkspecs\win32-g++" -o release\main.o main
.cpp
g++ -enable-stdcall-fixup -Wl,-enable-auto-import -Wl,-enable-runtime-pseudo-rel
oc -Wl,-s -mthreads -Wl -Wl,-subsystem,windows -o "release\Test.exe" release\mai
n.o  -L"c:\Qt\4.3.2\lib" -lmingw32 -lqtmain -lQtGui4 -lQtCore4
mingw32-make[1]: Leaving directory `C:/Users/Mateo/Projets/Test'
 
C:\Users\Mateo\Projets\Test>

Exécuter le programme

Pour tester le programme, vous avez 2 solutions :



Lancer le programme depuis la console



Normalement, l'exécutable a été placé dans le sous-dossier "release".
Il vous suffit de vous placer dans ce sous-dossier puis de taper le nom du programme pour qu'il s'exécute :

Code : Console
C:\Users\Mateo\Projets\Test>cd release
 
C:\Users\Mateo\Projets\Test\release>Test.exe



Lancer le programme depuis l'explorateur



Je sais je sais, vous vous dites que lancer un programme depuis la console c'est un peu débile. Je suis d'accord, mais les programmes Qt ont besoin des fichiers DLL de Qt avec eux pour fonctionner.
Quand vous exécutez votre programme depuis la console spéciale, la position des DLL est "connue", donc votre programme se lance sans erreur.

Mais essayez de double-cliquer sur l'exécutable depuis l'explorateur pour voir !

Le programme Test.exe
Le programme Test.exe dans le dossier "release". Double-cliquez dessus.


Exécution sans les DLL
Miséricorde ! Ca ne marche pas !


En effet, sans quelques DLL à côté notre programme est perdu. Il a besoin de ces fichiers qui contiennent de quoi le guider. Vous avez déjà eu affaire aux DLL si vous avez utilisé la SDL dans le cours de C normalement ;)

Pour pouvoir lancer l'exécutable depuis l'explorateur (et aussi pour qu'il marche chez vos amis / clients), il faut placer les DLL qui manquent dans le même dossier que l'exécutable. A vous de les chercher, vous les avez sur votre disque (chez moi je les ai trouvés dans le dossier C:\MinGW\bin et C:\Qt\4.3.2\bin). En tout, vous devriez avoir eu besoin de mettre 3 DLL :

Programme Qt et ses DLL


Vous pouvez lancer le programme maintenant !


Notre première fenêtre en action !



Ouf ! On est arrivé à compiler et lancer notre programme !

Coucou petite fenêtre, fais risette à la caméra !

Notre première fenêtre


Le bouton prend la taille du texte qui se trouve à l'intérieur, et la fenêtre qui est automatiquement créée prend la taille du bouton. Ca donne donc une toute petite fenêtre ;)

Mais... vous pouvez la redimensionner, voire même l'afficher en plein écran ! Rien ne vous en empêche, et le bouton s'adapte automatiquement à la taille de la fenêtre (ce qui peut donner un trèèès gros bouton) :

Notre première fenêtre agrandie

Q.C.M.

Quelle est le nom de la classe que toute application Qt doit instancier ?
Quelle méthode de la classe QPushButton permet de provoquer l'affichage du bouton ?
De quel(s) fichier(s) a besoin make pour savoir comment faire son travail ?
Dans quel ordre les commandes doivent-elles être tapées ?
Tant qu'on n'a pas ajouté ou supprimé de fichier source dans son projet, une seule de ces commandes est nécessaire pour recompiler. Laquelle ?

Statistiques de réponses au QCM


Nous y sommes enfin arrivés, champagne ! :D

Vous l'avez vu, le code nécessaire pour ouvrir une fenêtre toute simple constituée d'un bouton est ridicule. Quelques lignes à peine, et rien de bien compliqué à comprendre au final.
C'est ce qui fait la force de Qt : "un code simple est un beau code" dit-on. Qt s'efforce de respecter ce dicton à la lettre, vous vous en rendrez compte dans les prochains chapitres.

Le "défaut" de cette simplicité, c'est qu'on est obligé de passer par un utilitaire spécial appelé qmake pour générer le Makefile qui est parfois très complexe. Mais comme vous avez pu le constater, ça se fait sans problème ;)

Dans les prochains chapitres, nous allons voir comment changer l'apparence du bouton, comment faire une fenêtre un peu plus complexe. Nous découvrirons aussi le mécanisme des signaux et des slots, un des principes les plus importants de Qt qui permet de gérer les évènements : un clic sur un bouton pourra par exemple provoquer l'ouverture d'une nouvelle fenêtre ou sa fermeture !
Chapitre précédent Sommaire Chapitre suivant
Retour en haut Retour en haut


Créé : le 18/09/2007 à 17:13:58
Modifié : le 23/10/2008 à 14:17:50
Avancement : 100%
Licence : Copie non autorisée

Changer de design | En savoir plus | Plan du site | Politique d'accessibilité | Règles | RSS tutoriels | RSS news
Édité par Simple IT SARL : Nous contacter | Notre blog | Revue de presse | Publicité

Y'a plus rien à lire, faut remonter maintenant !

Hébergement web - Correction de tutoriels - Créer un site
Vous souhaitez apparaître ici ? Contactez-nous.

Nombre de connectés 410 Zéros connectés | Requêtes SQL 8 requêtes | Temps de génération de la page : Total (SQL) 0.0274s (0.0121s)