Programmation Qt/Les widgets

Un livre de Wikilivres.
Sauter à la navigation Sauter à la recherche
Programmation Qt
Programmation Qt
Sommaire
Modifier le sommaire

Cette page présente certains widgets de Qt, ceux que vous utiliserez principalement.

Note : Pour ceux qui connaissent le HTML, la plupart de ces widgets sont transformés par le moteur web, qui en fait des objets Qt, puis par le compilateur.

QWidget : le widget de base[modifier | modifier le wikicode]

QWidget est LE widget de base. QWidget hérite de QObject. Quand on envoie un widget, tel qu'il soit, s'il n'a pas de widget parent, la fenêtre sera lancée et prendra la taille de celui-ci. Voici des propriétés pour les QWidget.

Propriétés pour les widgets classiques comme pour les fenêtres[modifier | modifier le wikicode]

  • geometry : la méthode setGeometry() attend la taille du widget (L, l) et le positionnement du widget (x, y)
  • size : comme pour geometry, sauf que cette fois-ci, ce n'est que la taille qu'on attend
  • move : n'attend que le positionnement
  • height : la hauteur du widget
  • width : la largeur du widget

Propriétés utilisables uniquement avec les fenêtres[modifier | modifier le wikicode]

  • windowFlags : le type de fenêtre. Pour une fenêtre de type "Outil", il faut écrire : setWindowFlags(Qt::Tools);
  • windowIcon : l'icone de la fenêtre. setIcon() attend un objet QIcon qui attend lui-même le nom de l'image : setWindowIcon(QIcon("iconeLogiciel.png"));
  • windowTitle : le titre de la fenêtre. setWindowTitle("Mon programme en Qt");

Les widgets afficheurs[modifier | modifier le wikicode]

QLabel : afficher un texte ou une image[modifier | modifier le wikicode]

QLabel est un objet de Qt. Il permet d'afficher un texte ou une image.

Afficher du texte[modifier | modifier le wikicode]

Pour afficher du texte, il suffit d'écrire :

1 QLabel *m_texte = new QLabel(); // Création de l"objet
2 m_texte->setText("Mon texte"); // Définition du texte

La méthode à utiliser est donc setText(). Pour récupérer ce texte, utilisez la méthode text().

Afficher une image[modifier | modifier le wikicode]

Pour afficher une image, utilisez la méthode setPixmap() :

