PyQT5速成教程之QtDesigner介绍与⼊门
Qt Designer的介绍
在PyQt中编写UI界⾯可以直接通过代码来实现,也可以通过Qt Designer来完成。Qt Designer的设计符合MVC的架构,其实现了视图和逻辑的分离,从⽽实现了开发的便捷。Qt Designer中的操作⽅式⼗分灵活,其通过拖拽的⽅式放置控件可以随时查看控件效果。Qt Designer⽣成的.ui⽂件(实质上是XML格式的⽂件)也可以通过pyuic5⼯具转换成.py⽂件。
Qt Designer随PyQt5-tools包⼀起安装,其安装路径在 “Python安装路径\Lib\site-packages\pyqt5-tools”下。
若要启动Qt Designer可以直接到上述⽬录下,双击打开Qt Designer;或将上述路径加⼊环境变量,在命令⾏输⼊designer打开;或在PyCharm中将其配置为外部⼯具打开。
下⾯以PyCharm为例,讲述PyCharm中Qt Designer的配置⽅法。
PyCharm中PyQt5⼯具配置
打开PyCharm,选择Settings -> Tools -> External Tools,点击左上⾓的绿⾊加号。
Name填⼊QtDesigner(⽅便后续使⽤,名称⽆所谓)。Program选择我们安装的PyQt5-tools下⾯的。Working directory则选择我们的⼯作⽬录。然后点击OK,则添加了QtDesigner作为PyCharm的外置⼯具。
然后添加PyUIC(UI转换⼯具),PyUIC的Program为,在Python的安装⽬录下⾯的Scripts⽬录下,Working directory同理设为我们的⼯作⽬录,Arguments则填⼊如下代码:
-m PyQt5.uic.pyuic $FileName$ -o $FileNameWithoutExtension$.py
最后添加pyrcc⽤于PyQt5的资源⽂件转码。具体配置与上述内容相同,Arguments填⼊:
$FileName$ -o $FileNameWithoutExtension$_rc.py
退出之前,点击Apply保存配置。配置完成之后,PyCharm中会加⼊3个⼯具。
点击QtDesigner则打开QtDesigner的界⾯。
Qt Designer界⾯简介
刚打开Qt Designer,则弹出如下图所⽰的窗⼝。
创建新的Form给出了5个模板,其中Widget与Main Window最为常⽤。这⾥我们选择创建⼀个Main Window。
上⾯界⾯的最左侧菜单为Widget Box,Widget Box中包含PyQt5中的所有Widget组件,我们可以从左侧的Widget Box中拖拽出诸如Button、View和Input等组件到中间的窗⼝中。
点击Form -> Preview(快捷键为Ctrl+R)则可以预览我们设计好的界⾯,也可以⽤Preview In来选择在相应的主题风格下预览。
我们拖拽⼀个Label与Button进⼊主窗⼝(Main Window)。
此时在右上⾓的Object Inspector(对象查看器)中可以看到主窗⼝中的已放置的对象(label与pushButton)以及其相应地Qt 类。
以Label为例,此时我们点击Main Window中的label或是在Object Inspector中选取label后,查看右侧的⼀块区域——Property Editor(属性编辑器)。
其主要包含属性有如下:
名称含义
objectName控件对象名称
名称含义
geometry相应宽和⾼与坐标
sizePolicy控件⼤⼩的策略
minimumSize最⼩的宽和⾼
maximumSize最⼤的宽和⾼
font字体
cursor光标
PS:将minimumSize和maximumSize设为⼀样的数值之后,则窗⼝的⼤⼩固定。
最右下⾓的部分则为Resource Browser(资源浏览器),资源浏览器中可以添加相应地如图⽚素材,作为Label或Button等控件的背景图⽚等。
mysql命令启动Qt Designer的UI⽂件
使⽤Qt Designer设计保存的⽂件为.ui格式的⽂件。字体软件front
通过保存并使⽤记事本等软件打开,我们可以看到.ui⽂件的内容如下:
<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
<class>MainWindow</class>
<widget class="QMainWindow" name="MainWindow">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>800</width>
<height>600</height>
</rect>
</property>
<property name="windowTitle">
<string>MainWindow</string>
</property>
python入门教程(非常详细)书<widget class="QWidget" name="centralwidget">
<widget class="QLabel" name="label">
<property name="geometry">
<rect>
<x>240</x>
<y>80</y>
<width>72</width>
<height>15</height>
</rect>
</property>
<property name="text">
<string>TextLabel</string>
</property>
</widget>
<widget class="QPushButton" name="pushButton">
<property name="geometry">
<rect>
<x>240</x>
<y>120</y>
<width>93</width>
<height>28</height>
</rect>
</property>
<property name="text">
<string>PushButton</string>
</property>
</widget>
</widget>
<widget class="QMenuBar" name="menubar">
<property name="geometry">
<rect>
<x>0</x>
<y>0</y>
<width>800</width>
<height>26</height>
</rect>
</property>
</widget>
<widget class="QStatusBar" name="statusbar"/>
</widget>
<resources/>
<connections/>
</ui>
从.ui⽂件的第⼀⾏我们便能看出,其实质是⼀个XML⽂件。ui⽂件中存放了在主窗⼝中的⼀切控件的相关属性。使⽤XML⽂件来存储UI⽂件,具有⾼可读性和移植性,因此我们可以⽅便地将.ui⽂件转换到.py⽂件,从⽽使得我们可以使⽤Python语⾔在设计的GUI上⾯编程。
将.ui⽂件转换为.py⽂件
将.ui⽂件转换到.py⽂件很简单,在前⾯我们曾设置了pyuic5这个⼯具。如果你没有在PyCharm中设置这个⼯具,或者根本没有使⽤PyCharm,则可以到命令⾏中使⽤如下命令实现.ui到.py的转换。
pyuic5 - o ⽬标⽂件名.py 源⽂件名.ui
或者直接在PyCharm中,到.ui⽂件,右键打开菜单到External Tools->PyUIC。点击之后,我们在相应⼯程⽬录下会产⽣⼀个.py⽂件。(注意,.ui⽂件必须存放在我们的External Tools中设置的相应项⽬⽬录下)
转换完成之后,打开.py⽂件。
# -*- coding: utf-8 -*-
# Form implementation generated from reading ui file 'mainWindow.ui'
#
# Created by: PyQt5 UI code generator 5.10.1
#
# WARNING! All changes made in this file will be lost!
from PyQt5 import QtCore, QtGui, QtWidgets
class Ui_MainWindow(object):
def setupUi(self, MainWindow):
MainWindow.setObjectName("MainWindow")
self.label = QtWidgets.alwidget)
self.label.setGeometry(QtCore.QRect(240, 80, 72, 15))
self.label.setObjectName("label")
self.pushButton = QtWidgets.alwidget)
self.pushButton.setGeometry(QtCore.QRect(240, 120, 93, 28))
self.pushButton.setObjectName("pushButton")
MainWindow.alwidget)网站建设运营
MainWindow.ubar)
self.statusbar = QtWidgets.QStatusBar(MainWindow)
self.statusbar.setObjectName("statusbar")
MainWindow.setStatusBar(self.statusbar)
tSlotsByName(MainWindow)
def retranslateUi(self, MainWindow):
_translate = anslate
MainWindow.setWindowTitle(_translate("MainWindow", "MainWindow"))
linux系统make命令self.label.setText(_translate("MainWindow", "TextLabel"))
self.pushButton.setText(_translate("MainWindow", "PushButton"))
观察上述⽂件,可以看到如果不通过Qt Designer来制作界⾯的话,我们将会⼀次次地调试程序,来讲按钮和Label等放在合适的位置,这将是极其痛苦的过程。⽽通过Qt Designer,我们可以快速地制作UI,并⽣成Python的代码,从⽽实现快速地UI的开发。
使⽤转换的.py⽂件
然⽽,此时之间运⾏这个转换好的Python⽂件是⽆法显⽰任何窗⼝的。因为这个Python⽂件只有定义主窗⼝以及其控件的代码,并没有程序⼊⼝的代码。为了秉持视图与逻辑分离的原则,我们再编写⼀个新的脚本来调⽤这个⽂件,并且创建⼀个窗⼝。
import sys
from PyQt5.QtWidgets import QApplication, QMainWindow
crontab每五分钟执行一次from mainWindow import *
class MyWindow(QMainWindow, Ui_MainWindow):
def __init__(self, parent=None):
super(MyWindow, self).__init__(parent)
self.setupUi(self)
if __name__ == '__main__':
app = QApplication(sys.argv)
myWin = MyWindow()
myWin.show()
<_())
通过上述代码,我们继承了Ui_MainWindow类,使⽤其构造⽅法构造主窗⼝,并定义了程序的⼊⼝,通过创建QApplication 对象来创建Qt窗⼝。其运⾏结果如下:
通过上述操作,我们熟悉了Qt Designer设计界⾯,到实现业务逻辑的⼤致⼯作流程。通过这个⼯作流程可以简化⼯作,实现速度的提升。
通过对视图与业务逻辑的分离,在每次更改Qt Designer的UI设计的时候,也不⽤重新编写代码,⽽只需对更改的部分做稍微的修改即可。
在下⼀讲中,我们将继续讲解Qt Designer的使⽤。
到此这篇关于PyQT5速成教程之Qt Designer介绍与⼊门的⽂章就介绍到这了,更多相关Qt Designer介绍与⼊门内容请搜索以前的⽂章或继续浏览下⾯的相关⽂章希望⼤家以后多多⽀持!
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论