python3+PyQt5+Qt Designer实现界面可视化


Posted in Python onJune 10, 2021

前言

       以前制作一个Python窗体界面,我都是用GUI窗口视窗设计的模块Tkinter一点一点敲出来的,今天朋友问我有没有Python窗体的设计工具,“用鼠标拖拖”就能完成窗体设计,我查了查相关资料,果然有一款好用的工具——Qt Designer

 1.安装Qt Designer

        这里需要安装两个东西:PyQt5PyQt5-tools

安装PyQt5:打开CMD或者PowerShell,在命令窗中输入

pip install PyQt5

执行结果如下:

python3+PyQt5+Qt Designer实现界面可视化

 安装PyQt5-tools:打开CMD或者PowerShell,在命令窗中输入

pip install PyQt5-tools

执行结果如下:

python3+PyQt5+Qt Designer实现界面可视化

 2.配置开发工具

        安装完Qt Designer后,我们利用PyCharm进行界面开发,下面进行Qt开发工具的配置。

在PyCharm中依次打开:File→Settings 弹出Settings对话框,如下图

python3+PyQt5+Qt Designer实现界面可视化

 然后按下图的4个步骤,打开Create Tools对话窗:

python3+PyQt5+Qt Designer实现界面可视化

这里需要配置两个

(1)配置QTDesigner,用来打开QT可视化开发工具

 如下图,分别在NameProgramWorking dirctory填入如下信息:

Name:QTDesigner

Program:D:\ProgramSoftware\Anaconda3\Lib\site-packages\pyqt5_tools\Qt\bin\designer.exe
                  注意:该路径为你Python安装路径下Lib\site-packages\pyqt5_tools文件夹里

Working dirctory:$FileDir$

python3+PyQt5+Qt Designer实现界面可视化

(2)配置PyUIC,用来将Qt Designer开发工具生成的.ui文件转换为.py文件

 如下图,分别在Name、Program、Arguments、Working dirctory填入如下信息:

Name:PyUIC

Program:D:\ProgramSoftware\Anaconda3\Scripts\pyuic5.exe
                  注意:该路径为你Python安装路径下Scripts文件夹里

Arguments:$FileName$ -o $FileNameWithoutExtension$.py

Working dirctory:$FileDir$

python3+PyQt5+Qt Designer实现界面可视化

至此,安装和配置过程全部结束,下面介绍简单的使用教程。

 3.使用Qt Designer设计界面  

在PyCharm中创建一个项目,然后点击“Tools”--“External Tools”--“QTDesinger”打开QT Desinger,如下图:

python3+PyQt5+Qt Designer实现界面可视化

 在New Form对话框里选择Widget模板,然后点击创建:

python3+PyQt5+Qt Designer实现界面可视化

 然后就会出现Qt Designer主界面,向Form中分别拖入一个“Push Button”和一个“Text Edit”,如下图:

python3+PyQt5+Qt Designer实现界面可视化

 指定点击事件及其响应函数

工具栏点击 这个图标 python3+PyQt5+Qt Designer实现界面可视化 ,然后光标移动到“PushButton”按钮上,鼠标左键 点击 “PushButton”按钮 不要松开,拖动光标 到 按钮旁边的任一位置后 再松开鼠标左键

python3+PyQt5+Qt Designer实现界面可视化

随后就出现了如下界面,在对话框左侧选中clicked()”,右侧点击“Edit

python3+PyQt5+Qt Designer实现界面可视化

 然后点击绿色“+”按钮,指定click事件的响应函数,名称随意,比如我这里命名为“pushButton_click()”
(我们这里只是指定事件与响应函数的关联关系,函数是还没实现的,后边我们自行实现)

python3+PyQt5+Qt Designer实现界面可视化

python3+PyQt5+Qt Designer实现界面可视化

最后,将设计的界面保存。

4.使用PyUIC将文件转成python代码

       关闭QT Designer回到PyCharm,查看项目,可以看到只有刚才保存的PyQT_Form.ui文件而且该文件在PyCharm是打不开的,我们需要将这个文件转成.py代码才能使用。

python3+PyQt5+Qt Designer实现界面可视化

选中“PyQT_Form”,在其上点击鼠标右键,到“External Tools”中点击“PyUIC

python3+PyQt5+Qt Designer实现界面可视化

之后再看项目文件,就可以看到多了一个“PyQT_Form.py”,双击查看其内容如下:

python3+PyQt5+Qt Designer实现界面可视化

 5.编写逻辑代码

       界面与业务逻辑分离实现:这一步主要实现业务逻辑,也就是点击登录和退出按钮后程序要执行的操作。为了后续维护方便,采用界面与业务逻辑相分离来实现。也就是通过创建主程序调用界面文件方式实现。这有2个好处:1.就是实现逻辑清晰2.后续如果界面或者逻辑需要变更,好维护新建一个.py文件程序,在里边创建一个子类(MyPyQT_Form)继承PyQT_Form.py中的Ui_Form。具体代码如下

import sys
from PyQt5 import QtWidgets
from PyQT_Form import Ui_Form
 
