Getting Started on the Commandline/fr: Difference between revisions

From Qt Wiki
Jump to navigation Jump to search
(Add "cleanup" tag)
(Convert ExpressionEngine links)
Line 28: Line 28:


Analysons le code ligne par ligne.
Analysons le code ligne par ligne.
Dans les deux premières lignes, nous incluons les fichiers en-têtes "QApplication":http://doc.qt.nokia.com/4.7/qapplication.html et "QTextEdit":http://doc.qt.nokia.com/4.7/qtextedit.html, qui sont les classes dont nous avons besoin dans cet exemple. Toutes les classes de Qt ont des en-têtes respectifs.
Dans les deux premières lignes, nous incluons les fichiers en-têtes [http://doc.qt.nokia.com/4.7/qapplication.html QApplication] et [http://doc.qt.nokia.com/4.7/qtextedit.html QTextEdit], qui sont les classes dont nous avons besoin dans cet exemple. Toutes les classes de Qt ont des en-têtes respectifs.


À la ligne 6, nous créons un objet "QApplication":http://doc.qt.nokia.com/4.7/qapplication.html. Cet objet gère les ressources de l'application et est requis pour n'importe quel programme Qt qui a une interface graphique. Il prend les paramètres ''argv'' et ''args'' car Qt accepte les paramètres en ligne de commande.
À la ligne 6, nous créons un objet [http://doc.qt.nokia.com/4.7/qapplication.html QApplication]. Cet objet gère les ressources de l'application et est requis pour n'importe quel programme Qt qui a une interface graphique. Il prend les paramètres ''argv'' et ''args'' car Qt accepte les paramètres en ligne de commande.


La ligne 8 crée un objet "QTextEdit":http://doc.qt.nokia.com/4.7/qtextedit.html. Un champ d'édition de texte est un élément graphique dans une interface graphique. Dans Qt, nous les appelons des widgets. Des exemples de widgets sont les barres de défilement, les étiquettes, ou les cases d'options. Un widget peut aussi contenir d'autres widgets; une fenêtre par exemple, est un widget qui en contient d'autres.
La ligne 8 crée un objet [http://doc.qt.nokia.com/4.7/qtextedit.html QTextEdit]. Un champ d'édition de texte est un élément graphique dans une interface graphique. Dans Qt, nous les appelons des widgets. Des exemples de widgets sont les barres de défilement, les étiquettes, ou les cases d'options. Un widget peut aussi contenir d'autres widgets; une fenêtre par exemple, est un widget qui en contient d'autres.


À la ligne 9, nous affichons le champ d'édition de texte à l'écran dans la propre fenêtre. Puisque les widgets sont aussi des conteneurs (par exemple un objet "QMainWindow":http://doc.qt.nokia.com/4.7/qmainwindow.html qui a des barres d'outils, des menus, une barre de status, et d'autres widgets), il est possible de les afficher dans leur propre fenêtre. Les widgets de sont pas visibles par défaut; la fonction "show()":http://doc.qt.nokia.com/4.7/qwidget.html#show le rend visible.
À la ligne 9, nous affichons le champ d'édition de texte à l'écran dans la propre fenêtre. Puisque les widgets sont aussi des conteneurs (par exemple un objet [http://doc.qt.nokia.com/4.7/qmainwindow.html QMainWindow] qui a des barres d'outils, des menus, une barre de status, et d'autres widgets), il est possible de les afficher dans leur propre fenêtre. Les widgets de sont pas visibles par défaut; la fonction [http://doc.qt.nokia.com/4.7/qwidget.html#show show()] le rend visible.


La ligne 11 fait entrer le "QApplication":http://doc.qt.nokia.com/4.7/qapplication.html dans un boucle d'évènements. Quand une application Qt est lancée, des évènements sont générés et envoyés aux widgets de l'application. Des exemples d'évènements sont les clics de souris ou les touches de clavier. Quand vous écrivez dans le champ de texte, il reçoit des évènements de touches de claviers appuyées et réagit en écrivant le texte tapé.
La ligne 11 fait entrer le [http://doc.qt.nokia.com/4.7/qapplication.html QApplication] dans un boucle d'évènements. Quand une application Qt est lancée, des évènements sont générés et envoyés aux widgets de l'application. Des exemples d'évènements sont les clics de souris ou les touches de clavier. Quand vous écrivez dans le champ de texte, il reçoit des évènements de touches de claviers appuyées et réagit en écrivant le texte tapé.


Pour lancer l'application, lancez une console, allez dans le répertoire où est situé le .cpp du programme. Les commandes suivantes compile le programme.
Pour lancer l'application, lancez une console, allez dans le répertoire où est situé le .cpp du programme. Les commandes suivantes compile le programme.
Line 48: Line 48:


|À propos de|Ici|
|À propos de|Ici|
|Les widgets et la géométrie des fenêtres|"Fenêtres et boites de dialogue":http://doc.qt.nokia.com/4.7/application-windows.html|
|Les widgets et la géométrie des fenêtres|[http://doc.qt.nokia.com/4.7/application-windows.html| Fenêtres et boites de dialogue]
|Les évènements et leur gestion|"Le système d'évènement":http://doc.qt.nokia.com/4.7/eventsandfilters.html|
|Les évènements et leur gestion|[http://doc.qt.nokia.com/4.7/eventsandfilters.html| Le système d'évènement]


h2. Ajouter un bouton Quitter
h2. Ajouter un bouton Quitter


Dans une application normale, vous aurez normalement plus d'un widget. Nous ajouterons un objet "QPushButton":http://doc.qt.nokia.com/4.7/qpushbutton.html en dessous du champ de texte. Ce bouton quittera le Bloc-Notes lorsqu'il sera cliqué.
Dans une application normale, vous aurez normalement plus d'un widget. Nous ajouterons un objet [http://doc.qt.nokia.com/4.7/qpushbutton.html QPushButton] en dessous du champ de texte. Ce bouton quittera le Bloc-Notes lorsqu'il sera cliqué.


p=. [[Image:http://doc.qt.nokia.com/4.7/images/gs2.png|http://doc.qt.nokia.com/4.7/images/gs2.png]]
p=. [[Image:http://doc.qt.nokia.com/4.7/images/gs2.png|http://doc.qt.nokia.com/4.7/images/gs2.png]]
Line 81: Line 81:
}</code>
}</code>


À la ligne 1, nous incluons "QtGui":http://doc.qt.nokia.com/4.7/qtgui.html, qui contient toutes les classes graphiques de Qt.
À la ligne 1, nous incluons [http://doc.qt.nokia.com/4.7/qtgui.html QtGui], qui contient toutes les classes graphiques de Qt.


À la ligne 10, nous utilisons le système de signaux et de slots de Qt pour quitter l'application quand le bouton ''Quit'' est cliqué. Un slot est une fonction qui peut être appelée à l'exécution grâce à son nom. Un signal est une fonction qui lorsqu'elle est appelée appelle les slots qui lui sont connectés. On dit qu'on connecte un slot à un signal et qu'on émet un signal.
À la ligne 10, nous utilisons le système de signaux et de slots de Qt pour quitter l'application quand le bouton ''Quit'' est cliqué. Un slot est une fonction qui peut être appelée à l'exécution grâce à son nom. Un signal est une fonction qui lorsqu'elle est appelée appelle les slots qui lui sont connectés. On dit qu'on connecte un slot à un signal et qu'on émet un signal.


"quit()":http://doc.qt.nokia.com/4.7/qcoreapplication.html#quit est un slot de "QApplication":http://doc.qt.nokia.com/4.7/qapplication.html.
[http://doc.qt.nokia.com/4.7/qcoreapplication.html#quit quit()] est un slot de [http://doc.qt.nokia.com/4.7/qapplication.html QApplication].
"clicked()":http://doc.qt.nokia.com/4.7/qabstractbutton.html#clicked est un signal qu'un "QPushButton":http://doc.qt.nokia.com/4.7/qpushbutton.html émet lorsqu'il est cliqué.
[http://doc.qt.nokia.com/4.7/qabstractbutton.html#clicked clicked()] est un signal qu'un [http://doc.qt.nokia.com/4.7/qpushbutton.html QPushButton] émet lorsqu'il est cliqué.
La focntion statique "QObject::connect()":http://doc.qt.nokia.com/4.7/qobject.html#connect permet de connecter le slot au signal.
La focntion statique [http://doc.qt.nokia.com/4.7/qobject.html#connect QObject::connect()] permet de connecter le slot au signal.
''SIGNAL ()_ et _SLOT()'' sont deux macros qui prennent la signature du signal et du slot à connecter. Il faut aussi donner des pointeurs vers les objets qui envoient et reçoivent le signal.
''SIGNAL ()_ et _SLOT()'' sont deux macros qui prennent la signature du signal et du slot à connecter. Il faut aussi donner des pointeurs vers les objets qui envoient et reçoivent le signal.


La ligne 12 crée un objet "QVBoxLayout":http://doc.qt.nokia.com/4.7/qvboxlayout.html. Nous avons dit que les widgets peuvent en contenir d'autres. Il est possible de stipuler les bords de chaque widgets (position et taille), mais il est souvent plus simple d'utiliser un layout. Un layout s'occupe de définir les bords de chaque widget fils. "QVBoxLayout":http://doc.qt.nokia.com/4.7/qvboxlayout.html par exemple, met les widgets fils en rang vertical.
La ligne 12 crée un objet [http://doc.qt.nokia.com/4.7/qvboxlayout.html QVBoxLayout]. Nous avons dit que les widgets peuvent en contenir d'autres. Il est possible de stipuler les bords de chaque widgets (position et taille), mais il est souvent plus simple d'utiliser un layout. Un layout s'occupe de définir les bords de chaque widget fils. [http://doc.qt.nokia.com/4.7/qvboxlayout.html QVBoxLayout] par exemple, met les widgets fils en rang vertical.


Les lignes 13 et 14 ajoute le champ de texte et le bouton au layout. À la ligne 17, nous assignons le layout à un widget, ici la fenêtre.
Les lignes 13 et 14 ajoute le champ de texte et le bouton au layout. À la ligne 17, nous assignons le layout à un widget, ici la fenêtre.
Line 97: Line 97:


|À propos de|Ici|
|À propos de|Ici|
|Les signaux et les slots|"Signaux &amp; slots":http://doc.qt.nokia.com/4.7/signalsandslots.html|
|Les signaux et les slots|[http://doc.qt.nokia.com/4.7/signalsandslots.html| Signaux &amp; slots]
|Les layouts|"Gestion des layouts":http://doc.qt.nokia.com/4.7/layout.html, "Widgets et layouts":http://doc.qt.nokia.com/4.7/widgets-and-layouts.html, "Exemples de layout":http://doc.qt.nokia.com/4.7/examples-layouts.html|
|Les layouts|[http://doc.qt.nokia.com/4.7/layout.html Gestion des layouts], [http://doc.qt.nokia.com/4.7/widgets-and-layouts.html Widgets et layouts], [http://doc.qt.nokia.com/4.7/examples-layouts.html| Exemples de layout]
|Les différents widgets de Qt|"Gallerie de widgets Qt":http://doc.qt.nokia.com/4.7/gallery.html, "Exemples de widgets":http://doc.qt.nokia.com/4.7/examples-widgets.html|
|Les différents widgets de Qt|[http://doc.qt.nokia.com/4.7/gallery.html Gallerie de widgets Qt], [http://doc.qt.nokia.com/4.7/examples-widgets.html| Exemples de widgets]


h2. Hériter QWidget
h2. Hériter QWidget


Quand l'utilisateur quitte une application, on peut vouloir ajouter une boite de dialogue pour demander de confirmer avant de quitter.
Quand l'utilisateur quitte une application, on peut vouloir ajouter une boite de dialogue pour demander de confirmer avant de quitter.
Dans cet exemple, nous créons une classe qui hérite de "QWidget":http://doc.qt.nokia.com/4.7/qwidget.html, et nous ajoutons un slot à connecter au bouton pour quitter.
Dans cet exemple, nous créons une classe qui hérite de [http://doc.qt.nokia.com/4.7/qwidget.html QWidget], et nous ajoutons un slot à connecter au bouton pour quitter.


p=. [[Image:http://doc.qt.nokia.com/4.7/images/gs3.png|http://doc.qt.nokia.com/4.7/images/gs3.png]]
p=. [[Image:http://doc.qt.nokia.com/4.7/images/gs3.png|http://doc.qt.nokia.com/4.7/images/gs3.png]]
Line 125: Line 125:
};</code>
};</code>


La macro Q_OBJECT doit être située en premier dans la classe, et déclare notre classe comme un "QObject":http://doc.qt.nokia.com/4.7/qobject.html (Bien sûr, elle doit aussi héritée de "QObject":http://doc.qt.nokia.com/4.7/qobject.html). Un objet "QObject":http://doc.qt.nokia.com/4.7/qobject.html ajoute quelques possibilités supplémentaires par rapport à une classe normale de C+''. Par exemple, le nom de la classe et de ses slots peut être récupéré à l'exécution, ainsi que les paramètres d'un slot.
La macro Q_OBJECT doit être située en premier dans la classe, et déclare notre classe comme un [http://doc.qt.nokia.com/4.7/qobject.html QObject] (Bien sûr, elle doit aussi héritée de [http://doc.qt.nokia.com/4.7/qobject.html QObject]). Un objet [http://doc.qt.nokia.com/4.7/qobject.html QObject] ajoute quelques possibilités supplémentaires par rapport à une classe normale de C+''. Par exemple, le nom de la classe et de ses slots peut être récupéré à l'exécution, ainsi que les paramètres d'un slot.


La ligne 13 déclare le slot ''quit()'', avec la macro ''slots''. Le slot ''quit()'' peut maintenant être connecter à n'importe quel signal avec la même signature, c'est-à-dire aucuns paramètres.
La ligne 13 déclare le slot ''quit()'', avec la macro ''slots''. Le slot ''quit()'' peut maintenant être connecter à n'importe quel signal avec la même signature, c'est-à-dire aucuns paramètres.
Line 147: Line 147:




Comme vu dans la déclaration de la classe, nous utilisons des pointeurs vers nos "QObject":http://doc.qt.nokia.com/4.7/qobject.html (''textEdit'' et ''quitButton''). Vous devriez toujours allouez des "QObject":http://doc.qt.nokia.com/4.7/qobject.html dynamiquement et ne jamais les copier.
Comme vu dans la déclaration de la classe, nous utilisons des pointeurs vers nos [http://doc.qt.nokia.com/4.7/qobject.html QObject] (''textEdit'' et ''quitButton''). Vous devriez toujours allouez des [http://doc.qt.nokia.com/4.7/qobject.html QObject] dynamiquement et ne jamais les copier.


Nous utilisons maintenant les fonction ''tr()'' pour nos variables textes. Cette fonction est nécessaire pour fournir une traduction à votre application. Nous n'entrerons pas dans les détails, mais vous pouvez vous renseignez avec le lien ''Qt Linguist'' dans ''Plus d'informations''
Nous utilisons maintenant les fonction ''tr()'' pour nos variables textes. Cette fonction est nécessaire pour fournir une traduction à votre application. Nous n'entrerons pas dans les détails, mais vous pouvez vous renseignez avec le lien ''Qt Linguist'' dans ''Plus d'informations''
Line 154: Line 154:


|À propos de|Ici|
|À propos de|Ici|
|tr() et la traduction|"Documentation de Qt Linguist":http://doc.qt.nokia.com/4.7/linguist-manual.html, "Écrire du code source pour traduire":http://doc.qt.nokia.com/4.7/i18n-source-translation.html, "Exemples de tr() avec Hello World":http://doc.qt.nokia.com/4.7/linguist-hellotr.html, "Internationalisation avec Qt":http://doc.qt.nokia.com/4.7/internationalization.html|
|tr() et la traduction|[http://doc.qt.nokia.com/4.7/linguist-manual.html Documentation de Qt Linguist], [http://doc.qt.nokia.com/4.7/i18n-source-translation.html Écrire du code source pour traduire], [http://doc.qt.nokia.com/4.7/linguist-hellotr.html Exemples de tr() avec Hello World], [http://doc.qt.nokia.com/4.7/internationalization.html| Internationalisation avec Qt]
|"QObjects":http://doc.qt.nokia.com/4.7/qtwebkit-bridge.html#qobjects et la programmation orientée objet avec Qt (Essentiel pour comprendre Qt)|"La programmation orientée objet":http://doc.qt.nokia.com/4.7/object.html|
|[http://doc.qt.nokia.com/4.7/qtwebkit-bridge.html#qobjects QObjects] et la programmation orientée objet avec Qt (Essentiel pour comprendre Qt)|[http://doc.qt.nokia.com/4.7/object.html| La programmation orientée objet]
|qmake et la compilation avec Qt|"Documentation de qmake":http://doc.qt.nokia.com/4.7/qmake-manual.html|
|qmake et la compilation avec Qt|[http://doc.qt.nokia.com/4.7/qmake-manual.html| Documentation de qmake]


h2. Créer un fichier .pro
h2. Créer un fichier .pro
Line 170: Line 170:
h2. Utiliser QMainWindow
h2. Utiliser QMainWindow


Pleins d'applications profiterons de l'utilisation de "QMainWindow":http://doc.qt.nokia.com/4.7/qmainwindow.html, qui a son propre layout qui permet d'ajouter une barre de menu, des barres d'outils, des docks, et une barre de statut. "QMainWindow":http://doc.qt.nokia.com/4.7/qmainwindow.html a une partie centrale qui peut être occuper par n'importe quel widget. Pour notre Bloc-Notes, nous placerons notre champ de texte ici.
Pleins d'applications profiterons de l'utilisation de [http://doc.qt.nokia.com/4.7/qmainwindow.html QMainWindow], qui a son propre layout qui permet d'ajouter une barre de menu, des barres d'outils, des docks, et une barre de statut. [http://doc.qt.nokia.com/4.7/qmainwindow.html QMainWindow] a une partie centrale qui peut être occuper par n'importe quel widget. Pour notre Bloc-Notes, nous placerons notre champ de texte ici.


p=. [[Image:http://doc.qt.nokia.com/4.7/images/gs4.png|http://doc.qt.nokia.com/4.7/images/gs4.png]]
p=. [[Image:http://doc.qt.nokia.com/4.7/images/gs4.png|http://doc.qt.nokia.com/4.7/images/gs4.png]]
Line 202: Line 202:
Nous ajoutons deux slots supplémentaires pour sauvegarder et ouvrir un document. Nous les implémenterons après.
Nous ajoutons deux slots supplémentaires pour sauvegarder et ouvrir un document. Nous les implémenterons après.


Souvent, dans une fenêtre, le même slot peut être appelé par plusieurs widgets. Par exemple dans la barre de menus et dans une barre d'outils. Pour rendre ceci plus facile, Qt propose "QAction":http://doc.qt.nokia.com/4.7/qaction.html qui peut être donné à plusieurs widgets et être connecté à un slot. Par exemple, "QMenu":http://doc.qt.nokia.com/4.7/qmenu.html et "QToolBar":http://doc.qt.nokia.com/4.7/qtoolbar.html permettent de créer des menus et des boutons à partir d'une même "QAction":http://doc.qt.nokia.com/4.7/qaction.html. Nous verrons comment cela fonctionne.
Souvent, dans une fenêtre, le même slot peut être appelé par plusieurs widgets. Par exemple dans la barre de menus et dans une barre d'outils. Pour rendre ceci plus facile, Qt propose [http://doc.qt.nokia.com/4.7/qaction.html QAction] qui peut être donné à plusieurs widgets et être connecté à un slot. Par exemple, [http://doc.qt.nokia.com/4.7/qmenu.html QMenu] et [http://doc.qt.nokia.com/4.7/qtoolbar.html QToolBar] permettent de créer des menus et des boutons à partir d'une même [http://doc.qt.nokia.com/4.7/qaction.html QAction]. Nous verrons comment cela fonctionne.


Comme précédemment, nous utilisons le constructeur pour mettre en place l'interface graphique.
Comme précédemment, nous utilisons le constructeur pour mettre en place l'interface graphique.
Line 227: Line 227:
}</code>
}</code>


Les "QAction":http://doc.qt.nokia.com/4.7/qaction.html sont créés à partir du texte à afficher sur les widgets auxquels nous les ajoutons (ici, des éléments de menu ). Si nous voulions les ajoutez à une barre d'outils, nous aurions aussi pu définir des icones.
Les [http://doc.qt.nokia.com/4.7/qaction.html QAction] sont créés à partir du texte à afficher sur les widgets auxquels nous les ajoutons (ici, des éléments de menu ). Si nous voulions les ajoutez à une barre d'outils, nous aurions aussi pu définir des icones.


Lorsqu'un élément du menu est cliqué, l'élément déclenchera l'action, et le slot connecté sera appelé.
Lorsqu'un élément du menu est cliqué, l'élément déclenchera l'action, et le slot connecté sera appelé.
Line 234: Line 234:


|À propos de|Ici|
|À propos de|Ici|
|Les fenêtres principales et leurs sous classes|"Fenêtres principales":http://doc.qt.nokia.com/4.7/mainwindow.html, "Exemples de fenêtre principales":http://doc.qt.nokia.com/4.7/examples-mainwindow.html|
|Les fenêtres principales et leurs sous classes|[http://doc.qt.nokia.com/4.7/mainwindow.html Fenêtres principales], [http://doc.qt.nokia.com/4.7/examples-mainwindow.html| Exemples de fenêtre principales]
|Interfaces à plusieurs documents (MDI)|"QMdiArea":http://doc.qt.nokia.com/4.7/qmdiarea.html, "Exemples de MDI":http://doc.qt.nokia.com/4.7/mainwindows-mdi.html|
|Interfaces à plusieurs documents (MDI)|[http://doc.qt.nokia.com/4.7/qmdiarea.html QMdiArea], [http://doc.qt.nokia.com/4.7/mainwindows-mdi.html| Exemples de MDI]


h2. Sauvegarder et charger
h2. Sauvegarder et charger
Line 259: Line 259:
  }</code>
  }</code>


La première étape est de demander à l'utilisateur le nom du fichier à ouvrir. Qt propose "QFileDialog":http://doc.qt.nokia.com/4.7/qfiledialog.html, qui est une boite de dialogue pour sélectionner un fichier (Ici sous Kubuntu). La fonction statique "getOpenFileName()":http://doc.qt.nokia.com/4.7/qfiledialog.html#getOpenFileName permet d'en afficher une, et ne se termine pas tant qu'un fichier n'a pas été sélectionné. Elle retourne le chemin vers le fichier sélectionné, ou une chaine vide si l'utilisateur annule l'action.
La première étape est de demander à l'utilisateur le nom du fichier à ouvrir. Qt propose [http://doc.qt.nokia.com/4.7/qfiledialog.html QFileDialog], qui est une boite de dialogue pour sélectionner un fichier (Ici sous Kubuntu). La fonction statique [http://doc.qt.nokia.com/4.7/qfiledialog.html#getOpenFileName getOpenFileName()] permet d'en afficher une, et ne se termine pas tant qu'un fichier n'a pas été sélectionné. Elle retourne le chemin vers le fichier sélectionné, ou une chaine vide si l'utilisateur annule l'action.


Si nous obtenons un nom de fichier, nous essayons de l'ouvrir avec "open()":http://doc.qt.nokia.com/4.7/qiodevice.html#open, qui retourne ''true'' si le fichier a pu être ouvert. Nous ne traiterons pas de la gestion d'erreurs ici, mais des liens sont disponibles dans la section ''Plus d'informations''. Si le fichier ne peut pas être ouvert, nous utilisons un "QMessageBox":http://doc.qt.nokia.com/4.7/qmessagebox.html pour afficher une boite de dialogue avec l'erreur (en anglais, voir la documentation sur "QMessageBox":http://doc.qt.nokia.com/4.7/qmessagebox).
Si nous obtenons un nom de fichier, nous essayons de l'ouvrir avec [http://doc.qt.nokia.com/4.7/qiodevice.html#open open()], qui retourne ''true'' si le fichier a pu être ouvert. Nous ne traiterons pas de la gestion d'erreurs ici, mais des liens sont disponibles dans la section ''Plus d'informations''. Si le fichier ne peut pas être ouvert, nous utilisons un [http://doc.qt.nokia.com/4.7/qmessagebox.html QMessageBox] pour afficher une boite de dialogue avec l'erreur (en anglais, voir la documentation sur [http://doc.qt.nokia.com/4.7/qmessagebox QMessageBox]).


Lire les données est simple avec la fonction "readAll()":http://doc.qt.nokia.com/4.7/qiodevice.html#readAll, qui retourne toutes les données dans un "QByteArray":http://doc.qt.nokia.com/4.7/qbytearray.html. La fonction "constData()":http://doc.qt.nokia.com/4.7/qbytearray.html#constData retourne ces données dans une chaine en tant que ''const char*'', dont "QString":http://doc.qt.nokia.com/4.7/qstring.html possède un constructeur pour. Le contenu est ensuite affiché dans le champ de texte.
Lire les données est simple avec la fonction [http://doc.qt.nokia.com/4.7/qiodevice.html#readAll readAll()], qui retourne toutes les données dans un [http://doc.qt.nokia.com/4.7/qbytearray.html QByteArray]. La fonction [http://doc.qt.nokia.com/4.7/qbytearray.html#constData constData()] retourne ces données dans une chaine en tant que ''const char*'', dont [http://doc.qt.nokia.com/4.7/qstring.html QString] possède un constructeur pour. Le contenu est ensuite affiché dans le champ de texte.
Enfin, nous fermons le fichier avec la fonction "close()":http://doc.qt.nokia.com/4.7/qiodevice.html#close
Enfin, nous fermons le fichier avec la fonction [http://doc.qt.nokia.com/4.7/qiodevice.html#close close()]


Maintenant, occupons-nous du slot ''save()''.
Maintenant, occupons-nous du slot ''save()''.
Line 282: Line 282:
  }</code>
  }</code>


Lorsque nous écrivons le contenu du champ de texte dans le fichier, nous utilisons la classe "QTextStream":http://doc.qt.nokia.com/4.7/qtextstream.html, qui englobe la classe "QFile":http://doc.qt.nokia.com/4.7/qfile.html. Le flux textuel peut écrire des "QString":http://doc.qt.nokia.com/4.7.qstring.html directement dans le fichier, alors que "QFile":http://doc.qt.nokia.com/4.7/qfile.html n'accepte que les données sous forme de ''char*'' avec la méthode "write()":http://doc.qt.nokia.com/4.7/qiodevice.html#write de "QIODevice":http://doc.qt.nokia.com/4.7/qiodevice.html.
Lorsque nous écrivons le contenu du champ de texte dans le fichier, nous utilisons la classe [http://doc.qt.nokia.com/4.7/qtextstream.html QTextStream], qui englobe la classe [http://doc.qt.nokia.com/4.7/qfile.html QFile]. Le flux textuel peut écrire des [http://doc.qt.nokia.com/4.7.qstring.html QString] directement dans le fichier, alors que [http://doc.qt.nokia.com/4.7/qfile.html QFile] n'accepte que les données sous forme de ''char*'' avec la méthode [http://doc.qt.nokia.com/4.7/qiodevice.html#write write()] de [http://doc.qt.nokia.com/4.7/qiodevice.html QIODevice].


=== Plus d'informations ===
=== Plus d'informations ===

Revision as of 08:27, 4 March 2015

This article may require cleanup to meet the Qt Wiki's quality standards. Reason: Auto-imported from ExpressionEngine.
Please improve this article if you can. Remove the {{cleanup}} tag and add this page to Updated pages list after it's clean.

[toc align_right="yes" depth="3"]

Commencer à programmer avec Qt

Bienvenue dans le monde de Qt - la librairie GUI multiplateforme. Dans ce guide d'introduction, nous apprendrons les bases de Qt en créant un simple Bloc-Notes. Après avoir lu ce guide, vous devrez être prêt à chercher dans nos comptes-rendus et dans la documentation afin de trouver les informations nécessaires à l'application que vous développer.

Bonjour Bloc-Notes

Dans ce premier exemple, nous créons et affichons un simple champ d'édition de texte dans une fenêtre sur le bureau. C'est le programme le plus simple que l'on puisse faire avec une interface graphique.

p=. http://doc.qt.nokia.com/4.7/images/gs1.png

Voici le code :

#include <QApplication>
#include <QTextEdit>

int main(int argv, char **args)
{
 QApplication app(argv, args);

QTextEdit textEdit;
 textEdit.show();

return app.exec();
}

Analysons le code ligne par ligne. Dans les deux premières lignes, nous incluons les fichiers en-têtes QApplication et QTextEdit, qui sont les classes dont nous avons besoin dans cet exemple. Toutes les classes de Qt ont des en-têtes respectifs.

À la ligne 6, nous créons un objet QApplication. Cet objet gère les ressources de l'application et est requis pour n'importe quel programme Qt qui a une interface graphique. Il prend les paramètres argv et args car Qt accepte les paramètres en ligne de commande.

La ligne 8 crée un objet QTextEdit. Un champ d'édition de texte est un élément graphique dans une interface graphique. Dans Qt, nous les appelons des widgets. Des exemples de widgets sont les barres de défilement, les étiquettes, ou les cases d'options. Un widget peut aussi contenir d'autres widgets; une fenêtre par exemple, est un widget qui en contient d'autres.

À la ligne 9, nous affichons le champ d'édition de texte à l'écran dans la propre fenêtre. Puisque les widgets sont aussi des conteneurs (par exemple un objet QMainWindow qui a des barres d'outils, des menus, une barre de status, et d'autres widgets), il est possible de les afficher dans leur propre fenêtre. Les widgets de sont pas visibles par défaut; la fonction show() le rend visible.

La ligne 11 fait entrer le QApplication dans un boucle d'évènements. Quand une application Qt est lancée, des évènements sont générés et envoyés aux widgets de l'application. Des exemples d'évènements sont les clics de souris ou les touches de clavier. Quand vous écrivez dans le champ de texte, il reçoit des évènements de touches de claviers appuyées et réagit en écrivant le texte tapé.

Pour lancer l'application, lancez une console, allez dans le répertoire où est situé le .cpp du programme. Les commandes suivantes compile le programme.

qmake -project
qmake
make

Cela créera un exécutable dans le dossier part1 (notez que sous Windows, il faudra peut-être utilisez nmake au lieu de make. L'exécutable créé sera placé dans part1/debug ou part1/release). qmake est l'outil de Qt, qui à partir d'un fichier de configuration .pro, créé avec le paramètre -project, génère un make file qui compilera le programme pour vous. Nous étudierons la création de nos propres .pro plus tard.

h3. Plus d'informations

|À propos de|Ici| |Les widgets et la géométrie des fenêtres|Fenêtres et boites de dialogue |Les évènements et leur gestion|Le système d'évènement

h2. Ajouter un bouton Quitter

Dans une application normale, vous aurez normalement plus d'un widget. Nous ajouterons un objet QPushButton en dessous du champ de texte. Ce bouton quittera le Bloc-Notes lorsqu'il sera cliqué.

p=. http://doc.qt.nokia.com/4.7/images/gs2.png

Regardons le code.

#include <QtGui>

int main(int argv, char **args)
{
 QApplication app(argv, args);

 QTextEdit textEdit;
 QPushButton quitButton("Quit");

 QObject::connect(&amp;quitButton, SIGNAL (clicked()), qApp, SLOT (quit()));

 QVBoxLayout layout;
 layout.addWidget(&amp;textEdit);
 layout.addWidget(&amp;quitButton);

 QWidget window;
 window.setLayout(&amp;layout);

 window.show();

 return app.exec();
}

À la ligne 1, nous incluons QtGui, qui contient toutes les classes graphiques de Qt.

À la ligne 10, nous utilisons le système de signaux et de slots de Qt pour quitter l'application quand le bouton Quit est cliqué. Un slot est une fonction qui peut être appelée à l'exécution grâce à son nom. Un signal est une fonction qui lorsqu'elle est appelée appelle les slots qui lui sont connectés. On dit qu'on connecte un slot à un signal et qu'on émet un signal.

quit() est un slot de QApplication. clicked() est un signal qu'un QPushButton émet lorsqu'il est cliqué. La focntion statique QObject::connect() permet de connecter le slot au signal. SIGNAL ()_ et _SLOT() sont deux macros qui prennent la signature du signal et du slot à connecter. Il faut aussi donner des pointeurs vers les objets qui envoient et reçoivent le signal.

La ligne 12 crée un objet QVBoxLayout. Nous avons dit que les widgets peuvent en contenir d'autres. Il est possible de stipuler les bords de chaque widgets (position et taille), mais il est souvent plus simple d'utiliser un layout. Un layout s'occupe de définir les bords de chaque widget fils. QVBoxLayout par exemple, met les widgets fils en rang vertical.

Les lignes 13 et 14 ajoute le champ de texte et le bouton au layout. À la ligne 17, nous assignons le layout à un widget, ici la fenêtre.

h3. Plus d'informations

|À propos de|Ici| |Les signaux et les slots|Signaux & slots |Les layouts|Gestion des layouts, Widgets et layouts, Exemples de layout |Les différents widgets de Qt|Gallerie de widgets Qt, Exemples de widgets

h2. Hériter QWidget

Quand l'utilisateur quitte une application, on peut vouloir ajouter une boite de dialogue pour demander de confirmer avant de quitter. Dans cet exemple, nous créons une classe qui hérite de QWidget, et nous ajoutons un slot à connecter au bouton pour quitter.

p=. http://doc.qt.nokia.com/4.7/images/gs3.png


Regardons le code :

class Notepad : public QWidget
{
 Q_OBJECT

 public:
 Notepad();

 private slots:
 void quit();

 private:
 QTextEdit *textEdit;
 QPushButton '''quitButton;
};

La macro Q_OBJECT doit être située en premier dans la classe, et déclare notre classe comme un QObject (Bien sûr, elle doit aussi héritée de QObject). Un objet QObject ajoute quelques possibilités supplémentaires par rapport à une classe normale de C+. Par exemple, le nom de la classe et de ses slots peut être récupéré à l'exécution, ainsi que les paramètres d'un slot.

La ligne 13 déclare le slot quit(), avec la macro slots. Le slot quit() peut maintenant être connecter à n'importe quel signal avec la même signature, c'est-à-dire aucuns paramètres.

Au lieu de créer l'interface et de connecter le slot dans la fonction main(), nous le faisons dans le constructeur de la classe Notepad.

Notepad::Notepad()
{
 textEdit = new QTextEdit;
 quitButton = new QPushButton(tr("Quit"));

 connect(quitButton, SIGNAL (clicked()), this, SLOT (quit()));

 QVBoxLayout '''layout = new QVBoxLayout;
 layout->addWidget(textEdit);
 layout->addWidget(quitButton);

 setLayout(layout);

 setWindowTitle(tr("Notepad"));
}


Comme vu dans la déclaration de la classe, nous utilisons des pointeurs vers nos QObject (textEdit et quitButton). Vous devriez toujours allouez des QObject dynamiquement et ne jamais les copier.

Nous utilisons maintenant les fonction tr() pour nos variables textes. Cette fonction est nécessaire pour fournir une traduction à votre application. Nous n'entrerons pas dans les détails, mais vous pouvez vous renseignez avec le lien Qt Linguist dans Plus d'informations

h3. Plus d'informations

|À propos de|Ici| |tr() et la traduction|Documentation de Qt Linguist, Écrire du code source pour traduire, Exemples de tr() avec Hello World, Internationalisation avec Qt |QObjects et la programmation orientée objet avec Qt (Essentiel pour comprendre Qt)|La programmation orientée objet |qmake et la compilation avec Qt|Documentation de qmake

h2. Créer un fichier .pro

Pour cet exemple, nous créons notre propre fichier .pro au lieu d'utiliser l'option -project de qmake.

HEADERS = notepad.h
SOURCES = notepad.cpp main.cpp

Les commandes suivantes compile alors l'exemple.

qmake
make

h2. Utiliser QMainWindow

Pleins d'applications profiterons de l'utilisation de QMainWindow, qui a son propre layout qui permet d'ajouter une barre de menu, des barres d'outils, des docks, et une barre de statut. QMainWindow a une partie centrale qui peut être occuper par n'importe quel widget. Pour notre Bloc-Notes, nous placerons notre champ de texte ici.

p=. http://doc.qt.nokia.com/4.7/images/gs4.png

Regardons la nouvelle déclaration de Notepad

#include <QtGui>

class Notepad : public QMainWindow
{
 Q_OBJECT

 public:
 Notepad();

 private slots:
 void open();
 void save();
 void quit();

 private:
 QTextEdit *textEdit;

 QAction *openAction;
 QAction *saveAction;
 QAction *exitAction;

 QMenu '''fileMenu;
};

Nous ajoutons deux slots supplémentaires pour sauvegarder et ouvrir un document. Nous les implémenterons après.

Souvent, dans une fenêtre, le même slot peut être appelé par plusieurs widgets. Par exemple dans la barre de menus et dans une barre d'outils. Pour rendre ceci plus facile, Qt propose QAction qui peut être donné à plusieurs widgets et être connecté à un slot. Par exemple, QMenu et QToolBar permettent de créer des menus et des boutons à partir d'une même QAction. Nous verrons comment cela fonctionne.

Comme précédemment, nous utilisons le constructeur pour mettre en place l'interface graphique.

Notepad::Notepad()
{
 saveAction = new QAction(tr("&amp;Open"), this);
 saveAction = new QAction(tr("&amp;Save"), this);
 exitAction = new QAction(tr("E&amp;amp;xit"), this);

 connect(openAction, SIGNAL (triggered()), this, SLOT (open()));
 connect(saveAction, SIGNAL (triggered()), this, SLOT (save()));
 connect(exitAction, SIGNAL (triggered()), qApp, SLOT (quit()));

 fileMenu = menuBar()->addMenu(tr("&amp;File"));
 fileMenu->addAction(openAction);
 fileMenu->addAction(saveAction);
 fileMenu->addSeparator();
 fileMenu->addAction(exitAction);

 textEdit = new QTextEdit;
 setCentralWidget(textEdit);

 setWindowTitle(tr("Notepad"));
}

Les QAction sont créés à partir du texte à afficher sur les widgets auxquels nous les ajoutons (ici, des éléments de menu ). Si nous voulions les ajoutez à une barre d'outils, nous aurions aussi pu définir des icones.

Lorsqu'un élément du menu est cliqué, l'élément déclenchera l'action, et le slot connecté sera appelé.

h3. Plus d'informations

|À propos de|Ici| |Les fenêtres principales et leurs sous classes|Fenêtres principales, Exemples de fenêtre principales |Interfaces à plusieurs documents (MDI)|QMdiArea, Exemples de MDI

h2. Sauvegarder et charger

Dans cet exemple, nous implémenterons les fonctionnalités des slots open() et save() que nous avions ajoutés précédemment.

p=. http://doc.qt.nokia.com/4.7/images/gs5.png

Commencons avec le slot open().

 QString fileName = QFileDialog::getOpenFileName(this, tr("Open File"), "",
 tr("Text Files ('''.txt);;C++ Files ('''.cpp'''.h)"));

 if (fileName != "") {
 QFile file(fileName);
 if (!file.open(QIODevice::ReadOnly)) {
 QMessageBox::critical(this, tr("Error"),
 tr("Could not open file"));
 return;
 }
 QString contents = file.readAll().constData();
 textEdit->setPlainText(contents);
 file.close();
 }

La première étape est de demander à l'utilisateur le nom du fichier à ouvrir. Qt propose QFileDialog, qui est une boite de dialogue pour sélectionner un fichier (Ici sous Kubuntu). La fonction statique getOpenFileName() permet d'en afficher une, et ne se termine pas tant qu'un fichier n'a pas été sélectionné. Elle retourne le chemin vers le fichier sélectionné, ou une chaine vide si l'utilisateur annule l'action.

Si nous obtenons un nom de fichier, nous essayons de l'ouvrir avec open(), qui retourne true si le fichier a pu être ouvert. Nous ne traiterons pas de la gestion d'erreurs ici, mais des liens sont disponibles dans la section Plus d'informations. Si le fichier ne peut pas être ouvert, nous utilisons un QMessageBox pour afficher une boite de dialogue avec l'erreur (en anglais, voir la documentation sur QMessageBox).

Lire les données est simple avec la fonction readAll(), qui retourne toutes les données dans un QByteArray. La fonction constData() retourne ces données dans une chaine en tant que const char*, dont QString possède un constructeur pour. Le contenu est ensuite affiché dans le champ de texte. Enfin, nous fermons le fichier avec la fonction close()

Maintenant, occupons-nous du slot save().

 QString fileName = QFileDialog::getSaveFileName(this, tr("Save File"), "",
 tr("Text Files ('''.txt);;C''+ Files ('''.cpp *.h)"));

 if (fileName != "") {
 QFile file(fileName);
 if (!file.open(QIODevice::WriteOnly)) {
 // сообщение об ошибке
 } else {
 QTextStream stream(&amp;file);
 stream << textEdit->toPlainText();
 stream.flush();
 file.close();
 }
 }

Lorsque nous écrivons le contenu du champ de texte dans le fichier, nous utilisons la classe QTextStream, qui englobe la classe QFile. Le flux textuel peut écrire des QString directement dans le fichier, alors que QFile n'accepte que les données sous forme de char* avec la méthode write() de QIODevice.

Plus d'informations

À propos de Ici