Modèle-Vue-Contrôleur (MVC) et PyQt

1. Introduction

Jusqu’à maintenant, nous nous sommes concentrés sur la découverte du framework PyQt sans nous préoccuper plus avant de considérations relatives à l’architecture générale d’une application. On entend par architecture la manière d’organiser le code pour qu’il soit le plus clair, le plus maintenable et évolutif possible, y compris par une tierce personne. Le présent chapitre est destiné à développer nos premières applications réalistes en PyQt. C’est donc le moment idéal pour introduire le paradigme Modèle-Vue-Contrôleur (MVC), qui constitue justement une bonne pratique en matière d’architecture dans de nombreux langages en général, et en PyQt en particulier.

2. L’esprit du paradigme MVC

Dans ce paradigme d’architecture, on distingue trois grandes parties :

1. Introduction

Entrons dans le vif du sujet et commençons par développer une calculatrice. Voici le bref cahier des charges : on souhaite avoir les quatre opérations élémentaires, les chiffres 0 à 9 ainsi que la touche « 00 », bien pratique. On désire également avoir les parenthèses ouvrantes et fermantes. Enfin, on veut pouvoir manipuler des nombres à virgule. Ainsi nous serons en capacité d’écrire une expression comme :

(5 + 3.5) * 12.25 / 3 

Lorsque l’utilisateur clique sur « = », l’expression est évaluée et affiche le résultat. Bien entendu, dans ce chapitre, on cherche à avoir un respect du paradigme Modèle-Vue-Contrôleur autant que possible.

2. Analyse, architecture et codage

a. Développement de la vue

Ci-dessous, voici l’apparence de l’application calculatrice que nous cherchons à développer. Pour réaliser cet affichage simplement, on met en place un widget QMainWindow qui inclut un simple QWidget qui lui-même contient :

• un widget QLineEdit pour afficher l’expression et pour afficher le résultat de son évaluation ;

• vingt widgets QPushButton.

Apparence de la calculatrice à développer

On crée donc une classe Calculatrice qui correspondra à la vue dans le paradigme MVC. On choisit de la faire hériter de QMainWindow.

On a donc ces premières lignes de code :

class Calculatrice(QMainWindow): 
 
    def __init__(self): 
 
        super().__init__() 
 
        self.setWindowTitle("Calculatrice") 
        self.setFixedSize(235, 235) 
        self.disposition = QVBoxLayout() 
        self._widget = Qwidget(self) 
        self.setCentralWidget(self._widget) 
        self._widget.setLayout(self.disposition) 

Dans ce même initialiseur __init__, on appelle deux méthodes de classes : la première...

1. Introduction

Le but ici est de développer une application Notepad. Le cahier des charges (simplifié) est le suivant :

L’application ressemble à la copie d’écran suivante :

Vue de l’application Notepad

On peut voir également les menus déroulants contenant les diverses actions :

Menu déroulant « Édition » de l’application Notepad

2. Programmation de l’application

Les widgets PyQt sont suffisamment intégrés pour qu’il n’y ait finalement pas grand-chose à faire, si ce n’est justement procéder à une intégration judicieuse.

De manière habituelle, on définit notre point d’entrée, dans lequel on instancie notre interface utilisateur.

if __name__ == '__main__': 
 
    app = Qapplication(sys.argv) 
    app.setApplicationName("Le petit éditeur de texte") 
 
    window = EditeurDeTexte() 
    app.exec_() 

La classe de référence de notre programme s’appelle EditeurDeTexte. Cette dernière hérite de la classe PyQt QMainWindow. On définit alors l’initialiseur __init__. On utilise un contrôle d’agencement vertical QVBoxLayout dans lequel on dispose une barre de statut (QStatusBar).

class EditeurDeTexte(QMainWindow): 
 
    def __init__(self, *args, **kwargs): 
        super(EditeurDeTexte, self).__init__(*args, **kwargs) ...

1. Introduction

Voici ci-dessous l’apparence attendue de l’application, alors que l’utilisateur vient de cliquer sur l’un des boutons de choix de couleur, que ce soit une couleur de police ou une couleur de fond). Ce clic ouvre ainsi le dialogue de choix de couleur suivant :

Application d’édition de texte enrichi

Le cahier des charges de cette application se définit selon les points suivants :

Nous commençons donc par rassembler des icônes pour chacune des actions incluses dans notre barre d’outils.

Dans cet exemple, nous choisissons de nommer les différentes variables et fonctions en anglais.

2. Programmation de l’application

On définit les imports suivants :

import sys 
from PyQt5.QtCore import * 
from PyQt5.QtGui import * 
from PyQt5.QtWidgets import * 

Notre point d’entrée est le suivant : il implique l’instanciation de la classe RichEditor qui hérite de QMainWindow.

if __name__ == "__main__": 
    app = Qapplication(sys.argv) 
    main = RichEditor() 
    main.show() 
    sys.exit(app.exec_()) 

La classe en question constitue le reste du code dans lequel on cherche à utiliser au mieux et au plus les widgets dédiés de PyQt.

On utilise les widgets ou classes PyQt suivantes :