Qt ...

Gui et XML

Organisation de lexpos
1 ) Qt Cest quoi au juste? 2 ) Principe de Qt (signal / slot). 3 ) Qt et les langages de programmation. 4 ) Qt et les technologies XML. 5 ) QtDesigner facile la GUI! 6 ) Conclusion.

Qt ... Gui et XML

Qt Cest quoi au juste?

Qt ... Gui et XML

Qt Cest quoi au juste?

Qt (prononc cute mais erronment prononc Q.T) est un framework orient objet dvelopp en C++ par Qt Development Frameworks (actuellement), filiale de Nokia. Qt permet la portabilit des applications qui n'utilisent que ses composants par simple recompilation du code source, il offre mme une bibliothque permettant la programmation pour les systmes embarqus. Les environnements supports sont les Unix (dont Linux) qui utilisent le systme graphique X Window System , Windows et Mac OS X.
Qt ... Gui et XML 4

Qt Cest quoi au juste?

Qt tait initialement dvelopp par Trolltech en 1991 et ne fut annonc au grands publique que 4 annes plus tard en 26 mai 1995. Le projet a t nomm Qt parce que le caractre Q tait joli dans l'criture Emacs et le t provient de Xt Xtoolkit. En 1997 l e projet KDE est lanc en se basant sur Qt. La fin 2007 dbut 2008 Nokia rachte Trolltech ,la renomme en Qt Software et ajoute une licence plus permissive que la GPL, la LGPL.
Qt ... Gui et XML 5

Qt Cest quoi au juste?

Qt est un Framework multiplateforme ; un ensemble de bibliothques ddies diffrents aspects de programmation comme: Les interfaces graphiques GUI. XML Xpath, Xquery , SVG, Web HTML5,CSS,WebKit Les BDD (MySQL, ORACLE, Sybase, ODBC, IBM DB2). Programmation concurrente et Multithreading. Graphismes 2D,3D OpenGL. Programmation Mobile Symbian , Maebo D-Bus IPC & RPC (Inter Process Communication ) Systme de scripts et de plugins pour les applications.
Qt ... Gui et XML 6

slot1() signal1() slot2() signal2() slot3()

Principe de Qt (signal / slot)

Qt ... Gui et XML

Principe de Qt (signal / slot)

Qt propose depuis son origine un mcanisme de communication entre les objets appel signaux et slots. Cela a ncessit la prsence d'un prprocesseur appel moc car des mots-cls supplmentaires (Signals , Slots ) ont t ajouts.

Qt ... Gui et XML

Principe de Qt (signal / slot)

#include <QMainWindow> #include <QString> class QPushButton; class Exemple: public QMainWindow { Q_OBJECT public: Exemple(); signals: void pseudoclick(); public slots: void s_clicked(); private: QPushButton* button; };

Qt ... Gui et XML

Principe de Qt (signal / slot)

#include "exemple,h" #include <QApplication> #include <QPushButton> #include <QMessageBox> int main(int argc, char *argv[]) { QApplication app(argc, argv); Exemple exemple; exemple.show(); return app.exec(); } Exemple::Exemple():QMainWindow(){ button = new QPushButton("Hello!", this); connect(button, SIGNAL(clicked()), this, SLOT(s_clicked())); } void Exemple::s_clicked() { QMessageBox message(QMessageBox::Information, "Test dinformation", "Salut a tous"); message.exec(); }
Qt ... Gui et XML 10

Python
PASCAL

Java

C/C++
ADA

Qt et les langages de programmation

Qt ... Gui et XML

11

Qt et les langages de programmation

