Qt

Comment faire une IHM 'graphique' (GUI) en C++

Une Interface Homme Machine est un élément indispensable afin de communiquer entre un utilisateur et sa machine.
Plusieurs types d'interfaces sont possibles :
- Interface non graphique : Ligne de commande
- Interface graphique (GUI) : Sytème de fenêtres ou autre, interaction avec souris, clavier, ...
Problèmatique :
- Chaque plates-forme (Windows vista, windows 95, Mac OS X, linux X11, ...) possède des GUI totalement différentes (menus en haut de l'écran sur un mac, boutons de fermeture des fenêtres à gauche ou à droite....)
- Toutes les fonctions graphiques pour coder ces GUI sont incompatibles entre eux

Exemple

Graphical User Interface (1/2)

Cette hétérogéniéité de solutions est souvent un des plus gros problèmes de portage entre par exemple, un logiciel Windows et un logiciel Mac. En effet, si l'interface graphique n'a pas étée concue depuis le début pour être portée sur une autre plate-forme, tout est à refaire pour chaque plate-forme.

Mais comment programmer une fenêtre et son contenu si l'on veut que notre code tourne indépendement la couche graphique utilisée ?

Graphical User Interface (2/2)

Soit on programme en utilisant une bibliothèque spécifique pour chaque plateforme :
- Xt / Motif (dès 1980, serveur X) Pour les serveurs X sous X11
- Windows (...) Pour Windows
- Cocoa... Pour Mac OS X
Mais on réinvente la roue à chaque fois...
Soit on utilise des Toolkits, qui sont des ensembles de bibliothèques capables, en utilisant leurs propres fonctions, de générer du code pour plusieurs GUI.

Toolkits

Il existe 4 principales Tollkits (boites à outils) C++ offrant des composants graphiques :
- Xt / Motif (dès 1980, serveur X)
- Gtk (Distribution Gnome...)
- Windows (...)
- Qt (Distribution KDE...)
Seul certaines fonctionnent sur toutes les plates-formes :
- Unix (Linux)
- Mac
- Windows

Laquelle choisir ?

Quels sont nos besoins :
- Mutliplate-formes
- Licence "libre"
- Efficace, Rapide, Pérène
Sur les 4 principales Toolkits, seules 2 correspondent :
- Gtk : www.gtk.org
  - Contient essentiellement des fonctions pour construire des GUI
  - Utilisé par le système d'exploitation Ubuntu, KDE
- Qt : www.trolltech.com
  - Contient non seulement des fonctions pour construire des GUI, mais également des fonctions pour accéder aux bases de données, manipuler des fichier Xml, programmation réseau ...
  - Utilisé par le système d'exploitation KDE

Qt : Aperçu

Qt est une surcouche juste au dessus du graphique natif de la machine cible.

Qt : Fonctionnalitées graphiques

La librarie de Qt contenant la partie "graphique" est nommée QtGUI.
Cette librarie contient un ensemble de composants graphique permettant de construire des GUI.
Parmis ces composants, nous trouverons entre-autres des classes de :

Gestion de fenêtres : QMainWindow, QDialog, QWidget, ...
Gestion de menus : QMenu, QMenuBar, QToolBar, ...
Gestion de boutons et autres composants : QPushButton, QRadioButton, QTextEdit, QCheckBox, QLabel, ...
Gestion "graphique" : QPainter, QImage, QPen, ...
Composants plus spécialisés : QProgressDialog, QFileDialog, QMessageBox, ...

Qt : Premiers pas

Comment dessiner notre première fenêtre ?

#include <QtGui/QApplication> #include <QtGui/QMainWindow> #include <QtGui/QPushButton>
int main(int argc, char *argv[]) {
QApplication app(argc, argv);
QMainWindow *mw = new QMainWindow();
QPushButton *hello = new QPushButton("Hello World !");
mw->setCentralWidget(hello);
mw->show();
return app.exec(); }

Qt : Interaction

Faire des boutons, c'est bien, mais interagir, c'est mieux !

Comment rendre nos applications interactives ?
- En échangeant des signaux entre l'interface graphique et les évenements que l'on veut y associer
- Par example, en associant le clic de la souris au changement du titre de notre bouton (voir TP...)
Que Qt nous offre-t-il ?
- La bibliothèque Qt vient avec un mécanisme appelé "Signal/Slots" permettant de connecter un signal (clic/mouvement souris, pression d'une touche...) à un récepteur (slot)

Qt : Signals / Slots (1)

Qt : Signals / Slots (2)

Exemple concret (DrawQt)

Lors du clic sur le bouton Ellipse:

Envoie du signal Clic par le bouton
Nous aura auparavant connecté ce signal à la méthode "ClicEllipse"
Execution de la méthode "ClicEllipse"

Qt : Signals / Slots (3)

Définir un signal / slot

Fichier.h

     class myClass : public Qobject {
     Q_OBJECT		
     ...
     signals:	
	void event ();
     ... 
     public slots:		
	void action ();
     ...
     };

Fichier.cxx

     ...
     emit(evenementSurvenu());
     ...
     connect(myClass,SIGNAL(event(),myClass,SLOT(action());

Qt : Signals / Slots (4)

Comment compiler un fichier contenant des Signals/Slots :
- En utilisant un outil propre à Qt : moc (meta object compiler)
- ...Mais tout cela sera transparent et géré par CMT
- Et dans CMT :
```
document moc moc_myWindow   FROM=myWindow.h TO=myWindow.cpp 
```

Question(s) ?