class MyPyQT_Form(QtWidgets.QWidget,Ui_Form):
    def __init__(self):
        super(MyPyQT_Form,self).__init__()
        self.setupUi(self)
 
    #实现pushButton_click()函数,textEdit是我们放上去的文本框的id
    def pushButton_click(self):
        self.textEdit.setText("你点击了按钮")
 
 
if __name__ == '__main__':
    app = QtWidgets.QApplication(sys.argv)
    my_pyqt_form = MyPyQT_Form()
    my_pyqt_form.show()
    sys.exit(app.exec_())

6.运行

      至此,我们终于完成了第一个Python界面的设计,好累 ( ̄o ̄) . z Z ,运行效果如下:

python3+PyQt5+Qt Designer实现界面可视化

python3+PyQt5+Qt Designer实现界面可视化

参考资料:

https://www.cnblogs.com/lsdb/p/9121903.html
https://www.cnblogs.com/lsdb/p/9122425.html
https://www.3water.com/article/167015.htm

到此这篇关于python3+PyQt5+Qt Designer实现界面可视化的文章就介绍到这了,更多相关python3 界面可视化内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Python 相关文章推荐
Python getopt模块处理命令行选项实例
May 13 Python
python多线程之事件Event的使用详解
Apr 27 Python
解决已经安装requests,却依然提示No module named requests问题
May 18 Python
解决pandas 作图无法显示中文的问题
May 24 Python
在PyCharm导航区中打开多个Project的关闭方法
Jan 17 Python
对Python3 pyc 文件的使用详解
Feb 16 Python
详解Python基础random模块随机数的生成
Mar 23 Python
python之信息加密题目详解
Jun 26 Python
python 使用plt画图,去除图片四周的白边方法
Jul 09 Python
python爬虫开发之urllib模块详细使用方法与实例全解
Mar 09 Python
浅谈python3打包与拆包在函数的应用详解
May 02 Python
PyQt QMainWindow的使用示例
Mar 24 Python
Django使用echarts进行可视化展示的实践
教你如何使用Python Tkinter库制作记事本
Jun 10 #Python
Python中常见的反爬机制及其破解方法总结
Jun 10 #Python
Pytorch可视化的几种实现方法
OpenCV-Python实现怀旧滤镜与连环画滤镜
OpenCV-Python实现轮廓的特征值
Jun 09 #Python
再也不用花钱买漫画!Python爬取某漫画的脚本及源码
Jun 09 #Python
You might like
fleaphp crud操作之findByField函数的使用方法
2011/04/23 PHP
php中使用Ajax时出现Error(c00ce56e)的详细解决方案
2014/11/03 PHP
Ubuntu12下编译安装PHP5.3开发环境
2015/03/27 PHP
PHP中curl_setopt函数用法实例分析
2015/04/16 PHP
php删除数组中重复元素的方法
2015/12/22 PHP
PHP实现登陆并抓取微信列表中最新一组微信消息的方法
2017/07/10 PHP
PHP实现的数组和XML文件相互转换功能示例
2018/03/15 PHP
Yii2结合Workerman的websocket示例详解
2018/09/10 PHP
PHP+redis实现的购物车单例类示例
2019/02/02 PHP
php的RSA加密解密算法原理与用法分析
2020/01/23 PHP
javascript简易缓动插件(源码打包)
2012/02/16 Javascript
jquery自定义类似$.ajax()的方法实现代码
2013/08/13 Javascript
js获取ajax返回值代码
2014/04/30 Javascript
javascript学习笔记(八)正则表达式
2014/10/08 Javascript
node.js中的fs.linkSync方法使用说明
2014/12/15 Javascript
jQuery实现鼠标经过提示信息的地图热点效果
2015/04/26 Javascript
jQuery弹层插件jquery.fancybox.js用法实例
2016/01/22 Javascript
jquery拖拽排序简单实现方法(效果增强版)
2016/02/16 Javascript
用JavaScript获取页面文档内容的实现代码
2016/06/10 Javascript
简单实现的JQuery文本框水印插件
2016/06/14 Javascript
javascript基础练习之翻转字符串与回文
2017/02/20 Javascript
js手机号4位显示空格,银行卡每4位显示空格效果
2017/03/23 Javascript
js实现1,2,3,5数字按照概率生成
2017/09/12 Javascript
微信小程序实现组件顶端固定或底端固定效果(不随滚动而滚动)
2020/04/09 Javascript
vue中提示$index is not defined错误的解决方式
2020/09/02 Javascript
js实现右键弹出自定义菜单
2020/09/08 Javascript
Python django框架输入汉字,数字,字符生成二维码实现详解
2019/09/24 Python
python实现udp聊天窗口
2020/03/31 Python
Python命令行参数定义及需要注意的地方
2020/11/30 Python
高级护理实习生自荐信
2013/09/28 职场文书
升职自荐信范文
2013/10/05 职场文书
毕业生对母校寄语
2015/02/26 职场文书
贷款工作证明模板
2015/06/12 职场文书
python如何做代码性能分析
2021/04/26 Python
goland 清除所有的默认设置操作
2021/04/28 Golang
MYSQL优化之数据表碎片整理详解
2022/04/03 MySQL