Comment utiliser le générateur d'interface graphique PyQt

PyQt est une bibliothèque Python populaire utilisée pour implémenter plus facilement des applications graphiques en Python. Cette bibliothèque est livrée avec un outil de création GUI (Graphical User Interface) appelé Concepteur Qt. L'interface graphique peut être construite rapidement en Python à l'aide de la fonction glisser-déposer de cette bibliothèque, bien que cet outil n'ait pas de fonction de débogage comme l'IDE standard. Ce tutoriel vous montre comment implémenter l'interface graphique à l'aide de la classe Qt Designer de PyQt.

Conditions préalables

Vous devez installer l'outil Qt Designer avant de pratiquer les exemples fournis dans ce tutoriel. Exécutez les commandes suivantes pour installer le Concepteur Qt sur votre système :

$ sudo apt-get install qttools5-dev-tools
$ sudo apt-get install qttools5-dev

Ouvrez le concepteur Qt

Exécutez la commande suivante pour remplacer l'emplacement actuel du répertoire par le Concepteur Qt dossier.

$ cd /usr/lib/x86_64-linux-gnu/qt5/bin/

Exécutez la commande suivante pour ouvrir l'application Qt Designer.

$ ./designer

Si la Concepteur Qt a été correctement installé, la fenêtre suivante apparaît. le Widget La boîte affichée sur le côté gauche de la fenêtre principale contient divers widgets que vous pouvez utiliser pour concevoir l'interface utilisateur de l'application. le Nouvelle forme window est utilisé pour créer une nouvelle fenêtre en utilisant les boutons par défaut. Les fenêtres affichées sur le côté droit de la fenêtre principale fournissent des informations sur les widgets qui peuvent être lus ou modifiés.

Créer le premier formulaire à l'aide du concepteur Qt

Pour commencer à concevoir l'interface de l'application Python, nous allons cliquer sur le Créer dans la fenêtre suivante pour ouvrir la boîte de dialogue avec deux boutons par défaut.

Ensuite, nous allons concevoir un formulaire de connexion en utilisant le Widgets Label, Text Edit et Push Button. La boîte de dialogue sera enregistrée sous le nom Connexion.ui, qui sera utilisé plus tard dans le script Python. le QObjet le nom sera changé en boîte de dialogue de connexion en utilisant le Fenêtre de l'éditeur de propriétés de cette candidature.

Utilisation de la boîte de dialogue de connexion

Le fichier d'interface utilisateur créé par le Concepteur Qt peut être utilisé dans le script Python de deux manières. Le fichier peut être utilisé directement dans le script Python, ou le fichier Python converti du Concepteur Qt fichier peut être utilisé dans le script Python. Les deux façons d'utiliser la boîte de dialogue de Concepteur Qt sont présentés dans la section suivante du didacticiel.

Exécuter le fichier Qt Designer directement

Le module UIC de la bibliothèque PyQt est utilisé pour charger le fichier créé par le Qt Designer, et le loadUI() méthode du module UIC est utilisée pour charger le fichier UI. Le script suivant montre comment charger le Concepteur Qt fichier nommé Connexion.interface utilisateur que nous avons créé avant. Les modules nécessaires sont importés au début du script. L'objet de l'application est créé à l'aide du QApplication(), et le Concepteur Qt le fichier est chargé à l'aide du loadUI() méthode. Ensuite, le exec() la méthode est appelée pour démarrer la boucle d'événement de l'application.

# Importer le module sys
importer le système
# Importer des QtWidgets et des modules uic
de PyQt5 importer QtWidgets, uic
# Créer un objet d'application
application = QtWidgets.QApplication(sys.argv)
# Charger le formulaire et l'affichage de l'interface graphique
fenêtre = uic.loadUi("Connexion.ui")
la fenêtre.spectacle()
# Démarrez la boucle d'événements de l'application ou de la boîte de dialogue
application.exec()

La boîte de dialogue suivante apparaîtra après l'exécution du script ci-dessus.

Exécuter le fichier UI en le convertissant en fichier Python

Le fichier UI créé par Qt Designer peut être converti en un fichier Python à l'aide du pyuic5 commander. Exécutez la commande suivante pour convertir le Connexion.interface utilisateur fichier dans le Formulaire de connexion.py déposer. le Connexion.interface utilisateur fichier doit être stocké à l'emplacement actuel pour exécuter la commande suivante ; sinon, une erreur sera générée.

$ pyuic5 Connexion.ui -o formulaire de connexion.py

Le code suivant sera généré dans le Formulaire de connexion.py fichier après avoir exécuté la commande ci-dessus.

