QT python

简介

本系列旨在记录人工智能边缘计算的基础知识，共分为三部分：

1. OpenCV-python:：图像、视频数据的处理、一些应用
2. Qt：软件界面设计
3. SDK调用：调用已有的人工智能模型

所需python工具包：

pip install pyside2

---

组件篇

---

基础界面

这里我们以一个简单的身高统计的程序来说明一个QT基础界面的构成：
from PySide2.QtWidgets import QApplication, QMainWindow, QPushButton, QPlainTextEdit, QMessageBox

'''
测试使用：
小明 185
小红 175
小刚 176
小军 155
小李 156
小董 180
小王 173
小张 170
'''


class Statistic():
    def __init__(self):
        self.window = QMainWindow()
        # 窗口大小
        self.window.resize(500, 500)
        # 窗口左上角相对于屏幕的位置
        self.window.move(300, 300)
        self.window.setWindowTitle('身高统计')

        self.textEdit = QPlainTextEdit(self.window)
        self.textEdit.setPlaceholderText("请输入身高名单")
        # 相对于window的位置
        self.textEdit.move(10, 25)
        self.textEdit.resize(300, 350)

        self.button = QPushButton('统计', self.window)
        self.button.move(380, 80)
        self.button.clicked.connect(self.button_button)

    def button_button(self):
        text = self.textEdit.toPlainText()
        height_above_170 = ''
        height_below_170 = ''
        for line in text.splitlines():
            if not line.strip():
                continue
            solo = line.split(" ")
            # 去空
            solo = [p for p in solo]
            name, height = solo
            if int(height) >= 175:
                height_above_170 += name + '\n'
            else:
                height_below_170 += name + '\n'
        QMessageBox.about(self.window, '统计结果',
                          f'''身高175cm以上（含175cm）的有：\n{height_above_170}
                          \n身高175cm以下的有：\n{height_below_170}''')


app = QApplication([])
statistic = Statistic()
statistic.window.show()
app.exec_()

• app负责创建应用程序和各种组件的事件监听；
• windows即下图中最大的窗口，可以设置标题、logo；
• textEdit是一个多行输入的组件，即下图中写小明等人身高的那个框内的范围；
• button是下图中写有统计的那块按钮；
• app.exec_()让界面处于循环运行中。
  

加载由designer设计的界面

安装pyside2时会默认安装designer，一般位置在{python环境所在位置}\Lib\site-packages\PySide2，用该软件设计界面最大的好处在于可以很方便的调整组件的大小和位置，实现了界面和功能的分离，页面与代码之间通过designer里对组件的命名来联系，所以命名十分重要。下面是一个加载designer设计界面的例子，实际功能并未实现。

from PySide2.QtWidgets import QApplication
from PySide2.QtUiTools import QUiLoader
from PySide2.QtCore import QFile


class monitoring():
    def __init__(self):
        # 从文件中加载ui
        q_file = QFile("ui/test.ui")
        q_file.open(QFile.ReadOnly)
        q_file.close()

        self.ui = QUiLoader().load(q_file)
        self.ui.pushButton.clicked.connect(self.button_pushButton)
        self.ui.pushButton_5.clicked.connect(self.button_pushButton_5)

    def button_pushButton(self):
        self.ui.plainTextEdit.setPlainText("视频加速\n")

    def button_pushButton_5(self):
        self.ui.plainTextEdit_2.setPlainText("视频播放\n")


app = QApplication([])
monitor = monitoring()
monitor.ui.show()
app.exec_()

test.ui

布局

原始界面：

随着边界的拉伸不会变化：

垂直布局

这里的分裂器垂直布局不需要进行大的调整，自动分割，可以以等大拉伸；
垂直布局需要修改sizePolicy中的垂直策略为mininum使得等距分布。

水平布局

这里为了对比，分别进行了上下两种不同的分布设置：

最终效果：

当拉伸时有不同效果：

还有棋盘式布局和表格布局，这里先不进行过多介绍了，后续用到会再说明。

发布程序

打包程序

pip install pyinstaller

我们将上面开发的界面进行打包，打包命令：
pyinstaller + 待打包文件路径 + 参数，例如：

pyinstaller load_ui.py --noconsole --hidden-import PySide2.QtXml

其中--noconsole参数代表程序运行时不显示控制台，--hidden-import PySide2.QtXml是手工指定导入PySide2.QtXml库
打包结束后需要将ui/test.ui复制到执行文件同级目录下，即可生成可执行文件（与python程序运行的界面还是有一些区别的）：

设置logo

from PySide2.QtGui import QIcon
# ······
app = QApplication([])
app.setWindowIcon(QIcon("myicon.png"))
monitor = monitoring()
monitor.ui.show()
app.exec_()

打包时带logo，注意这里使用的是ico格式的文件：

pyinstaller load_ui.py --noconsole --hidden-import PySide2.QtXml --icon="logo.ico"

风格设置

通过编辑样表来设置：

• *：匹配所有内容；
• QPushButton：匹配所有的QPushButton；
• QPushButton:hover:pressed：当悬浮在按钮上，且被按下 时；
• QPushButton:hover:!pressed：当悬浮在按钮上，且未被按下 时；
• QPushButton#pushButton_4：匹配名字为pushButton_4的QPushButton。
  预览效果：
  
  这里的样式设置类似与css，更多细节请关注官方网站：
  https://doc.qt.io/qt-5/stylesheet-syntax.html

未完待续 ~ ~ ~

参考网址：
https://www.bilibili.com/video/BV1cJ411R7bP?spm_id_from=333.337.search-card.all.click&vd_source=071a6a156f5d29dbb9701c2bdbda3878