[PyQt⼊门教程]QtDesigner⼯具的使⽤
Qt Designer是PyQt程序UI界⾯的实现⼯具，使⽤Qt Designer可以拖拽、点击完成GUI界⾯设计，并且设计完成的.ui程序可以转换成.py⽂件供python程序调⽤。本⽂主要通过⽤户登录需求描述Qt Designer⼯具开发界⾯的使⽤⽅法。
本⽂主要内容
数据库培训的目的和要求1、Qt Designer程序主界⾯窗⼝介绍。
2、Qt Designer程序实现界⾯开发的案例。包括使⽤Qt Designer实现程序Gui开发、使⽤pyuic5将.ui转换.py程序、信号与槽的配置以及实现、使⽤pyinstaller转换成可执⾏程序的完成过程。
环境&⼯具版本
Win10+pyhton3.7.4 + PyQt 5.11.2
Qt Designer⼯具主界⾯
打开路径：${python安装⽬录}/Lib/site-packages/pyqt5_。主界⾯如下：
主界⾯不同区域介绍：
⼯具箱区域：提供GUI界⾯开发使⽤的各种基本控件，如单选框、⽂本框等。可以拖动到新创建的主程序界⾯。
主界⾯区域：⽤户放置各种从⼯具箱拖过来的各种控件。模板选项中最常⽤的就是Widget（通⽤窗⼝）和MainWindow（主窗⼝）。⼆者区别主要是Widget窗⼝不包含菜单栏、⼯具栏等。可以分别创建对⽐看看。
对象查看器区域：查看主窗⼝放置的对象列表。
属性编辑器区域：提供对窗⼝、控件、布局的属性编辑功能。⽐如修改控件的显⽰⽂本、对象名、⼤⼩等。
信号/槽编辑器区域：编辑控件的信号和槽函数，也可以添加⾃定义的信号和槽函数。
Qt Designer基本控件介绍
Widget Box控件⼯具箱是按照控件作⽤类别进⾏划分的。这⾥作为实现⼊门级界⾯实现，主要介绍最常使⽤的控件及控件对象相关函数。函数⽅法知道怎么获取控件输⼊内容以及如何将后台操作结果输出到界⾯控件显⽰的主要函数就可以了。
（1）显⽰控件。
Lable：⽂本标签，显⽰⽂本，可以⽤来标记控件。
Text Browser：显⽰⽂本控件。⽤于后台命令执⾏结果显⽰。
（2）输⼊控件，提供与⽤户输⼊交互
Line Edit：单⾏⽂本框，输⼊单⾏字符串。控件对象常⽤函数为Text() 返回⽂本框内容，⽤于获取输⼊。setText() ⽤于设置⽂本框显⽰。
Text Edit：多⾏⽂本框，输⼊多⾏字符串。控件对象常⽤函数同Line Edit控件。
Combo Box：下拉框列表。⽤于输⼊指定枚举值。
（3）控件按钮，供⽤户选择与执⾏
Push Button：命令按钮。常见的确认、取消、关闭等按钮就是这个控件。clicked信号⼀定要记住。clicked信号就是指⿏标左键按下然后释放时会发送信号，从⽽触发相应操作。
Radio Button：单选框按钮。
Check Box：多选框按钮。
Qt Designer⼯具实现
了解基本控件及作⽤和获取输⼊/显⽰⽅法后，就可以开始动⼿实现⼩需求了。。⽐如登录界⾯。获取⽤户名和密码并显⽰。。
打开Qt Designer，开始拖拽控件实现吧。。
Step1：打开主界⾯，选择Widget模板
Step2：从Widget Box⼯具箱中拖拽2个label、2个line Edit、2个Push Button以及1个Text Browser。拖完后如下：
Step3：双击各个控件，修改控件名称（对应属性编辑区中的text，可直接双击控件修改）以及对象名称（对应属性编辑区中的objectName）。对象名称⼀定记得修改。默认⽣成的label_1、label_2这种名称⽆法直接判断到底是对应哪个控件。。
点击菜单栏Form - Prview。预览界⾯实现效果
login.ui的程序代码如下：
<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>Form</class>
<widget class="QWidget" name="Form">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>549</width>
<height>199</height>
</rect>
</property>
<property name="windowTitle">
<string>⽤户登录</string>
</property>
<widget class="QLabel" name="user_label">
<property name="geometry">
<rect>
<x>50</x>
<y>40</y>
<width>61</width>
<height>21</height>
</rect>
</property>
<property name="text">
<string>⽤户名</string>
</property>
</widget>
<widget class="QLineEdit" name="user_lineEdit"> <property name="geometry">
<rect>
<x>130</x>
<y>40</y>
<width>113</width>
<height>20</height>
</rect>
</property>
</widget>python入门教程app
汇编语言的基本结构<widget class="QLabel" name="pwd_label">
<property name="geometry">
<rect>
<x>50</x>
<y>80</y>
<width>54</width>
<height>12</height>
</rect>
</property>
<property name="text">
<string>密码</string>
</property>
</widget>
<widget class="QLineEdit" name="pwd_lineEdit"> <property name="geometry">
<rect>
<x>130</x>
<y>70</y>
什么是随机数字表<width>113</width>
<height>20</height>
</rect>
</property>
</widget>
<widget class="QPushButton" name="login_Button">
<property name="geometry">
<rect>
<x>50</x>
<y>110</y>
<width>75</width>
<height>23</height>
</rect>
</property>
<property name="text">
<string>登录</string>
</property>
</widget>
<widget class="QPushButton" name="cancel_Button">
<property name="geometry">
<rect>
<x>160</x>
<y>110</y>
<width>75</width>
<height>23</height>
</rect>
</property>
<property name="text">
<string>退出</string>
</property>
</widget>
<widget class="QTextBrowser" name="user_textBrowser">
<property name="geometry">
<rect>
<x>270</x>
<y>30</y>
<width>221</width>
<height>101</height>
</rect>
</property>
</widget>
</widget>
<resources/>
<connections/>
</ui>
View Code
Step4：点击File -Save保存实现结果。保存⽂件名为login.ui。
基于小程序的管理系统
Step5：界⾯开发完成。
将.ui⽂件转换为.py⽂件
使⽤命令⾏pyuic5 -o login.py login.ui转换成.py⽂件。调⽤格式为pyuic5 -o {输出⽂件名} {输⼊designer设计好的.ui后缀界⾯⽂件}。执⾏结果如下
转换后的.py⽂件内容如下：
# -*- coding: utf-8 -*-
# Form implementation generated from reading ui file 'login.ui'
#
# Created by: PyQt5 UI code generator 5.11.3
#
# WARNING! All changes made in this file will be lost!
from PyQt5 import QtCore, QtGui, QtWidgets
class Ui_Form(object):
def setupUi(self, Form):
Form.setObjectName("Form")
self.user_label = QtWidgets.QLabel(Form)
self.user_label.setGeometry(QtCore.QRect(50, 40, 61, 21))
self.user_label.setObjectName("user_label")
self.user_lineEdit = QtWidgets.QLineEdit(Form)
self.user_lineEdit.setGeometry(QtCore.QRect(130, 40, 113, 20))
self.user_lineEdit.setObjectName("user_lineEdit")
self.pwd_label = QtWidgets.QLabel(Form)
self.pwd_label.setGeometry(QtCore.QRect(50, 80, 54, 12))
self.pwd_label.setObjectName("pwd_label")
self.pwd_lineEdit = QtWidgets.QLineEdit(Form)
self.pwd_lineEdit.setGeometry(QtCore.QRect(130, 70, 113, 20))
self.pwd_lineEdit.setObjectName("pwd_lineEdit")
self.login_Button = QtWidgets.QPushButton(Form)
self.login_Button.setGeometry(QtCore.QRect(50, 110, 75, 23))
self.login_Button.setObjectName("login_Button")
self.cancel_Button = QtWidgets.QPushButton(Form)
self.cancel_Button.setGeometry(QtCore.QRect(160, 110, 75, 23))
self.cancel_Button.setObjectName("cancel_Button")
self.user_textBrowser = QtWidgets.QTextBrowser(Form)
self.user_textBrowser.setGeometry(QtCore.QRect(270, 30, 221, 101))
self.user_textBrowser.setObjectName("user_textBrowser")
tSlotsByName(Form)
def retranslateUi(self, Form):
_translate = anslate
Form.setWindowTitle(_translate("Form", "⽤户登录"))
self.user_label.setText(_translate("Form", "⽤户名"))
self.pwd_label.setText(_translate("Form", "密码"))
self.login_Button.setText(_translate("Form", "登录"))
self.cancel_Button.setText(_translate("Form", "退出"))
View Code
界⾯与业务逻辑分离实现
这⼀步主要实现业务逻辑，也就是点击登录和退出按钮后程序要执⾏的操作。为了后续维护⽅便，采⽤界⾯与业务逻辑相分离来实现。也就是通过创建主程序调⽤界⾯⽂件⽅式实现。这有2个好处。第1就是实现逻辑清晰。第2就是后续如果界⾯或者逻辑需要变更，好维护。新建call_login.py⽂件程序，调⽤login.py⽂件。
# -*- coding: utf-8 -*-
# Form implementation generated from reading ui file 'connect_me.ui'
#
js格式化当前时间# Created by: PyQt5 UI code generator 5.11.3
#
# WARNING! All changes made in this file will be lost!
#导⼊程序运⾏必须模块
import sys

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。