Nous vous donnons ici une série d'exemples sur l'utilisation de QVBoxLayout en PyQt5, qui vous permettront de créer des interfaces avec une disposition verticale des widgets dans une fenêtre.
1. Introduction à QVBoxLayout
QVBoxLayout est une classe de PyQt5 permettant d'organiser les widgets verticalement, de haut en bas, dans une interface graphique. Chaque widget ajouté est empilé sous le précédent, ce qui est utile pour organiser des éléments comme des boutons, des labels ou des champs de saisie.
2. Préparation de l'environnement
Commencer per installer PyQt5. Si ce n’est pas fait, installez-le en exécutant :
|
1 2 |
pip install pyqt5 pip install pyqt5-tools |
3. Création d’une Interface Basique avec QVBoxLayout
Voici un exemple de base pour comprendre l'utilisation de QVBoxLayout.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
from PyQt5.QtWidgets import QApplication, QWidget, QLabel, QPushButton, QVBoxLayout import sys app = QApplication(sys.argv) # Création de la fenêtre principale window = QWidget() window.setWindowTitle("Exemple de QVBoxLayout") window.setGeometry(100, 100, 300, 200) # Création des widgets label = QLabel("Bienvenue dans PyQt5!") button1 = QPushButton("Bouton 1") button2 = QPushButton("Bouton 2") # Création du layout vertical vbox = QVBoxLayout() # Ajout des widgets dans le layout vbox.addWidget(label) vbox.addWidget(button1) vbox.addWidget(button2) # Appliquer le layout à la fenêtre window.setLayout(vbox) # Afficher la fenêtre window.show() sys.exit(app.exec_()) |
4. Explications du Code
- Création de la fenêtre principale : window = QWidget() crée une fenêtre simple.
- Création des widgets : QLabel pour afficher du texte et QPushButton pour des boutons.
- Création et ajout de QVBoxLayout : vbox = QVBoxLayout() crée un layout vertical. Ensuite, on ajoute les widgets avec vbox.addWidget(widget).
- Application du layout : window.setLayout(vbox) applique le layout à la fenêtre principale.
5. Configuration des Espaces (Espacements et Marges)
Vous pouvez ajuster les espaces entre les widgets et les marges du layout.
|
1 2 3 4 5 |
# Ajuster l'espacement entre les widgets vbox.setSpacing(15) # Ajuster les marges (gauche, haut, droite, bas) vbox.setContentsMargins(10, 20, 10, 10) |
6. Utilisation de Stretch pour l’Alignement des Widgets
Vous pouvez utiliser addStretch() pour contrôler l’alignement des widgets.
|
1 2 3 4 |
vbox.addWidget(label) vbox.addStretch() # Ajoute un espace extensible vbox.addWidget(button1) vbox.addWidget(button2) |
Ici, label est placé en haut, button1 et button2 en bas, avec un espace extensible entre eux.
7. Exemple Avancé : Layout Imbriqué
Vous pouvez également imbriquer des layouts. Par exemple, en utilisant QVBoxLayout et QHBoxLayout ensemble.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
from PyQt5.QtWidgets import QApplication, QWidget, QVBoxLayout, QHBoxLayout, QPushButton import sys app = QApplication(sys.argv) # Création de la fenêtre principale window = QWidget() window.setWindowTitle("Exemple de layout imbriqué avec PyQt5") window.setGeometry(100, 100, 300, 200) # Création du layout vertical principal vbox = QVBoxLayout() # Création des boutons pour le layout vertical button1 = QPushButton("Bouton 1") button2 = QPushButton("Bouton 2") # Ajout des boutons au layout vertical vbox.addWidget(button1) vbox.addWidget(button2) # Création d'un layout horizontal hbox = QHBoxLayout() hbox.addWidget(QPushButton("Bouton 3")) hbox.addWidget(QPushButton("Bouton 4")) # Ajouter le layout horizontal dans le layout vertical vbox.addLayout(hbox) # Appliquer le layout à la fenêtre window.setLayout(vbox) # Afficher la fenêtre window.show() sys.exit(app.exec_()) |
8. Exercice Pratique : Ajouter des Widgets Dynamiquement
Vous pouvez ajouter des widgets au QVBoxLayout de manière dynamique.
|
1 2 3 4 5 6 7 8 9 |
button_add = QPushButton("Ajouter un Bouton") def add_button(): new_button = QPushButton(f"Bouton {vbox.count() + 1}") vbox.addWidget(new_button) button_add.clicked.connect(add_button) vbox.addWidget(button_add) Ici, chaque clic sur button_add ajoute un nouveau bouton au layout vertical. |
9. Exemple complet orienté objet
Voici un exemple complet orienté objet utilisant QVBoxLayout dans une classe. Cet exemple montre comment organiser plusieurs widgets dans une interface graphique PyQt5 en utilisant une structure orientée objet.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
from PyQt5.QtWidgets import QApplication, QWidget, QLabel, QPushButton, QVBoxLayout import sys class MainWindow(QWidget): def __init__(self): super().__init__() # Configuration de la fenêtre principale self.setWindowTitle("Exemple de QVBoxLayout avec PyQt5") self.setGeometry(100, 100, 300, 200) # Initialisation de l'interface utilisateur self.init_ui() def init_ui(self): # Création des widgets self.label = QLabel("Bienvenue dans PyQt5!", self) self.button1 = QPushButton("Bouton 1", self) self.button2 = QPushButton("Bouton 2", self) self.button3 = QPushButton("Ajouter un nouveau bouton", self) # Connexion du bouton pour ajouter dynamiquement des widgets self.button3.clicked.connect(self.add_new_button) # Création et configuration du layout vertical self.vbox = QVBoxLayout() self.vbox.addWidget(self.label) self.vbox.addWidget(self.button1) self.vbox.addWidget(self.button2) self.vbox.addWidget(self.button3) # Appliquer le layout à la fenêtre self.setLayout(self.vbox) def add_new_button(self): # Méthode pour ajouter un nouveau bouton de façon dynamique new_button = QPushButton(f"Bouton {self.vbox.count() + 1}", self) self.vbox.addWidget(new_button) # Configuration de l'application app = QApplication(sys.argv) # Création de la fenêtre principale window = MainWindow() window.show() # Exécution de la boucle principale de l'application sys.exit(app.exec_()) |
Younes Derfoufi
CRMEF OUJDA
1 thought on “Utilisation de QVBoxLayout PyQt5”