# -*- codage : utf-8 -*-
# Implémentation du formulaire généré à partir de la lecture du fichier ui 'Connexion.ui'
#
# Créé par : PyQt5 UI générateur de code 5.12.3
#
# ATTENTION! Toutes les modifications apportées dans ce fichier seront perdues!
à partir de PyQt5 importer QtCore, QtGui, QtWidgets
classe Ui_Logindialog(objet):
def setupUi(self, Logindialog):
boîte de dialogue de connexion.setObjectName("Logindialog")
boîte de dialogue de connexion.redimensionner (400, 224)
soi.textEdit = QtWidgets.QTextEdit(Logindialog)
soi.texteModifier.setGeometry(QtCore.QRect(130, 70, 221, 31))
soi.texteModifier.setObjectName("textEdit")
soi.textEdit_2 = QtWidgets.QTextEdit(Logindialog)
soi.textEdit_2.setGeometry(QtCore.QRect(130, 120, 221, 31))
soi.textEdit_2.setObjectName("textEdit_2")
soi.étiquette = QtWidgets.QLabel(Logindialog)
soi.étiqueter.setGeometry(QtCore.QRect(140, 20, 131, 31))
police = QtGui.QFont()
Police de caractère.setPointSize(18)
soi.étiqueter.setFont(police)
soi.étiqueter.setObjectName("étiquette")
soi.label_2 = QtWidgets.QLabel(Logindialog)
soi.étiquette_2.setGeometry(QtCore.QRect(36, 70, 81, 20))
soi.étiquette_2.setObjectName("label_2")
soi.label_3 = QtWidgets.QLabel(Logindialog)
soi.étiquette_3.setGeometry(QtCore.QRect (40, 120, 67, 17))
soi.étiquette_3.setObjectName("label_3")
soi.btnLogin = QtWidgets.QPushButton(Logindialog)
soi.btnConnexion.setGeometry(QtCore.QRect(150, 170, 89, 25))
soi.btnConnexion.setObjectName("btnLogin")
soi.btnAnnuler = QtWidgets.QPushButton(Logindialog)
soi.btnAnnuler.setGeometry(QtCore.QRect(250, 170, 89, 25))
soi.btnAnnuler.setObjectName("btnCancel")
soi.retranslateUi(Logindialog)
QtCore.QMetaObject.connectSlotsByName(Logindialog)
def retranslateUi(self, Logindialog):
_translate = QtCore.Application QCore.Traduire
boîte de dialogue de connexion.setWindowTitle(_translate("Logindialog", "Dialog"))
soi.étiqueter.setText(_translate("Logindialog", "Formulaire de connexion"))
soi.étiquette_2.setText(_translate("Logindialog", "Nom d'utilisateur"))
soi.étiquette_3.setText(_translate("Logindialog", "Mot de passe"))
soi.btnConnexion.setText(_translate("Logindialog", "Login"))
soi.btnAnnuler.setText(_translate("Logindialog", "Annuler"))

Ce qui suit affichera le Connexion boîte de dialogue en important le Formulaire de connexion.py fichier créé à l'aide du pyuic5 commander. L'objet de l'application est créé en utilisant QApplication(), et la boîte de dialogue de connexion est chargée à l'aide du setupUi() méthode. Le bouton Connexion est attaché avec le loginClicked() méthode pour vérifier si le nom d'utilisateur et le mot de passe pris de l'utilisateur sont valides. le Annuler le bouton est attaché au annulerClic() méthode pour quitter l'application. le exec() la méthode est appelée pour démarrer la boucle d'événement de l'application.

# Importer des QtWidgets
à partir de PyQt5 importer des QtWidgets
# Importer le système
importer le système
# Importer l'interface utilisateur du formulaire de connexion
importer le formulaire de connexion
# Définir une classe pour configurer l'interface utilisateur
classe MonApp (QtWidgets.QMainWindow, loginForm.Ui_Logindialog):
def __init__(self, parent=None):
super(MyApp, soi).__init__(parent)
# Charger le formulaire de connexion
soi.setupUi(auto)
# Appeler la méthode loginClicked()
soi.btnConnexion.cliqué.se connecter (se.connexionClic)
# Appeler la méthode cancelClicked()
soi.btnAnnuler.cliqué.se connecter (se.annulerClic)
# Déclarer la méthode pour vérifier le nom d'utilisateur et le mot de passe lorsque le bouton de connexion cliquera
def loginClicked(self):
si soi.texteModifier.toPlainText() == 'admin' et soi.textEdit_2.toPlainText() == 'superutilisateur' :
print('Utilisateur authentifié')
autre:
print('Utilisateur non authentifié')
# Declare méthode pour terminer le script lorsque le bouton Annuler cliquera
def cancelClicked(self):
sortir()
# Créer un objet d'application
application = QtWidgets.QApplication(sys.argv)
# Créer un objet de classe
formulaire = MonApp()
# Afficher le formulaire
forme.spectacle()
# Démarrez la boucle d'événements de l'application ou de la boîte de dialogue
application.exec()

La boîte de dialogue suivante apparaîtra après l'exécution du script ci-dessus.

Si l'utilisateur entre un nom d'utilisateur ou un mot de passe incorrect dans le Connexion formulaire, la sortie suivante apparaîtra après avoir cliqué sur le Connexion bouton.

Si l'utilisateur saisit le nom d'utilisateur et le mot de passe corrects dans le Connexion formulaire, la sortie suivante apparaîtra après avoir cliqué sur le Connexion bouton.

Si l'utilisateur clique sur le Annuler bouton dans le Connexion formulaire, la boîte de dialogue disparaîtra.

Conclusion

Ce tutoriel vous a montré comment installer Concepteur Qt et comment concevoir un formulaire simple à l'aide de cette application. Le didacticiel vous a également montré comment charger la boîte de dialogue de l'interface utilisateur directement et après l'avoir convertie en script Python, nous l'avons montré dans l'autre partie de ce didacticiel. Espérons que cet article vous a aidé à mieux comprendre l'utilisation de Qt Designer pour créer et utiliser l'interface graphique dans les applications.