Posted on: 9月 13, 2010 Posted by: Fan Shuyang Comments: 0

Pyqt UI设计

Python Pyqt5 UI设计

《ZQWEI内部学习资料》

By Quix 9.13

UI设计流程:

1.前期准备

  1. 通过国内镜像pip安装Pyqt5
  2. 关联Qt Designer/或创建快捷方式方便日后打开

2.UI创建

  1. 启动Qt Designer,拖动控件,可使用layout工具实现控件对齐,完成UI设计,确保各控件命名准确,然后保存.ui格式文件。
  2. CMD cd至(或ide内置的console).ui文件夹下,输入pyuic -o xxx.py xxx.ui。等待0.5-1分钟后即可将.ui文件转换至.py文件
  3. 改写class UI,改写方法如下:(2020.2.3 可不这样写,应该采用多文件方法)
  4. 将class xxx(object): 改为 class xxx(QWidgets):
  5. 添加初始化代码:

def __init__(self):

super().__init__()

self.setupUi()

self.show()

写新python文件即可。

from PyQt5.QtWidgets import QMainWindow, QWidget
from PyQt5 import QtWidgets

from Ui_MainWindow import Ui_MainWindow

class MainWindow(QMainWindow, Ui_MainWindow):
“””
Class documentation goes here.
“””
def __init__(self, parent=None):
“””
Constructor

@param parent reference to the parent widget
@type QWidget
“””
super(MainWindow, self).__init__(parent)
self.setupUi(self)

if __name__ == “__main__”:
import sys
app = QtWidgets.QApplication(sys.argv)
# 实例化主窗体
mainForm = MainWindow()
# 显示主窗体
mainForm.show()
sys.exit(app.exec_())

  1. 将原生成的class两个函数中的第二项参数删除。
  2. 替换Mainwindow/Dialog为self(第3步删除了的那个变量)
  3. 完成
  4. 编写启动函数观察UI

if __name__ == ‘__main__’:

import sys

app = QApplication(sys.argv)

ex = Ui_Dialog() #处决于类的名称

sys.exit(app.exec_())

3.编写函数(下面为一些常用方法)

1.设置标题/大小/icon

self.setGeometry(300, 300, 300, 220)

#设置窗口的标题

self.setWindowTitle(‘Icon’)

#设置窗口的图标,引用当前目录下的web.png图片

self.setWindowIcon(QIcon(‘web.png’))

(其中self指向QWidgets类)

2.UI移动窗口至中间的方法

def center(self):

# 获得窗口

qr = self.frameGeometry()

# 获得屏幕中心点

cp = QDesktopWidget().availableGeometry().center()

# 显示到屏幕中心

qr.moveCenter(cp)

self.move(qr.topLeft())

3.按钮Button

设置按钮提示语

对象名称.setToolTip(‘提示语’)

按钮事件

对象名称.clicked.connect(函数名)

设置按钮背景图片

对象.setStyleSheet(“QPushButton{border-image: url(./logo.png)}”

“QPushButton:hover{border-image: url(./back.gif)}”

“QPushButton:pressed{border-image: url(./ballistic_img.png)}”)

4.画图可安装Qyqtgraph,具体可以baidu

5.菜单的Qaction(以关闭软件的Qaction为例子)

Action名称 = QAction(QIcon(‘exit.png’), ‘&Exit’, self)

Action名称.setShortcut(‘Ctrl+Q’) #设置快捷键

Action名称.setStatusTip(‘Exit application’) #设置Tip,见3

Action名称.triggered.connect(函数名) #点击菜单后执行函数

6.左下角Tip状态栏直接显示

self.statusBar().showMessage(‘内容’)

7.重写事件(经过上述修改后的pyuic转换文件就可以接收事件了,例如下面是一个键盘点击ESC就关闭的函数)

def keyPressEvent(self, e):

if e.key() == Qt.Key_Escape:

self.close()

8.checkbox (勾选框)

对象名.stateChanged.connect(函数名,如下面的self.changeTitle)

def changeTitle(self, state):

#State为接收的状态,True 或 False,下面函数用以转换主标题

if state == Qt.Checked:

self.setWindowTitle(‘QCheckBox’)

else:

self.setWindowTitle(”)

对象.toggle() #转换勾选状态

对象.isChecked() #显示勾选状态

9.QlineEdit输入框

对象.textChanged[str].connect(函数名) #输入改变后调用该函数

对象. currentText() #返回当前输入内容

对象.setFocusPolicy(QtCore.Qt.NoFocus) #禁止输入

10.弹出提示框

QMessageBox.critical(self, “错误输入”,

(“错误信息”))

QMessageBox.information(self, “信息”,

(“要展示的信息”))

….剩下的可以baidu一下

11.UI无边框实现:

self.setWindowFlags(Qt.FramelessWindowHint)

12.下拉框:

对象名.activated[str].connect(函数) #下拉框内容转换执行函数

对象. currentText() #返回当前输入内容

13.设置Tab引索:

Tab对象名.setCurrentIndex(号码)

14.文件保存/打开

可百度Qfile,例:

filename = QFileDialog.getSaveFileName(self.ui, ‘保存’, ‘c:/’, “csv文件 (*.csv)”)

返回filename[0]为路径,[1]为文件type

15. 设置UI大背景

palette1 = QPalette() # 填写图片的绝对路径

palette1.setBrush(self.backgroundRole(), QBrush(QPixmap(‘./background.png’)))

self.setPalette(palette1)

 

 

 

Categories:

Leave a Comment