Accueil › Cours › Interfaces graphiques avec Qt

Interfaces graphiques Qt Designer et PyQt5 : bac pratique

Chapitre 19 · Bac Maths, Sciences, Technique, 3ème SI, Bac SI

Une fenêtre dessinée avec Qt Designer, un programme Python qui réagit aux clics : le cœur du bac pratique.

Les leçons de ce chapitre

Ma première fenêtre
Calculer et contrôler la saisie
Boutons radio, cases à cocher, listes déroulantes
Afficher une liste de résultats

Leçon 19.1 : Ma première fenêtre

10 min

Une interface graphique remplace input() et print() par une fenêtre : des zones de texte pour saisir, des boutons pour agir, des étiquettes pour afficher. On la dessine avec Qt Designer en glissant-déposant les objets, puis on l'enregistre dans un fichier interface.ui.

QLabel (étiquette) : affiche un texte. QLineEdit (zone de texte) : l'utilisateur tape une valeur. QPushButton (bouton) : déclenche une action.
Chaque objet a un nom (objectName) choisi dans Qt Designer : txtNom, btnSaluer, lblMessage. Le programme les appelle par ce nom.
.text() lit le texte d'une zone, .setText(…) écrit dans une étiquette, .clear() vide une zone, .show() affiche la fenêtre.

La programmation événementielle

Le programme ne s'exécute pas de haut en bas d'un seul coup : il attend que l'utilisateur clique. On relie le signal clicked d'un bouton à une fonction : fenetre.btnSaluer.clicked.connect(saluer). À chaque clic, la fonction saluer est exécutée.

Attention : Dans connect(saluer), on donne le nom de la fonction, sans parenthèses. Avec connect(saluer()), la fonction s'exécuterait tout de suite, avant le moindre clic.

En Python

La fenêtre a une zone txtNom, un bouton btnSaluer et une étiquette lblMessage. Lance-la, tape ton prénom et clique.

from PyQt5.uic import loadUi
from PyQt5.QtWidgets import QApplication

def saluer():
    nom = fenetre.txtNom.text()
    fenetre.lblMessage.setText("Bonjour " + nom + " !")

app = QApplication([])
fenetre = loadUi("interface.ui")
fenetre.show()
fenetre.btnSaluer.clicked.connect(saluer)
app.exec_()

Leçon 19.2 : Calculer et contrôler la saisie

11 min

Ce que l'utilisateur tape est toujours une chaîne. Avant de calculer, on la convertit avec int(…) ou float(…). Mais si la zone est vide ou contient des lettres, la conversion provoque une erreur : il faut contrôler la saisie et afficher un message.

Zone vide : if fenetre.txtA.text() == "":
Entier positif : ch.isdigit() est vrai seulement si ch ne contient que des chiffres (et n'est pas vide).
Le message d'erreur va dans une étiquette avec .setText(…).

Astuce : Un deuxième bouton « Effacer » est souvent demandé : sa fonction appelle .clear() sur chaque zone et sur l'étiquette du résultat.

En Python

Moyenne de deux notes, avec un message si une note manque. Essaie en laissant une zone vide.

from PyQt5.uic import loadUi
from PyQt5.QtWidgets import QApplication

def moyenne():
    a = fenetre.txtN1.text()
    b = fenetre.txtN2.text()
    if a == "" or b == "":
        fenetre.lblRes.setText("Remplir les deux notes")
    else:
        m = (float(a) + float(b)) / 2
        fenetre.lblRes.setText("Moyenne : " + str(m))

def effacer():
    fenetre.txtN1.clear()
    fenetre.txtN2.clear()
    fenetre.lblRes.clear()

app = QApplication([])
fenetre = loadUi("interface.ui")
fenetre.show()
fenetre.btnMoyenne.clicked.connect(moyenne)
fenetre.btnEffacer.clicked.connect(effacer)
app.exec_()

Leçon 19.3 : Boutons radio, cases à cocher, listes déroulantes

11 min

En Sciences de l'informatique, l'interface propose aussi des choix :

QRadioButton (bouton radio) : un seul choix parmi plusieurs. rbGrande.isChecked() vaut True s'il est coché.
QCheckBox (case à cocher) : une option qu'on ajoute ou non, isChecked() aussi.
QComboBox (liste déroulante) : currentText() donne le texte choisi, currentIndex() sa position (à partir de 0).

Astuce : Les boutons radio d'un même groupe s'excluent : cocher l'un décoche les autres.

En Python

Une commande de pizza : la taille fixe le prix, le supplément fromage ajoute 2 DT.

from PyQt5.uic import loadUi
from PyQt5.QtWidgets import QApplication

def prix():
    if fenetre.rbGrande.isChecked():
        p = 14
    else:
        p = 8
    if fenetre.chkFromage.isChecked():
        p = p + 2
    fenetre.lblPrix.setText("À payer : " + str(p) + " DT")

app = QApplication([])
fenetre = loadUi("interface.ui")
fenetre.show()
fenetre.btnPrix.clicked.connect(prix)
app.exec_()

Leçon 19.4 : Afficher une liste de résultats

10 min

Quand le résultat est une liste (les diviseurs d'un nombre, les élèves admis…), on l'affiche dans un QListWidget : une ligne par élément. C'est au programme du Bac Sciences de l'informatique.

fenetre.liste.addItem("texte") ajoute une ligne à la fin.
fenetre.liste.clear() vide la liste : on l'appelle au début, sinon les anciens résultats restent.
fenetre.liste.count() donne le nombre de lignes.

Attention : addItem attend une chaîne : écris addItem(str(d)) pour un nombre.

En Python

Les multiples de n jusqu'à 50 apparaissent dans la liste, et leur nombre dans l'étiquette.

from PyQt5.uic import loadUi
from PyQt5.QtWidgets import QApplication

def multiples():
    n = int(fenetre.txtN.text())
    fenetre.listeRes.clear()
    k = n
    while k <= 50:
        fenetre.listeRes.addItem(str(k))
        k = k + n
    fenetre.lblNb.setText(str(fenetre.listeRes.count()) + " multiples")

app = QApplication([])
fenetre = loadUi("interface.ui")
fenetre.show()
fenetre.btnMultiples.clicked.connect(multiples)
app.exec_()

S'entraîner gratuitement

Chaque leçon a 3 exercices gratuits avec indices pour appliquer ce chapitre avec Hannibot.

Ouvrir le chapitre dans Mission Carthage Essayer dans le compilateur en ligne

← Chapitre précédent : Les enregistrements · Chapitre suivant : Approximation et optimisation →

Tous les chapitres · Voir les devoirs corrigés de 2ème TI

Cours écrit pour Mission Carthage d'après le programme officiel. Ton professeur reste la référence.