PyQt5保姆级教程-- 从入门到精通
主要内容:
1 | Qt Designer |
---|---|
2 | PyQt5基本窗口控件(QMainWindow、Qwidget、Qlabel、QLineEdit、菜单、工具栏等) |
3 | PyQt5高级组件(QTableView、QListView、容器、线程等) |
4 | PyQt5布局管理(QBoxLayout、QGirdLayout、QFormLayout、嵌套布局等) |
5 | PyQt5信号与槽(事件处理、数据传递等) |
6 | PyQt5图形与特效(定制窗口风格、绘图、QSS与UI美化、不规则窗口、设置样式等) |
7 | PyQt5扩展应用(制作PyQt5安装程序、数据处理、第三方绘图库在PyQt5中的应用、UI自动化测试等) |
搭建PyQt5开发环境
工具:
Python
PyQt5模块
PyCharm
在PyCharm里面安装PyQt5
pip install PyQt5 -i https://pypi.douban.com/simple
在PyCharm里面安装Qt的工具包
pip install PyQt5-tools -i https://pypi.douban.com/simple
在安装tools时,报如下错误:
1.pip install PyQt5-tools安装失败
WARNING: Ignoring invalid distribution -yqt5 (e:\venvs\pyqt5_demo1\lib\site-packages)
Installing collected packages: pyqt5, click, qt5-tools, pyqt5-plugins, pyqt5-tools
ERROR: Could not install packages due to an OSError: [WinError 5] 拒绝访问。: 'e:\\venvs\\pyqt5_demo1\\Lib\\site-packages\\PyQt5\\QtCore.pyd'
Check the permissions.
解决办法:
第一步:
将pip install ...
加入--user
为pip install --user ...
即可
pip install PyQt5-tools -i https://pypi.douban.com/simple --user
换个思路
重启电脑,继续输入第一条命令安装
原因分析,可能占用了进程。
2.配置Qt Designer
Working directory:$FileDir$
3.配置PyUIC
Program:python的安装目录下的python.exe文件
Arguments:-m PyQt5.uic.pyuic $FileName$ -o $FileNameWithoutExtension$.py
4.配置Pyrcc
Program:python的安装目录下的Scripts文件夹的pyrcc5.exe文件
Arguments:$FileName$ -o $FileNameWithoutExtension$_rc.py
展示效果如下:
5.ui转py的过程:
1.点击EXternal Tools里面的QTDesigner,会跳转到QT界面,
拖动组件,调整好界面,保存为first文件,它会默认生成first.ui文件
选中文件,鼠标右击,打开扩展,选择PyUIC,它会生成.py文件
将.ui文件转化为.py文件的命令行方法:
python -m PyQt5.uic.pyuic demo.ui -o demo.py
6.开发第一个基于PyQt5的桌面应用
必须使用两个类: QApplication和QWidget。都在PyQt5.QtWidgets。
第一个类表示应用程序,第二个类表示窗口
输入如下代码:
# 开发第一个基于PyQt5的桌面应用
import sys
from PyQt5.QtWidgets import QApplication,QWidget
if __name__ == '__main__':
# 创建QApplication类的实例
app = QApplication(sys.argv)
# 创建一个窗口
w = QWidget()
# 设置窗口尺寸 宽度300,高度150
w.resize(400,200)
# 移动窗口
w.move(300,300)
# 设置窗口的标题
w.setWindowTitle('第一个基于PyQt5的桌面应用')
# 显示窗口
w.show()
# 进入程序的主循环,并通过exit函数确保主循环安全结束(该释放资源的一定要释放)
sys.exit(app.exec_())
效果如下:
也可以在命令行运行
python 文件名.py
7.基本操作
左侧是可以选择的组件,右侧可以设定属性值,设置完成之后,可以在窗体选择预览,选择查看c++和python代码。
8.在QtDesigner中使用水平布局(Vertical Layout)
两种方式:
(1)先移组件,再布局。
放置五个按钮,让这五个按钮等宽的,水平的排列
(全部选中–>鼠标右键–>布局–>水平布局 预览)
预览:
(2)先布局,再移组件。
生成demo1.ui文件
转成demo2.py文件,转成py文件,才能在程序里面调。
生成的代码如下:
# -*- coding: utf-8 -*-
# Form implementation generated from reading ui file 'demo1.ui'
#
# Created by: PyQt5 UI code generator 5.15.4
#
# WARNING: Any manual changes made to this file will be lost when pyuic5 is
# run again. Do not edit this file unless you know what you are doing.
from PyQt5 import QtCore, QtGui, QtWidgets
class Ui_MainWindow(object):
def setupUi(self, MainWindow):
MainWindow.setObjectName("MainWindow")
MainWindow.resize(800, 600)
self.centralwidget = QtWidgets.QWidget(MainWindow)
self.centralwidget.setObjectName("centralwidget")
self.widget = QtWidgets.QWidget(self.centralwidget)
self.widget.setGeometry(QtCore.QRect(70, 50, 651, 51))
self.widget.setObjectName("widget")
self.horizontalLayout = QtWidgets.QHBoxLayout(self.widget)
self.horizontalLayout.setContentsMargins(0, 0, 0, 0)
self.horizontalLayout.setObjectName("horizontalLayout")
self.pushButton = QtWidgets.QPushButton(self.widget)
self.pushButton.setObjectName("pushButton")
self.horizontalLayout.addWidget(self.pushButton)
self.pushButton_2 = QtWidgets.QPushButton(self.widget)
self.pushButton_2.setObjectName("pushButton_2")
self.horizontalLayout.addWidget(self.pushButton_2)
self.pushButton_3 = QtWidgets.QPushButton(self.widget)
self.pushButton_3.setObjectName("pushButton_3")
self.horizontalLayout.addWidget(self.pushButton_3)
self.pushButton_4 = QtWidgets.QPushButton(self.widget)
self.pushButton_4.setObjectName("pushButton_4")
self.horizontalLayout.addWidget(self.pushButton_4)
self.widget1 = QtWidgets.QWidget(self.centralwidget)
self.widget1.setGeometry(QtCore.QRect(110, 160, 578, 194))
self.widget1.setObjectName("widget1")
self.horizontalLayout_2 = QtWidgets.QHBoxLayout(self.widget1)
self.horizontalLayout_2.setContentsMargins(0, 0, 0, 0)
self.horizontalLayout_2.setObjectName("horizontalLayout_2")
self.listView = QtWidgets.QListView(self.widget1)
self.listView.setObjectName("listView")
self.horizontalLayout_2.addWidget(self.listView)
self.pushButton_5 = QtWidgets.QPushButton(self.widget1)
self.pushButton_5.setObjectName("pushButton_5")
self.horizontalLayout_2.addWidget(self.pushButton_5)
self.checkBox = QtWidgets.QCheckBox(self.widget1)
self.checkBox.setObjectName("checkBox")
self.horizontalLayout_2.addWidget(self.checkBox)
self.radioButton = QtWidgets.QRadioButton(self.widget1)
self.radioButton.setObjectName("radioButton")
self.horizontalLayout_2.addWidget(self.radioButton)
MainWindow.setCentralWidget(self.centralwidget)
self.menubar = QtWidgets.QMenuBar(MainWindow)
self.menubar.setGeometry(QtCore.QRect(0, 0, 800, 26))
self.menubar.setObjectName("menubar")
MainWindow.setMenuBar(self.menubar)
self.statusbar = QtWidgets.QStatusBar(MainWindow)
self.statusbar.setObjectName("statusbar")
MainWindow.setStatusBar(self.statusbar)
self.retranslateUi(MainWindow)
QtCore.QMetaObject.connectSlotsByName(MainWindow)
def retranslateUi(self, MainWindow):
_translate = QtCore.QCoreApplication.translate
MainWindow.setWindowTitle(_translate("MainWindow", "MainWindow"))
self.pushButton.setText(_translate("MainWindow", "Button1"))
self.pushButton_2.setText(_translate("MainWindow", "Button2"))
self.pushButton_3.setText(_translate("MainWindow", "Button3"))
self.pushButton_4.setText(_translate("MainWindow", "Button4"))
self.pushButton_5.setText(_translate("MainWindow", "PushButton"))
self.checkBox.setText(_translate("MainWindow", "CheckBox"))
self.radioButton.setText(_translate("MainWindow", "RadioButton"))
如何在程序里面调用,先新建一个Run_demo1.py文件
代码如下:
import sys
import demo1
from PyQt5.QtWidgets import QApplication,QMainWindow
if __name__ == '__main__':
# 只有直接运行这个脚本,才会往下执行
# 别的脚本文件执行,不会调用这个条件句
# 实例化,传参
app = QApplication(sys.argv)
# 创建对象
mainWindow = QMainWindow()
# 创建ui,引用demo1文件中的Ui_MainWindow类
ui = demo1.Ui_MainWindow()
# 调用Ui_MainWindow类的setupUi,创建初始组件
ui.setupUi(mainWindow)
# 创建窗口
mainWindow.show()
# 进入程序的主循环,并通过exit函数确保主循环安全结束(该释放资源的一定要释放)
sys.exit(app.exec_())
运行:
弹出如下窗口:
此时出现了一个小问题:
如何解决: (将此目录生成源代码目录)
设置完成之后,等待加载完成,导入文件名底下的红线消失
9.在QtDesigner中使用垂直布局(Horizontal Layout)
和水平布局的操作类似,也有两种布局方式:
(1) 先移动组件,再布局
(2) 先布局,再移动组件
点击保存,生成垂直布局文件demo2.ui
右键demo2.ui,生成demo2.py文件
demo2.py的代码如下:
# -*- coding: utf-8 -*-
# Form implementation generated from reading ui file 'demo2.ui'
#
# Created by: PyQt5 UI code generator 5.15.4
#
# WARNING: Any manual changes made to this file will be lost when pyuic5 is
# run again. Do not edit this file unless you know what you are doing.
from PyQt5 import QtCore, QtGui, QtWidgets
class Ui_MainWindow(object):
def setupUi(self, MainWindow):
MainWindow.setObjectName("MainWindow")
MainWindow.resize(800, 600)
self.centralwidget = QtWidgets.QWidget(MainWindow)
self.centralwidget.setObjectName("centralwidget")
self.verticalLayoutWidget = QtWidgets.QWidget(self.centralwidget)
self.verticalLayoutWidget.setGeometry(QtCore.QRect(180, 150, 441, 371))
self.verticalLayoutWidget.setObjectName("verticalLayoutWidget")
self.verticalLayout_2 = QtWidgets.QVBoxLayout(self.verticalLayoutWidget)
self.verticalLayout_2.setContentsMargins(0, 0, 0, 0)
self.verticalLayout_2.setObjectName("verticalLayout_2")
self.label = QtWidgets.QLabel(self.verticalLayoutWidget)
self.label.setObjectName("label")
self.verticalLayout_2.addWidget(self.label)
self.pushButton_6 = QtWidgets.QPushButton(self.verticalLayoutWidget)
self.pushButton_6.setObjectName("pushButton_6")
self.verticalLayout_2.addWidget(self.pushButton_6)
self.pushButton_5 = QtWidgets.QPushButton(self.verticalLayoutWidget)
self.pushButton_5.setObjectName("pushButton_5")
self.verticalLayout_2.addWidget(self.pushButton_5)
self.pushButton_4 = QtWidgets.QPushButton(self.verticalLayoutWidget)
self.pushButton_4.setObjectName("pushButton_4")
self.verticalLayout_2.addWidget(self.pushButton_4)
self.checkBox = QtWidgets.QCheckBox(self.verticalLayoutWidget)
self.checkBox.setObjectName("checkBox")
self.verticalLayout_2.addWidget(self.checkBox)
self.widget = QtWidgets.QWidget(self.centralwidget)
self.widget.setGeometry(QtCore.QRect(40, 40, 95, 121))
self.widget.setObjectName("widget")
self.verticalLayout = QtWidgets.QVBoxLayout(self.widget)
self.verticalLayout.setContentsMargins(0, 0, 0, 0)
self.verticalLayout.setObjectName("verticalLayout")
self.pushButton = QtWidgets.QPushButton(self.widget)
self.pushButton.setObjectName("pushButton")
self.verticalLayout.addWidget(self.pushButton)
self.pushButton_2 = QtWidgets.QPushButton(self.widget)
self.pushButton_2.setObjectName("pushButton_2")
self.verticalLayout.addWidget(self.pushButton_2)
self.pushButton_3 = QtWidgets.QPushButton(self.widget)
self.pushButton_3.setObjectName("pushButton_3")
self.verticalLayout.addWidget(self.pushButton_3)
MainWindow.setCentralWidget(self.centralwidget)
self.menubar = QtWidgets.QMenuBar(MainWindow)
self.menubar.setGeometry(QtCore.QRect(0, 0, 800, 26))
self.menubar.setObjectName("menubar")
MainWindow.setMenuBar(self.menubar)
self.statusbar = QtWidgets.QStatusBar(MainWindow)
self.statusbar.setObjectName("statusbar")
MainWindow.setStatusBar(self.statusbar)
self.retranslateUi(MainWindow)
QtCore.QMetaObject.connectSlotsByName(MainWindow)
def retranslateUi(self, MainWindow):
_translate = QtCore.QCoreApplication.translate
MainWindow.setWindowTitle(_translate("MainWindow", "MainWindow"))
self.label.setText(_translate("MainWindow", "TextLabel"))
self.pushButton_6.setText(_translate("MainWindow", "PushButton"))
self.pushButton_5.setText(_translate("MainWindow", "PushButton"))
self.pushButton_4.setText(_translate("MainWindow", "PushButton"))
self.checkBox.setText(_translate("MainWindow", "CheckBox"))
self.pushButton.setText(_translate("MainWindow", "PushButton"))
self.pushButton_2.setText(_translate("MainWindow", "PushButton"))
self.pushButton_3.setText(_translate("MainWindow", "PushButton"))
在python程序里面调用,新建Run_demo2.py文件
代码如下:
import sys
import demo2
from PyQt5.QtWidgets import QApplication,QMainWindow
if __name__ == '__main__':
# 只有直接运行这个脚本,才会往下执行
# 别的脚本文件执行,不会调用这个条件句
# 实例化,传参
app = QApplication(sys.argv)
# 创建对象
mainWindow = QMainWindow()
# 创建ui,引用demo1文件中的Ui_MainWindow类
ui = demo2.Ui_MainWindow()
# 调用Ui_MainWindow类的setupUi,创建初始组件
ui.setupUi(mainWindow)
# 创建窗口
mainWindow.show()
# 进入程序的主循环,并通过exit函数确保主循环安全结束(该释放资源的一定要释放)
sys.exit(app.exec_())
运行程序:
10.在QtDesigner里面同时创建垂直布局和水平布局
新建一个 main window,点击 创建
在布局的时候,windows里面,可以通过ctrl+上下左右进行微调。
文件保存,命名为demo3.ui文件,同样用拓展工具,生成demo3.py文件。
同样,新建运行文件Run_demo3.py文件,代码如下:
import sys
import demo3
from PyQt5.QtWidgets import QApplication,QMainWindow
if __name__ == '__main__':
# 只有直接运行这个脚本,才会往下执行
# 别的脚本文件执行,不会调用这个条件句
# 实例化,传参
app = QApplication(sys.argv)
# 创建对象
mainWindow = QMainWindow()
# 创建ui,引用demo1文件中的Ui_MainWindow类
ui = demo3.Ui_MainWindow()
# 调用Ui_MainWindow类的setupUi,创建初始组件
ui.setupUi(mainWindow)
# 创建窗口
mainWindow.show()
# 进入程序的主循环,并通过exit函数确保主循环安全结束(该释放资源的一定要释放)
sys.exit(app.exec_())
运行代码,结果如下:
11.在QtDesigner中同时使用栅格布局(Grid Layout)
拖放四个按钮之后,选中栅格布局
选中之后,效果如下:
拖拽边角,可以放大:
练习:利用栅格布局实现计算器数字区域
拖动button键调整好位置,全选之后选中布局,再选栅格布局
点击栅格之后,效果如下:
保存,生成demo4.ui文件
同样进行上述操作,转成demo4.py文件,新建Run_demo4.py文件,代码如下:
import sys
import demo4
from PyQt5.QtWidgets import QApplication,QMainWindow
if __name__ == '__main__':
# 只有直接运行这个脚本,才会往下执行
# 别的脚本文件执行,不会调用这个条件句
# 实例化,传参
app = QApplication(sys.argv)
# 创建对象
mainWindow = QMainWindow()
# 创建ui,引用demo1文件中的Ui_MainWindow类
ui = demo4.Ui_MainWindow()
# 调用Ui_MainWindow类的setupUi,创建初始组件
ui.setupUi(mainWindow)
# 创建窗口
mainWindow.show()
# 进入程序的主循环,并通过exit函数确保主循环安全结束(该释放资源的一定要释放)
sys.exit(app.exec_())
效果如下:
栅格布局的注意点:摆放控件要尽可能的整齐,这样系统才会正确的识别。
栅格布局和水平布局,垂直布局一样,可以后期添加控件。
12.向栅格布局中拖动控件
13.在QtDesigner中使用表单布局(Form Layout)
新建一个 main window,点击 创建
选择需要的控件,进行如下操作:
调整好布局,保存文件为demo5.ui
利用pyUIC插件,生成python代码调试
创建Run_demo5.py文件,执行代码如下:
import sys
import demo5
from PyQt5.QtWidgets import QApplication,QMainWindow
if __name__ == '__main__':
# 只有直接运行这个脚本,才会往下执行
# 别的脚本文件执行,不会调用这个条件句
# 实例化,传参
app = QApplication(sys.argv)
# 创建对象
mainWindow = QMainWindow()
# 创建ui,引用demo1文件中的Ui_MainWindow类
ui = demo5.Ui_MainWindow()
# 调用Ui_MainWindow类的setupUi,创建初始组件
ui.setupUi(mainWindow)
# 创建窗口
mainWindow.show()
# 进入程序的主循环,并通过exit函数确保主循环安全结束(该释放资源的一定要释放)
sys.exit(app.exec_())
效果如下:
14.在容器中完成布局
跟上面一样,新建一个MainWindow,添加对应的组件,鼠标右键点击,变形为对应的容器。
同理,生成demo6.py文件,新建Run_demo6文档,添加代码
import sys
import demo6
from PyQt5.QtWidgets import QApplication,QMainWindow
if __name__ == '__main__':
# 只有直接运行这个脚本,才会往下执行
# 别的脚本文件执行,不会调用这个条件句
# 实例化,传参
app = QApplication(sys.argv)
# 创建对象
mainWindow = QMainWindow()
# 创建ui,引用demo1文件中的Ui_MainWindow类
ui = demo6.Ui_MainWindow()
# 调用Ui_MainWindow类的setupUi,创建初始组件
ui.setupUi(mainWindow)
# 创建窗口
mainWindow.show()
# 进入程序的主循环,并通过exit函数确保主循环安全结束(该释放资源的一定要释放)
sys.exit(app.exec_())
运行程序
15.在QtDesigner中使用绝对布局
跟上面一样,新建一个MainWindow,添加对应的组件,
同理,生成demo7.py文件,新建Run_demo7文档,添加代码(代码如上,略作修改),PyCharm里运行如下:
15.在QtDesigner中使用分割线与间隔
跟上面一样,新建一个MainWindow,
新建4个按钮,设置水平间隔,新建3个按钮,设置垂直间隔
在A2和A3之间设立分割线,在B2和B3之间设立分割线
保存文件为demo8.ui ,转为demo8.py代码,新建Run_demo8.py,添加代码(代码如上,略作修改),PyCharm里运行如下:
16.布局的最大尺寸和最小尺寸
默认状态下,它的尺寸可以自由调节,跟上面一样,新建一个MainWindow,
可以看到,原本这个bushButton控件最小宽高可以到0,最大宽高可以到1677215
通过改变右侧栏的值,就可以设置它不小于多少,不大于多少。
16.尺寸策略(sizePolicy)
对于大多数控件来说,sizeHint(期望尺寸)是只可读的,也就是说,你布局的时候不管拖拽多大,最后输出的还是默认值
读取pushButton的期望尺寸:
self.pushButton.sizeHint().width()
self.pushButton.sizeHint().height()
即可以看到,一个pushButton的期望尺寸,宽是41,高度是28
在demo7里进行上面操作,还是得到一样的数值。
同理,也可以进行读取其他控件的操作,比如读取textBrowser的宽高,代码如下:
self.c.sizeHint().width()
self.textBrowser.sizeHint().height()
效果如下:
即可以看到:控件textBrowser的默认宽高分别为256和192。
同样,也可以看最小的期望尺寸,以pushButton为例,其代码如下:
self.pushButton.minimumSizeHint().width()
self.pushButton.minimumSizeHint().height()
还是以demo7.py测试
可以看到,对于大部分控件来说,它的期望尺寸和最小期望尺寸是一样的
为何使用尺寸策略:
就是因为拓展的组件无论如何拖拽大小,经过布局设置之后,会回到默认的大小,为了让布局更有个性,采用尺寸策略,可以改变组件的期望尺寸。如图:
练习,左侧放树,构造分栏效果
保存文档为demo9.ui,转为demo9.py代码,新建Run_demo9.py,添加代码(代码如上,略作修改),PyCharm里运行如下:
17.在QtDesigner里面设置控件之间的伙伴关系
即控件关联之后,可以通过一个控件来控制另外一个控件
新建一个MainWindow,布局如下,保存为demo10.ui
接着:
如上图所示,水平布局后面的“H”为热键 ,Ctrl +1 为快捷键
垂直布局后面的“V”为热键 ,Ctrl +2 为快捷键
热键:只有在这个菜单显示时,按“H”时,才会起作用。菜单关闭时,按“H”不起作用。“V”同理。
然后给demo10.ui文件的lable添加热键:
给姓名添加热键成:姓名(&A):
给年龄添加热键成:年龄(&B):
给邮箱添加热键成:邮箱(&C):
然后打开编辑伙伴,按住鼠标左键,选中lable指向Line Edit
然后选择编辑窗口部件,会切回到正常的部件
保存文件为demo10.ui ,转为demo10.py代码,新建Run_demo10.py,添加代码(代码如上,略作修改),PyCharm里运行如下:
再添加三个lable试一下效果,删除掉原来的demo10.py文件,用新保存的demo10.ui去生成新的demo10.py文件,点击运行查看效果
果然,按住alt+a,alt+b,alt+c,alt+d,alt+e.alt+f分别在右边对应的的Line Edit里面有焦点光标。
拓展:
18.如何修改控件的Tab顺序
新建一个MainWindow,布局如下,在Edit里面,选中 编辑 Tab顺序,在控件前端就会出现序号,这个序号就是顺序
也可以选中从这里开始或者重新开始,依次点击形成顺序。
接下来选中统一的 Line Edit来演示
保存文档为demo11.ui,转为demo11.py代码,新建Run_demo11.py,添加代码(代码如上,略作修改),PyCharm里运行如下:
按Tab 键,焦点光标就会按照指定的顺序在Line Edit内跳转
19.在QtDesigner中完成信号与槽的设置
信号(signal)与槽(slot)是Qt的核心机制,由于PyQt忠实的继承了Qt的所有特性,所有信号与槽也是PyQt的核心机制。
信号:是由对象或控件发射出去的消息。可以理解为按钮的单击事件。
当单击按钮时,按钮就会向外部发送单击的消息,这些发送出去的信号需要一些代码来拦截,这些代码就是槽
槽本质上是一个函数或者方法,信号可以理解为事件,槽可以理解为事件函数
信号与槽的设置:就是需要将信号和槽绑定
一个信号可以和多个槽绑定,一个槽可以拦截多个信号。
信号和槽绑定有两种方式,一种是用QtDesigner进行绑定,一种是在代码中进行绑定
(1)用QtDesigner进行信号和槽绑定
需求:单机按钮,关闭窗口
新建一个MainWindow,拖拽一个pashButton按钮,修改文本为“关闭窗口”
在Edit里选择编辑信号/槽,点击pashButton按钮向外拖拽,
在Edit里选择编辑信号/槽,点击pashButton按钮向外拖拽,松开鼠标,左栏选择clicked(),勾选左下角“显示从QWidget”继承信号和槽,右栏选择close(),然后点击右下角ok.
在Edit里面选择“编辑窗口部件”,对布局页面进行恢复。
在“窗体”里选择“预览于”,选择“Windows风格”
此时点击页面的“关闭窗口”,则页面就会关闭
练习
添加两个CheckBox进行如下操作:
给第一个CheckBox进行信号与槽的绑定
给第二个CheckBox进行信号与槽的绑定
在Edit里面选择"编辑窗口部件"进行恢复主窗口
恢复完成后,窗口如下:
预览效果如下:
取消勾选check box的选项,下面的line Edit视角效果也会相应的变换。
保存文档为demo12.ui,转为demo12.py代码,新建Run_demo12.py,添加代码(代码如上,略作修改),PyCharm里运行如下:
拓展:
(2)用代码完成关闭主窗口
见第23节
20 在QtDesigner中为窗口添加菜单和工具栏
一个窗口,应该拥有菜单栏,工具栏,状态栏
新建一个MainWindow,添加菜单栏,添加完成之后,也可以右键点击,选择移除,同理添加工具栏。
给菜单栏添加内容:
在”窗体“里选择预览,效果如下:
在菜单和工具条里面如何添加按钮?
不管是菜单还是工具条的按钮,是一个action的动作,添加步骤如下:
在"视图"里,选择动作编辑器
两个菜单自动生成两个动作,双击可用设置动作
点击"ok"之后,主窗口变化如下:
保存文档为demo13.ui,转为demo13.py代码,新建Run_demo13.py,添加代码(代码如上,略作修改),PyCharm里运行如下:
21 创建主窗口
主窗口类型,有三种窗口
窗口类型 | 说明 |
---|---|
QMainWindow | 可以包含菜单栏、工具栏、状态栏和标题栏,是最常见的窗口形式 |
QDialog | 是对话窗口的基类。没有菜单栏、工具栏、状态栏 |
QWidget | 不确定窗口的用途,就使用QWidget |
如下图所示,新建一个controls文件夹,在controls里面新建images文件夹用来装图片,在controls里面新建
FirstMainWin.py文件。
在FirstMainWin.py文件中,添加代码如下:
# 第一个主窗口
# 把所有和UI有关的代码都放在一个类里面,创建窗口只要创建类的实例就可以了
import sys
# 从PyQt里面创建窗口和应用
from PyQt5.QtWidgets import QMainWindow,QApplication
# 用来添加图标
from PyQt5.QtGui import QIcon
# 定义一个类,这个类从QMainWindow里面继承
class FristMainWin(QMainWindow):
# 初始化
def __init__(self,parent=None):
super(FristMainWin,self).__init__(parent)
# 设置主窗口的标题
self.setWindowTitle('第一个主窗口应用')
# 设置窗口的尺寸
self.resize(400,300)
# 获得状态栏
self.status = self.statusBar()
# 在状态栏上,设置消息的状态时间5000ms
self.status.showMessage('只存在5秒的消息',5000)
# 防止别的脚本调用,只有自己单独运行,才会调用下面代码
if __name__ == '__main__':
# 创建app实例,并传入参数
app = QApplication(sys.argv)
# 设置图标
app.setWindowIcon(QIcon('images/horse.jpg'))
# 创建对象
main = FristMainWin()
# 创建窗口
main.show()
# 进入程序的主循环,并通过exit函数确保主循环安全结束(该释放资源的一定要释放)
sys.exit(app.exec_())
运行代码,效果如下:
五秒之后,页面效果如下:
22.让主窗口居中显示
计算窗口的左上角的坐标
移动左上角的坐标,带动整个窗口的移动。
左上角的横坐标就是窗口的左边距,左上角的纵坐标就是窗口的上边距到顶部的值
新建CenterForm.py文件,执行代码:
# 让主窗口居中显示
# 通过QDesktopWidget类相应的API可以得到整个屏幕的尺寸
# 通过move方法移动窗口
import sys
# 从PyQt里面创建窗口和应用
from PyQt5.QtWidgets import QDesktopWidget,QMainWindow,QApplication
# 用来添加图标
from PyQt5.QtGui import QIcon
# 定义一个类,这个类从QMainWindow里面继承
class CenterForm(QMainWindow):
# 初始化
def __init__(self,parent=None):
super(CenterForm,self).__init__(parent)
# 设置主窗口的标题
self.setWindowTitle('让窗口居中')
# 设置窗口的尺寸
self.resize(400,300)
# 添加center方法,作用就是让窗口居中
def center(self):
# 创建实例,获得屏幕对象,得到屏幕的坐标系
screen = QDesktopWidget().screenGeometry()
# 得到窗口的坐标系
size = self.geometry()
# 获取屏幕的宽度、高度
# 窗口左边缘的坐标等于(屏幕的宽度-窗口的宽度)/2
newLeft = (screen.width()-size.width()) / 2
# 屏幕上边缘的坐标等于(屏幕的高度-窗口的高度) / 2
newTop = (screen.height() - size.height()) / 2
# 移动窗口
self.move(newLeft,newTop)
# 获得状态栏
# self.status = self.statusBar()
#
# # 在状态栏上,设置消息的状态时间5000ms
# self.status.showMessage('只存在5秒的消息',5000)
# 防止别的脚本调用,只有自己单独运行,才会调用下面代码
if __name__ == '__main__':
# 创建app实例,并传入参数
app = QApplication(sys.argv)
# 设置图标
# app.setWindowIcon(QIcon('images/001.jpg'))
# 创建对象
main =CenterForm()
# 创建窗口
main.show()
# 进入程序的主循环,并通过exit函数确保主循环安全结束(该释放资源的一定要释放)
sys.exit(app.exec_())
效果展示:
23.如何退出应用程序
可以通过关闭主窗口,由于整个程序只有一个窗口,关闭主窗口之后,应用程序就会退出,之前在第19节演示过
换个思路,通过代码,在窗口上添加一个pashButton,调用QApplication里面的click()方法,来实现退出应用程序,关闭所有窗口
在controls文件夹里,新建QuitApplication.py文件,添加下列代码
# 退出应用程序
# 用到了水平布局,引入QHBoxLayout
# 需要一个控件,引入了QWidget
# 需要butoon,引入了QPushButton
import sys
from PyQt5.QtWidgets import QHBoxLayout,QMainWindow,QApplication,QPushButton,QWidget
# 用来添加图标
from PyQt5.QtGui import QIcon
class QuitApplication(QMainWindow):
# 初始化
def __init__(self):
super(QuitApplication,self).__init__()
# 设计窗口的尺寸
self.resize(300,120)
# 设置主窗口的标题
self.setWindowTitle('退出应用程序')
# 添加Button
# 创建全局对象self.button1
self.button1 = QPushButton('退出应用程序')
# 发送单击信号,执行对应的方法 (将信息与槽关联)
self.button1.clicked.connect(self.onClick_Button)
# 创建水平布局
layout = QHBoxLayout()
# 将组件加到水平局部里面
layout.addWidget(self.button1)
# 放置一个主框架
mainFrame = QWidget()
# 在主框架内添加水平布局
mainFrame.setLayout(layout)
# 把主框架放在窗口上
self.setCentralWidget(mainFrame)
# 按钮的单击事件的方法(自定义的槽)
def onClick_Button(self):
sender = self.sender()
print(sender.text() + '按钮被按下')
# 得到实例
app = QApplication.instance()
# 退出应用程序
app.quit()
# 防止别的脚本调用,只有自己单独运行,才会调用下面代码
if __name__ == '__main__':
# 创建app实例,并传入参数
app = QApplication(sys.argv)
# 设置图标
app.setWindowIcon(QIcon('images/001.jpg'))
# 创建对象
main = QuitApplication()
# 创建窗口
main.show()
# 进入程序的主循环,并通过exit函数确保主循环安全结束(该释放资源的一定要释放)
sys.exit(app.exec_())
运行代码,效果如下:
点击“退出应用程序”
24.屏幕坐标系
在controls文件夹里,新建ScreenGeometry.py文件,添加下列代码
# 屏幕坐标系
# 它是以屏幕左上角为原点,划分的坐标系
# 下面演示用面向过程的方式进行演示 (面向对象的方式需要创建类,创建方法)
import sys
from PyQt5.QtWidgets import QHBoxLayout,QMainWindow,QApplication,QPushButton,QWidget
# 创建实例
app = QApplication(sys.argv)
# 创建窗口
widget = QWidget()
# 在窗口里放button
btn = QPushButton(widget)
# 在button里面更改文本
btn.setText("按钮")
# 添加点击事件,让鼠标点击button后,打印出“onclick”
def onClick_Button():
print("第一种方式获取各个值")
# 窗口离屏幕原点到y轴的距离
print("widget.x() = %d" % widget.x()) # 600 (以屏幕为原点的窗口横坐标)
# 窗口离屏幕原点到x轴的距离
print("widget.y() = %d" % widget.y()) # 200 (以屏幕为原点的窗口纵坐标,不包含标题栏)
# 窗口本身的宽度
print("widget.width()=%d" % widget.width()) # 300 (窗口宽度)
# 窗口本身的高度
print("widget.height()= %d" % widget.height()) # 240 (工作区高度)
print("第二种方式获取各个值")
# 窗口离屏幕原点到y轴的距离
print("widget.geometry().x() = %d" % widget.geometry().x()) # 601 (以屏幕为原点的窗口横坐标)
# 窗口离屏幕原点到x轴的距离
print("widget.geometry().y() = %d" % widget.geometry().y()) # 238 (以屏幕为原点的窗口纵坐标,包含标题栏)
# 窗口本身的宽度
print("widget.geometry().width()=%d" % widget.geometry().width()) # 300 (窗口宽度)
# 窗口本身的高度
print("widget.geometry().height()= %d" % widget.geometry().height()) # 240 (工作区高度)
print("第三种方式获取各个值")
# 窗口离屏幕原点到y轴的距离
print("widget.frameGeometry().x() = %d" % widget.frameGeometry().x()) # 600 (以屏幕为原点的窗口横坐标)
# 窗口离屏幕原点到x轴的距离
print("widget.frameGeometry().y() = %d" % widget.frameGeometry().y()) # 200 (以屏幕为原点的窗口纵坐标,不包含标题栏)
# 窗口本身的宽度
print("widget.frameGeometry().width()=%d" % widget.frameGeometry().width()) # 302 (窗口宽度)
# 窗口本身的高度
print("widget.frameGeometry().height()= %d" % widget.frameGeometry().height()) # 279 (窗口高度,包含标题栏)
# 将点击事件与槽绑定
btn.clicked.connect(onClick_Button)
# 移动button到窗口内的相应位置
btn.move(24,52)
# 设置窗口的尺寸
widget.resize(300,240) # 设置工作区的尺寸
# 移动窗口到屏幕的相应位置
widget.move(600,200)
# 设置窗口的标题
widget.setWindowTitle('屏幕坐标系')
# 创建窗口
widget.show()
# 进入程序的主循环,并通过exit函数确保主循环安全结束(该释放资源的一定要释放)
# 如果不添加下行代码,运行程序会闪退
sys.exit(app.exec_())
运行代码,效果如下:
点击窗口里面的“按钮”,效果如下:
分析代码:
有些许误差是因为在windows下窗体有边框,在mac下窗体无边框。
25.设置窗口和应用程序图标
在controls文件夹里,新建IconForm.py文件,执行代码:
# 设置窗口和应用程序图标
# 窗口的setWindowIcon方法设置窗口的图标,只在Windows和linux中可用,mac不可用
import sys
# 从PyQt里面创建窗口和应用
from PyQt5.QtWidgets import QMainWindow,QApplication
# 用来添加图标
from PyQt5.QtGui import QIcon
# 定义一个类,这个类从QMainWindow里面继承
class IconForm(QMainWindow):
# 初始化
def __init__(self,parent=None):
super(IconForm,self).__init__(parent)
self.initUI()
# 规范代码,初始化直接写在一个方法里
def initUI(self):
# 设置坐标系,可用同时设置窗口的尺寸和位置
self.setGeometry(400,400,250,450)
# 设置主窗口的标题
self.setWindowTitle('设置窗口图标')
# 设置窗口图标
self.setWindowIcon(QIcon('./images/001.jpg'))
# self.setWindowIcon(QIcon('/images/3.ico')) 这行代码失效,原因:图片路径表示问题
# # 设置窗口的尺寸
# self.resize(400,300)
# 获得状态栏
# self.status = self.statusBar()
#
# # 在状态栏上,设置消息的状态时间5000ms
# self.status.showMessage('只存在5秒的消息',5000)
# 防止别的脚本调用,只有自己单独运行,才会调用下面代码
if __name__ == '__main__':
# 创建app实例,并传入参数
app = QApplication(sys.argv)
# QApplication中的setWindowIcon方法用于设置主窗口的图标和应用程序图标,但调用了窗口的setWinodowIcon方法
# QApplication中的setWindowIcon方法就只能用于设置应用程序图标了
# 设置图标
# app.setWin