INTERFACE GRAPHIQUE

Page 1 sur 6
INTERFACE GRAPHIQUE
Introduction
Nous allons étudier la programmation des interfaces graphiques (en anglais, on parle
de GUI : Graphical User Interface) grâce à PyQt5 qui permet d’utiliser la bibliothèque Qt
version 5 avec Python.
Pourquoi Qt?
 Multi-Plateformes
 Performance
 Relativement Simple
 Gratuit (GPL) et code source Nombreux
Qui utilise Qt ?
ESA, Nokia, Nasa, Adobe, Motorola, Google, …
Les principaux modules
 QtCore
 QtWidgets
 QtGUI
 QtBluetooth
 QtOpenGL
 QtSript/QtScriptTools
 QtSql
 QtSvg
 QtWebKit
 QtXml/QtXmlPatterns
 QtMultimedia
 QtSensors
Le module QtWidgets
Il gère les widgets qui constituent l’interface graphique
 QPushButton
 QLabel
 QEdit
 QRadioButton
 QCheckBox
 QSlider
 QProgressBar
 …

Page 2 sur 6
Exercice N°1 :
1- Lancer Qt Designer
2- Créer l’interface graphique ci dissous permettant de calculer la somme des deux
entiers
3- Enregistrer l’interface sous le nom somme .ui
4- Citer les objets utiliser dans cette interface
5- Attribuer un nom à chaque objet utiliser dans cette interface
6- Appliquer la mise en forme suivante :
 Titre : police : forte ; taille 18 ; couleur : blanc ; couleur d’arrière-plan : violet
 Nombre 1, Nombre 2 et Résultat : police : forte ; taille 14 ; couleur : violet
 Alignement : centré
 Bouton calculer : Police : forte ; taille 12 ;
7- Lancer l’editeur Thonny

Page 3 sur 6
8- Développer un module calculsomme qui s’exécute à la suite d’un clic sur le bouton
Calculer permettant de récupérer les valeurs des deux nombres puis de calculer et
afficher leur somme
9- Enregistrer le programme sous le nom somme .py
10- Dans le programme somme.py, ajouter les instructions permettant :
 D’appeler l’interface graphique intitulée "somme.ui" en exploitant l’annexe ci-dessous.
 D’exécuter le bouton Calculer
11- Ajouter un bouton(vider) permettant de vider les champs
12- Implémenter un module Annuler qui s’exécute à la suite d’un clic sur le bouton vider
13- Ajouter un bouton quitter permettant de fermer l’interface somme
14- Implémenter un module fermer qui s’exécute à la suite d’un clic sur le bouton quitter
Constatations :
from PyQt5.uic import loadUi
………………………………………………………………………………………………………………
………………………………………………………………………………………………………………
from PyQt5.QtWidgets import QApplication
………………………………………………………………………………………………………………
………………………………………………………………………………………………………………
app= QApplication ([])
………………………………………………………………………………………………………………
………………………………………………………………………………………………………………
windows=loadUI(“Nom_Interface.ui”)

Page 4 sur 6
………………………………………………………………………………………………………………
………………………………………………………………………………………………………………
windows.show()
………………………………………………………………………………………………………………
windows.Nom_Bouton.clicked.connect(Nom_Module)
………………………………………………………………………………………………………………
………………………………………………………………………………………………………………
app.exec_()
………………………………………………………………………………………………………………
Code Python
……………………………………………………………………………………………………………………………………………………………………..
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………………………………..
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………………………………..
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………………………………..
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………………………………..

Page 5 sur 6
Exercice N°2 :
Créer l’interface graphique ci dissous permettant de calculer et afficher le factoriel
d’un entier
Code Python
……………………………………………………………………………………………………………………………………………………………………..
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………………………………..
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………………………………..
………………………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………………………………..