Comment utiliser Pyqt GUI Builder

PYQT est une bibliothèque Python populaire utilisée pour implémenter plus facilement les applications graphiques dans Python. Cette bibliothèque est livrée avec un outil de constructeur GUI (interface utilisateur graphique) appelé Concepteur QT. L'interface graphique peut être construite rapidement en Python en utilisant la fonction de glisser-déposer de cette bibliothèque, bien que cet outil n'ait pas de facilité 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 de concepteur QT 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 designer QT

Exécutez la commande suivante pour modifier l'emplacement du répertoire actuel en 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é installé correctement, la fenêtre suivante apparaîtra. 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 La fenêtre est utilisée 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éez le premier formulaire à l'aide du designer QT

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

Ensuite, nous concevons un formulaire de connexion en utilisant le Étiquette, modification du texte et bouton-poussoir widgets. La boîte de dialogue sera enregistrée avec le nom de connexion.ui, qui sera utilisé plus tard dans le script python. Le Qobject Le nom sera modifié en LogIndialogique en utilisant le Fenêtre d'éditeur de propriété de cette application.

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 Le fichier peut être utilisé dans le script Python. Les deux façons d'utiliser la boîte de dialogue de Concepteur QT sont indiqués dans la section suivante du tutoriel.

Exécutez directement le fichier de concepteur QT

Le module UIC de la bibliothèque PYQT est utilisé pour charger le fichier créé par le concepteur QT, et le loadui () La méthode du module UIC est utilisée pour charger le fichier d'interface utilisateur. Le script suivant montre comment charger le Concepteur QT dossier nommé Connexion.ui 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 sys
# Importer qtwidgets et modules UIC
de Pyqt5 Import qtwidgets, UIC
# Créer un objet App
app = qtwidgets.Qapplication (sys.argv)
# Formulaire et affichage de chargement de la GUI
fenêtre = UIC.loadui ("Connexion.ui ")
fenêtre.montrer()
# Démarrez la boucle d'événement de l'application ou de la boîte de dialogue
appliquer.exec ()

La boîte de dialogue suivante apparaîtra après avoir exécuté le script ci-dessus.

Exécutez le fichier d'interface utilisateur en convertissant en fichier python

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

$ connexion pyuic5.ui -o connexion.py

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

# - * - CODING: UTF-8 - *-
# Implémentation du formulaire généré à partir de la connexion du fichier d'interface utilisateur.ui '
#
# Créé par: Générateur de code PYQT5 UI 5.12.3
#
# AVERTISSEMENT! Toutes les modifications apportées dans ce fichier seront perdues!
De Pyqt5 Import Qtcore, qtgui, qtwidgets
classe UI_Logindialog (objet):
def setupui (self, logindialog):
LogIndialogique.setObjectName ("LogIndialog")
LogIndialogique.redimensionner (400, 224)
soi.textedit = qtwidgets.Qtextedit (Logindialog)
soi.textaine.setGeometry (qtcore.Qrect (130, 70, 221, 31))
soi.textaine.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))
FONT = QTGUI.Qfont ()
Police de caractère.SetPointSize (18)
soi.étiqueter.Setfont (Font)
soi.étiqueter.setObjectName ("label")
soi.label_2 = qtwidgets.QLabel (Logindialog)
soi.label_2.setGeometry (qtcore.Qrect (36, 70, 81, 20))
soi.label_2.setObjectName ("Label_2")
soi.label_3 = qtwidgets.QLabel (Logindialog)
soi.label_3.setGeometry (qtcore.Qrect (40, 120, 67, 17)))
soi.label_3.setObjectName ("Label_3")
soi.btnlogin = qtwidgets.Qpushbutton (logindialog)
soi.btnlogin.setGeometry (qtcore.Qrect (150, 170, 89, 25))
soi.btnlogin.setObjectName ("btnlogin")
soi.btncancel = qtwidgets.Qpushbutton (logindialog)
soi.btncancel.setGeometry (qtcore.Qrect (250, 170, 89, 25))
soi.btncancel.setObjectName ("btncancel")
soi.retranslateui (logindialog)
Qtcore.QmetaObject.ConnectSlotByName (LogIndialog)
Def retranslateui (self, logindialog):
_Translate = qtcore.QCOREAPLICATION.traduire
LogIndialogique.setWindowTitle (_Translate ("LogIndialog", "Dialog"))
soi.étiqueter.setText (_Translate ("LogIndialog", "Form de connexion"))
soi.label_2.setText (_Translate ("LogIndialog", "nom d'utilisateur"))
soi.label_3.setText (_Translate ("LogIndialog", "Mot de passe"))
soi.btnlogin.setText (_Translate ("LogIndialog", "Login"))
soi.btncancel.setText (_Translate ("LogIndialog", "Annuler"))

Les éléments suivants affichent le Connexion boîte de dialogue en important le Formulaire de connexion.py fichier créé à l'aide du pyuic5 commande. 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 de connexion est attaché avec le Loginclicked () Méthode pour vérifier si le nom d'utilisateur et le mot de passe prélevés de l'utilisateur sont valides. Le Annuler le bouton est attaché au CancelClicked () Méthode pour quitter à partir de l'application. Le exec () La méthode est appelée pour démarrer la boucle d'événement de l'application.

# Importer Qtwidgets
à partir de Pyqt5 Import Qtwidgets
# Importer sys
importer sys
# Importer le formulaire de connexion UI
Importer la connexion
# Définir une classe pour configurer l'interface utilisateur
classe MyApp (qtwidgets.Qmainwindow, connexion.Ui_logindialog):
def __init __ (self, parent = aucun):
Super (myapp, self).__init __ (parent)
# Chargez le formulaire de connexion
soi.setupui (soi)
# Appelez la méthode LoginClicked ()
soi.btnlogin.cliqué.se connecter (soi.Loginclicked)
# Call CancelClicked () Méthode
soi.btncancel.cliqué.se connecter (soi.Annuleclicked)
# 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 vous-même.textaine.toplaintext () == 'admin' et soi.textedit_2.toplainText () == 'SuperUser':
print («utilisateur authentifié»)
autre:
print («utilisateur non authentifié»)
# Déclarer la méthode pour terminer le script lorsque le bouton d'annulation cliquera
def annuleclicked (self):
sortie()
# Créer un objet App
app = qtwidgets.Qapplication (sys.argv)
# Créer un objet de classe
form = myApp ()
# Afficher le formulaire
former.montrer()
# Démarrez la boucle d'événement de l'application ou de la boîte de dialogue
appliquer.exec ()

La boîte de dialogue suivante apparaîtra après avoir exécuté le script ci-dessus.

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

Si l'utilisateur entre le nom d'utilisateur et le mot de passe correct dans le bon Connexion formulaire, alors 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, alors la boîte de dialogue disparaîtra.

Conclusion

Ce tutoriel vous a montré comment installer Concepteur QT et comment concevoir un formulaire simple en utilisant cette application. Le tutoriel vous a également montré comment charger la boîte de dialogue UI directement et après l'avoir converti en le script Python s'est montré dans l'autre partie de ce tutoriel. J'espère que cet article vous a aidé à mieux comprendre l'utilisation de QT Designer pour la construction et l'utilisation de l'interface graphique dans les applications.