3 QLabel *m_image = new QLabel();
4 m_image->setPixmap(QPixmap("mon_image.png");

Vous pouvez utiliser la méthode pixmap() qui vous renvoie un QPixmap.

QProgressBar : une barre de progression[modifier | modifier le wikicode]

QProgressBar de valeur 50%
Une QProgressBar, avec pour valeur 50%

Pour afficher une barre de progression, il faut écrire :

1 QProgressBar *m_progressbar = new QProgressBar(); /* Création de la barre de progression */
2 m_progressbar->setValue(50); /* Choix de la valeur de la barre → 50 % */

On remarque la présence de la méthode setValue(), pour choisir la valeur de cet objet, et on en déduit qu'il faut utiliser value() pour récupérer cette valeur. Pour les signaux, il y a valueChanged() qui s'active quand la valeur change.

Les boutons[modifier | modifier le wikicode]

QPushButton : un bouton classique[modifier | modifier le wikicode]

Bouton de type classique
Un bouton classique, affichant le texte "Quitter"

QPushButton est une classe de Qt permettant de créer un bouton de type classique.

1 QPushButton *m_pushbutton = new QPushButton();
2 m_pushbutton->setText("Quitter");

Signaux :[modifier | modifier le wikicode]

  • clicked() : est envoyé quand on clique sur le bouton
  • pressed() : est envoyé tant que le bouton est préssée
  • released() : est envoyé quand le bouton est relaché

Application :

3 connect(&m_pushbutton, SIGNAL(clicked()), qApp, SLOT(quit()));/* L'application quittera quand on cliquera sur le bouton */

QCheckBox : une case à cocher[modifier | modifier le wikicode]

Deux QCheckBox
Deux QCheckBox, mis en place grâce à un layout.

La case à cocher est présente dans Qt sous la forme d'un QCheckBox. Pour en créer une, il faut suivre le processus habituel :

1 QCheckBox *caseACocher = new QCheckBox(" J'aime Qt");

QRadioButton : un bouton radio[modifier | modifier le wikicode]

Les boutons radio sont des groupes de boutons dont un seul de ceux-ci peut être coché. Pour en créer, cela change car il faut créer un objet de type QGroupBox, pour définir quels boutons iront ensemble ("Je programme en Qt" et "J'habite à New York" ne feront pas parti du même objet QGroupBox. Observons donc le protocole :

Plusieurs QRadioButton réunis dans un QGroupBox
 1 QGroupBox *qgroupbox = new QGroupBox("Votre language de programmation préféré :"); /* Création du QGroupBox */
 2 QRadioButton *cPlusPlus = new QRadioButton("C++"); /* Création de l'option C++ ... */
 3 QRadioButton *python = new QRadioButton("Python"); /*..., de l'option Python ... */
 4 QRadioButton *php = new QRadioButton("PHP"); /*..., et de l'option PHP */
 5 
 6 QVBoxLayout *layout = new QVBoxLayout(); /* Création du layout */
 7 layout->addWidget(cPlusPlus);/* Ajout des QRadioButton */
 8 layout->addWidget(python);
 9 layout->addWidget(php);
10 
11 qgroupbox->setLayout(layout); /* Définition du layout pour l'objet QGroupBox */

Les champs[modifier | modifier le wikicode]

Les champs sont des widgets où l’utilisateur entre une information.

QLineEdit : un champ de texte à une ligne[modifier | modifier le wikicode]

Pour créer un champ de texte à une ligne en Qt, il faut créer un objet de type QLineEdit :

1 QLineEdit *m_lineEdit = new QlineEdit();
2 m_lineEdit->setPlaceholder("Ex: Qt");

QTextEdit : un champ de texte multiligne[modifier | modifier le wikicode]

Pour créer un champ de texte multiligne en Qt, c'est un objet QTextEdit qu'il faut créer :

1 QTextEdit *m_textedit = new QTextEdit();

QSpinBox : un champ de nombres[modifier | modifier le wikicode]

Un QSpinBox est un champ de texte pour nombres. Le protocole pour créer un objet de ce type est le suivant :

1 QSpinBox *m_spinbox = new QSpinBox();

Propriétés[modifier | modifier le wikicode]

  • step : le pas de déplacement des nombres.
  • minValue : la valeur minimale
  • maxValue : la valeur maximale

Modifions les propriétés ci-dessus :

2 m_spinbox->setStep(2); /* On se déplacera de 2 en 2 */
3 m_spinbox->setMinValue(0); /* La valeur minimale sera de 0 */
4 m_spinbox->setMaxValue(100); /* La valeur maximale sera de 100 */

Exercice[modifier | modifier le wikicode]

Pour s'entraîner un peu, essayez de modifier la valeur d'un QProgressBar avec un QSpinBox.

QDoubleSpinBox : un champ de nombres non-entiers[modifier | modifier le wikicode]

Un QDoubleSpinBox est un QSpinBox à l'exception qu'il gère aussi les nombres non-entiers. Pour créer un objet de ce type, suivez le code suivant :

1 QDoubleSpinBox *m_doublespinbox = new QDoubleSpinBox(); /* Création de l'objet */

Propriétés[modifier | modifier le wikicode]

  • les mêmes que QSpinBox
  • decimal : le nombre de chiffres après la virgule

Modifions les propriétés :

2 m_doublespinbox->setMinValue(0);
3 m_doublespinbox->setDecimal(2); /* Il y aura deux chiffres après la virgule */

QSlider : un curseur[modifier | modifier le wikicode]

En Qt, QSlider est une classe permettant de créer un curseur. Voici comment créer un objet de ce type :

1 QSlider *m_slider = new QSlider();

Propriétés[modifier | modifier le wikicode]

  • orientation : l'orientation du QSlider
  • value : la valeur du QSlider

Signaux[modifier | modifier le wikicode]

  • valueChanged(int) : est envoyé quand la valeur change, autrement dit quand on déplace le curseur

Exercice[modifier | modifier le wikicode]

Comme plus haut dans cette page, vous pouvez contrôler un QProgressBar, mais avec cette fois-ci un QSlider.

QComboBox : une liste déroulante[modifier | modifier le wikicode]

Une liste déroulante, QComboBox, est l'équivalent de boutons radios (QRadioButton), à l'exception que celle-ci ne prend qu'une petite place même pour une grande liste.

1 QComboBox *m_combobox = new QComboBox(); /* Création de la liste */
2 m_combobox->addItem("Paris"); /* Ajout des options */
3 m_combobox->addItem("Tokyo");
4 m_combobox->addItem("Ottawa");

Propriétés[modifier | modifier le wikicode]

  • count : le nombre d'éléments dans la liste
  • currentId : l'id de l'élément sélectionné
  • currentText : le texte de l'élément sélectionné
  • editable : un booléen qui autorise ou non l'ajout de valeurs personnalisées. Si l'option est activée (elle ne l'est pas par défaut), les nouveaux éléments seront placés à la fin de la liste.

Maintenant, nous allons écrire un petit code :

5 QPushButton *boutonEnvoyer = new QPushButton("Envoyer !"); /* Création d'un bouton pour envoyer la valeur de la liste */
6 connect(boutonEnvoyer, SIGNAL(clicked()), this, SLOT(QMessageBox::information(this, "Capitale", ("Votre capitale est : " + m_combobox->currentText()))));

QDateEdit : un champ pour date[modifier | modifier le wikicode]

Un QDateEdit se comporte à peu près comme un QSpinBox. Dans les propriétés, value est remplacé par date.

Les widgets conteneurs[modifier | modifier le wikicode]

Dans cette section, nous allons découvrir les widgets fait pour contenir. Car un QPushButton peut contenir un QProgressBar. Ah oui, ce n'est pas malin, mais cela nous prouve que Qt est flexible.

  • QFrame : une bordure
  • QGroupBox : pour les QRadioButton
  • QTabWidget : un conteneur d'onglets

Nous n'allons pas étudier QGroupBox car vous devez vous en servir. Si vous ne savez pas rendez-vous plus haut dans la page.

QFrame : une bordure[modifier | modifier le wikicode]

Le fonctionnement de QFrame est très simple :

1 QFrame *m_frame = new QFrame();
2 m_frame->setFrameStyle(QFrame::StyledPanel | QFrame::Raised) /* Exemple de bordure */

Ensuite, pour les widgets enfants, un setLayout(monLayout); qui contient lui-même des widgets.

QTabWidget : un conteneur à onglets[modifier | modifier le wikicode]

Un QTabWidget est un conteneur à onglets. Il ne peut y avoir qu'un seul widget par onglets. Heureusement, un widget peut en contenir un autre, autrement dit vous pouvez mettre un layout qui contient tous les widgets que vous voulez.

 1 QTabWidget *onglets = new QTabWidget();
 2 
 3 QWidget *pageAccueil = new QWidget();
 4 
 5 QLabel *bienvenue = new QLabel("Bienvenue à tous");
 6 QPushButton *boutonQuitter = new QPushButton("Quitter");
 7 connect(boutonQuitter, SIGNAL(clicked()), qApp, SLOT(quit()));
 8 
 9 QVBoxLayout *layout = new QVBoxLayout();
10 layout->addWidget(bienvenue);
11 layout->addWidget(boutonQuitter);
12 
13 pageAccueil->setLayout(layout);
14 
15 QLabel *image = new QLabel();
16 image->setPixmap(QPixmap("monImage.png"));
17 
18 onglets->addTab(pageAccueil, "Accueil");
19 onglets->addTab(image, "Image");

Ce code affiche :

  • un onglet Accueil qui contient le texte de bienvenue et le bouton Quitter.
  • un onglet Image qui contient une image

Vous pouvez aussi mettre des QTabWidget dans des QTabWidget :

 1 QTabWidget *univers = new QTabWidget();
 2 QTabWidget *systemeSolaire = new QTabWidget();
 3 
 4 QWidget *pageSoleil = new QWidget();
 5 QWidget *pageMercure = new QWidget();
 6 QWidget *pageEtc = new QWidget();
 7 
 8 systemeSolaire->addTab(pageSoleil, "Soleil");
 9 systemeSolaire->addTab(pageMercure, "Mercure");
10 systemeSolaire->addTab(pageEtc, "...");
11 
12 univers->addTab(systemeSolaire, "Système solaire")