Gestion des styles et apparences en PyQt6

1. Utilisation de QFont

L’objet QFont permet d’encapsuler le nom de la police choisie, sa taille, son style éventuel (gras, italique, etc.), son étirement, la dimension des espaces entre chaque caractère et bien d’autres paramètres encore.

Pour l’utiliser, on commence par déclarer l’import adéquat.

from PyQt6.QtGui import QFont 

On instancie ensuite l’objet de type QFont, par exemple ci-dessous dans lequel on déclare la police de nom Chalkduster, en taille 18 et avec une stylisation en gras. On active également la mise en italique.

maFont = QFont('Chalkduster', 18, QFont.Weight.Bold)  
maFont.setItalic(True) 

Une fois notre police PyQt créée, on peut l’utiliser sur nos différents widgets grâce à la méthode setFont. Ainsi, en reprenant l’exemple précédent, on change la police de différents labels de l’interface.

import sys  
from PyQt6.QtWidgets import (  
   QApplication, QWidget, QPushButton, QCheckBox,  
   QFormLayout, QLabel, QLineEdit, QComboBox  
)  
from PyQt6.QtGui import QFont  
from PyQt6.QtCore import Qt  
  
  # Première police  
maFont = QFont('Chalkduster', 18, QFont.Weight.Bold)  
maFont.setItalic(True)  
  