Qt est support et existes sur plusieurs langages de programmation. En voyant que Qt ntais pas seulement une simple bibliothque pour grer les graphismes, plusieurs dveloppeurs ont penser radapter ses concepts dans dautres langages(Java,Ruby,Ada,C#,Haskell,Python,TCL). Utilisant la mme formulation et appellation des classes rendant le dveloppement facile lors du changement du langage de programmation. Sa radaptation dans plusieurs langages le rend plus universel alors on le vois dj comme un standard de dveloppement et on projette mme de faire une version de Qt pour lIOS le SE sur les plateformes mobiles d Apple.
Qt ... Gui et XML 12

Schemas

XPath

SVG

XQuery

SAX

XBel

DOM

Qt et les technologies XML

Qt ... Gui et XML 13

Qt et les technologies XML

Qt offre ses propres APIs pour grer les fichiers XML, facilitant ainsi leurs manipulation et leur utilisation dans diffrents domaines toutes regroupes dans le module QtXml. Parmi les APIs les plus connus (SAX ,DOM ,XBEL et les schmas XML) et Qt propose plusieurs classes permettant leurs utilisation dans diffrents types dapplications.

Qt ... Gui et XML

14

Qt et les technologies XML

XBEL (XML Bookmark Exchange Language), est un langage bas sur XML crer pour l change de Marque-pages sur les diffrents rseaux ainsi que internet entre les diffrents navigateurs web. Qt utilse SAX et DOM pour manipuler (lire & crire) les fichiers XBEL. Pour DOM on y trouve les classes QDomNode , QDomElement , QDomDocumentetc. Pour SAX il y a QXmlContentHandler comme classe de base et QXmlDefaultHandler, QXmlDTDHandler, QXmlEntityResolver, QXmlLexicalHandler qui sont des classes filles ddies pour les DTD est les schmas XML.
Qt ... Gui et XML 15

Qt et les technologies XML

QDomDocument un ensemble de mthodes pour faciliter le traitement des fichiers XML en utilisant lAPI DOM.
createAttribute ();//Crer un attribut createAttributeNS (); //Crer un espace de nommage pour des attributs createCDATASection (); //Crer un lment obissant la norme CDATA createElement (); //Crer un lment createElementNS (); //Crer un lment apartenant un espace de nommage doctype ();//Ronvoie le type du document documentElement (); //Ronvoie la racine du document elementById (); //Ronvoie un lment avec lID specifi elementsByTagName (); //Ronvoie un lment avec le nom specifi elementsByTagNameNS (); //Ronvoie une liste des lments avec le NS et le nom specifi nodeType (); //Ronvoie le type dun noeud setContent ();//Affecte le contenue dun element
Qt ... Gui et XML 16

Qt et les technologies XML

QXmlContentHandler un ensemble de mthodes pour faciliter le traitement des fichiers XML en utilisant lAPI SAX.
characters ();//Appele lors de la rencontre (recuperation des donnes) endDocument ();//Appele lors de la fin du document endElement();//Appele lors de rencontre de la fin dun lment startDocument ();//Appele lors de la rencontre du dbut du document startElement(); //Appele lors de la rencontre du dbut dun lment

Il existe dautres classes ( filles ) pour le support dautres fonctionnalits plus spcifiques pour traiter les fichiers XML.
Qt ... Gui et XML 17

Qt et les technologies XML

Un schma XML est une grammaire dfinie dans un formalisme XML. Sauf pour la gestion des entits, on peut considrer les schmas comme remplaant les DTD. Ils permettent: La gestion des espaces de noms. Des types de base riches et extensibles. La rutilisation par importation et hritage. Davantage de souplesse dans les cardinalits. Qt contient la classe QXmlSchema qui nous permet la vrification des fichiers XML en utilisant les schmas XML.
Qt ... Gui et XML 18

Qt et les technologies XML

QXmlSchema est la classe de base pour la vrification et la validation des fichier XML selon de schmas W3C elle contient un ensemble de mthodes nous permettant ces taches.
isValid();//Vrifier la validit du fichier XML selon un schma dfinit load();//Pour charger le fichier XML et le schmas correspondant

Il existe dautres classes pour traiter dautres cas de validation des fichiers tel que QXmlSchemaValidator.

Qt ... Gui et XML

19

Qt et les technologies XML

SVG ( Scalable Vector Graphics )est une technologie de reprsentation des graphismes vectoriel base sur XML.

Qt contient un module QtSvg pour traiter les SVGs dont les classes. QSvgGenerator qui nous permet de gnrer des graphismes au format SVG. QSvgRenderer qui nous permet de dessiner les graphismes au format SVG. Il existe dautres classes destines un usage plus spcifique dans des domaines avancs dans les graphismes.
Qt ... Gui et XML 20

QtDesigner facile la GUI

Qt ... Gui et XML

21

Qt Designer facile la GUI

Qt Designer est un logiciel qui facilite la cration dinterfaces graphiques, en effet il nous permet dditer visuellement les lments (boutons, cases cocher, zones de texte etc) de notre interface graphique (fentre), il est soit indpendant soit intgr au sein de Qt Creator (lIDE spcialis pour Qt en C++) dans la section Design. Il nous permet aussi de modifier les diffrentes proprits des lments graphiques et deffectuer la connexion des signaux et des slots entre les diffrents lments et les objets du programme dvelopp. Il est plus simple de travailler directement l'intrieur de Qt Creator, comme a on pourra coder et concevoir notre interface en mme temps.
Qt ... Gui et XML 22

Qt Designer facile la GUI

Tutoriel :Utilisation QtDesigner

Qt ... Gui et XML

23

Qt Designer facile la GUI

On va utiliser QtCreator qui est dlivr dans le QtSDK. On vas crer un nouveau projet pour ca on va dans le menu Fichier Nouveau fichier ou projet On aura la boite de dialogue suivante.

Qt ... Gui et XML

24

Qt Designer facile la GUI

Apres la cration de la fentre on vous demande de choisir le nom et l emplacement

Qt ... Gui et XML

25

Qt Designer facile la GUI

Dans la fentre suivante, on vous montre que lapplication est destine pour un environnement de bureau (Desktop Application)

Qt ... Gui et XML

26

Qt Designer facile la GUI

Qt ... Gui et XML

27

Qt Designer facile la GUI

Trois fichiers seront crs : calc.ui : c'est le fichier qui contiendra l'interface graphique (de type XML). C'est ce fichier que nous modifierons avec l'diteur Qt Designer. calc.h : permet de charger le fichier .ui dans votre projet C++ (en-tte de classe). calc.cpp : permet de charger le fichier .ui dans votre projet C++ (code source de classe).

Qt ... Gui et XML

28

Qt Designer facile la GUI

Pour crer votre projet cliquez sur terminer !

Qt ... Gui et XML

29

Qt Designer facile la GUI

Qt ... Gui et XML

30

Qt Designer facile la GUI

Analyse de la fentre de QtDesigner

Qt ... Gui et XML

31

Qt Designer facile la GUI

Apre la cration de votre fentre, Qt Designer s'ouvre au sein de Qt Creator

Qt ... Gui et XML 32

Qt Designer facile la GUI

1. Sur la barre d'outils de Qt Designer, au moins 4 boutons mritent votre attention. Editer les widgets : le mode par dfaut, que vous utiliserez le plus souvent. Il permet d'insrer des widgets sur la fentre et de modifier leurs proprits. Editer signaux/slots : permet de crer des connexions entre les signaux et les slots de vos widgets. Editer les copains : permet d'associer des QLabel avec leurs champs respectifs. Lorsque vous faites un layout de type QFormLayout, ces associations sont automatiquement cres. 2. Au centre de Qt Designer, vous avez la fentre que vous tes en train de dessiner. Pour le moment celle-ci est vide.
Qt ... Gui et XML 33

Qt Designer facile la GUI

3. Widget Box : ce dock vous donne la possibilit de slectionner un widget placer sur la fentre. Vous pouvez constater qu'il y a un assez large choix , ceux-ci sont organiss par groupes pour y voir plus clair. Pour placer un de ces widgets sur la fentre, il suffit de faire un glisser-dplacer. Simple et intuitif
4.Property Editor : lorsqu'un widget est slectionn sur la fentre principale, vous pouvez diter ses proprits. Vous noterez que les widgets possdent en gnral beaucoup de proprits, et que celles-ci sont organises en fonction de la classe dans laquelle elles ont t dfinies. On peut ainsi modifier toutes les proprits dont un widget hrite, en plus des proprits qui lui sont propres.

Qt ... Gui et XML

34

Qt Designer facile la GUI

5. Object Inspector : affiche la liste des widgets placs sur la fentre, en fonction de leur relation de parent, sous forme d'arbre. Ca peut tre pratique si vous avez une fentre complexe et que vous commencez vous perdre dedans. 6. Editeur de signaux/slots et diteur d'action : ils sont spars par des onglets. L'diteur de signaux/slots :est utile si vous avez associ des signaux et des slots, les connexions du widget slectionn apparaissant ici. L'diteur d'action :permet de crer des QAction. C'est donc utile lorsque vous crez une QMainWindow avec des menus et une barre d'outils.
Qt ... Gui et XML 35

Qt Designer facile la GUI

Un simple exemple montrant Comment Configurer les signaux et les slots

Qt ... Gui et XML

36

Qt Designer facile la GUI

Ralisation dune simple calculatrice

Qt ... Gui et XML

37