# Deuxième police  
maFont2 = QFont()  
maFont2.setFamily('Futura')  
maFont2.setPointSize(15)  
maFont2.setCapitalization(QFont.Capitalization.Capitalize)  
maFont2.setWeight(QFont.Weight.Medium)  
maFont2.setUnderline(True)  
  
  
class Fenetre(QWidget):  
   def __init__(self):  
       super().__init__()  
  
       self.setGeometry(100, 100, 250, 100)  
       self.setWindowTitle("Chapitre 3 - formulaire")  
       self.disposition = QFormLayout()  
  
       self.nomLabel = QLabel("Nom : ")  
       self.nom = QLineEdit()  
       self.disposition.addRow(self.nomLabel...

1. Utilisation de QPixmap pour les images

La classe QPixmap permet de manipuler des images, dessiner ou tracer des figures et gérer des couleurs. Elle prend en charge différents formats tels que JPEG, PNG ou encore SVG.

Pour afficher une image dans PyQt6, on peut utiliser QPixmap en combinaison avec un QLabel. Le principe est simple : on charge l’image avec QPixmap en spécifiant son chemin d’accès, puis on l’affiche dans un QLabel avec la méthode setPixmap().

import sys  
from PyQt6.QtWidgets import (  
   QApplication, QWidget, QPushButton, QCheckBox, QFormLayout,  
   QLabel, QLineEdit, QComboBox  
)  
from PyQt6.QtGui import QFont, QPixmap  
  
# Création de la police pour les labels  
maFont = QFont()  
maFont.setFamily('Arial Black')  
maFont.setPointSize(15)  
maFont.setCapitalization(QFont.Capitalization.Capitalize)  
maFont.setWeight(QFont.Weight.Medium)  
  
class Fenetre(QWidget):  
   def __init__(self):  
       super().__init__()  
  
       self.setGeometry(100, 100, 350, 200)  
       self.setWindowTitle("Chapitre 3 - QPixmap")  
       self.disposition = QFormLayout()  
  
       # Ajout du logo  
       self.logoLabel = QLabel("Logo : ")  
       self.logo = QLabel()  
       # Chargement de l'image  
       self.image = QPixmap('Logo_ENI.png')   
       self.logo.setPixmap(self.image)  
       self.disposition.addRow(self.logoLabel, self.logo)  
  
       # Champs du formulaire  
       self.nomLabel = QLabel("Nom : ")  
       self.nom = QLineEdit()  ...

1. Introduction

Dans les exemples précédents, les chemins des icônes étaient définis en chemins relatifs, c’est-à-dire qu’ils étaient exprimés par rapport à l’emplacement du fichier Python sur le disque. Bien que cette approche fonctionne dans des conditions idéales, elle présente plusieurs limitations pratiques. Par exemple, si les fichiers images sont déplacés, ou si le script Python lui-même est déplacé, le programme ne pourra plus localiser les icônes. Cela entraînera une absence d’affichage des ressources, sans qu’une erreur explicite ne soit levée.

Ce manque de robustesse peut poser problème, notamment dans des projets complexes où les fichiers sont souvent déplacés ou réorganisés. Pour résoudre cette fragilité, PyQt6, grâce à l’infrastructure Qt, offre une solution de gestion centralisée des ressources. Cette fonctionnalité permet d’inclure les fichiers nécessaires (images, icônes, sons, fichiers de traduction, etc.) dans un fichier de ressources dédié, évitant ainsi toute dépendance à l’organisation des fichiers sur le disque.

Ce concept de gestion des ressources n’est pas propre à Qt. Il est courant dans d’autres environnements...

1. Introduction

La gestion des couleurs et leur application dans différents contextes est un aspect central de la personnalisation graphique en PyQt6. La classe QPalette permet de regrouper et de gérer ces informations, facilitant l’application de couleurs cohérentes dans toute une interface. Elle offre une manière flexible de définir et d’appliquer des couleurs en fonction de leur contexte d’utilisation (texte, arrière-plan, etc.).

Lorsque vous travaillez avec des couleurs en PyQt6, celles-ci ne se limitent pas à un simple choix de teinte. Chaque couleur peut être utilisée dans un contexte spécifique :

La classe QPalette unifie ces informations, permettant de centraliser et d’organiser les paramètres graphiques liés aux couleurs. Cela simplifie la gestion et garantit une cohérence dans l’ensemble de l’interface utilisateur.

2. Utilisation de QPalette

Dans cet exemple, nous allons créer une palette pour le fond de la fenêtre elle-même, en lui appliquant une couleur bleue claire.

Ces palettes seront ensuite associées à des boutons de notre interface utilisateur, illustrant comment personnaliser l’apparence d’un widget.

Ci-dessous le code de l’exemple autour de QPalette.

import sys  
from PyQt6.QtCore import Qt  
from PyQt6.QtWidgets import QApplication, QWidget, QFormLayout, 
QLabel, QLineEdit, QComboBox, QCheckBox, QPushButton  
from PyQt6.QtGui import QPalette, QColor  
  
class Fenetre(QWidget):  
   def __init__(self):  
       super().__init__()  
  
       # Configuration de la fenêtre  
       self.setGeometry(100, 100, 400, 300)  
     ...

1. Introduction

La classe QBrush est utilisée pour appliquer des motifs, textures ou dégradés comme arrière-plan ou remplissage dans une interface utilisateur. Elle permet de créer des effets visuels plus riches que de simples couleurs unies.

En PyQt6, l’utilisation de QBrush dans une palette (QPalette) suit une approche similaire à celle de l’application de couleurs, mais avec la méthode setBrush(). Cette méthode accepte un pinceau (QBrush) à la place d’une couleur.

Les styles de pinceau (ou Brush Styles) sont spécifiés à l’aide de l’énumération Qt.BrushStyle. Ces styles incluent des motifs comme les lignes en pointillés, des hachures croisées, ou des textures.

2. Utilisation de QBrush

Prenons un exemple simple où nous appliquons un effet d’hachurage croisé rouge comme arrière-plan de la fenêtre grâce au style de pinceau DiagCrossPattern.

Voici le code de l’exemple.

import sys  
from PyQt6.QtCore import Qt  
from PyQt6.QtWidgets import QApplication, QWidget, QFormLayout, 
QLabel, QLineEdit, QPushButton  
from PyQt6.QtGui import QFont, QPalette, QColor, QBrush  
  
class Fenetre(QWidget):  
   def __init__(self):  
       super().__init__()  
  
 ...

1. Introduction

La gestion des styles en PyQt6 permet d’aller bien au-delà des personnalisations offertes par QPalette. Bien que QPalette soit utile pour appliquer des couleurs et des motifs spécifiques à des parties définies de l’interface, il présente certaines limitations :

Ces limites sont surmontées grâce à l’utilisation des Qt Style Sheets (QSS), qui reprennent les concepts des feuilles de style CSS utilisées en développement web. Avec QSS, vous pouvez définir des styles réutilisables et globalement applicables à différents types de widgets, simplifiant ainsi le code tout en augmentant sa maintenabilité.

2. Première utilisation de QSS

L’utilisation de QSS repose sur le principe suivant : chaque widget peut être ciblé par son type ou son identifiant, auquel on associe des propriétés visuelles, tout comme en CSS. Cela permet de personnaliser des éléments comme les couleurs, les polices, les bordures, les marges, etc.

Pour définir le style personnalisé pour la fenêtre et colorer par exemple son arrière-plan en rouge, voici les deux étapes :

Voici un exemple en PyQt6, dans lequel on change grâce à QSS, le style des boutons (teinte verte), la couleur de fond de la fenêtre, ainsi que le style de diverses écritures.

La feuille de style QSS utilisée :

# Feuille de style QSS  
feuille_de_style = """  
QWidget {  
   background-color: lightblue;  /* Fond bleu clair */  
}  
QLabel {  
   color: darkblue;  /* Couleur du texte des labels */  
   font-weight:...