PyQT的安装和使用

pyQT的安装不需要在官网下载QT安装包，只需要创建conda环境然后pip安装，安装pyQT5-tools之后会安装QT designer，然后就可以可视化设计一个UI，然后通过Pyuic工具就可以转化为一个py文件，这个py文件就是整个工程，py文件中有一个class包含了整个UI设计，然后只需要编辑py文件中这个class的功能即可，编辑子函数。
(这个文档非常好)[https://www.w3ccoo.com/pyqt5/index.html]

VScode+pyQT installation

  1. 安装PyQt

    1
    2
    pip install PyQt5
    pip install PyQt5-tools

    vscode安装PYQT Integration便于使用pyqt

    1
    2
    3
    4
    5
    6
    7
    8
    # Pyqt-integration > Qtdesigner: Path
    \venv_QT\Lib\site-packages\qt5_applications\Qt\bin\designer

    # Pyqt-integration > Pyuic: Cmd 用于转化ui格式为py
    \venv_QT\Scripts\pyuic5

    # Pyqt-integration > Pyuic > Compile: Filepath
    默认是将ui转化好的py文件存在当前目录的ui文件夹下

  2. 使用Pyuic工具，将 .ui文件转换为 .py文件。

    • 在文件夹栏空白处点击右键点击「PYQT: New Form」启动Qt Designer软件

    • 「文件 > 另存为」，把所设计的 .ui文件保存到项目目录下

    • 右击 xxx.ui文件「PYQT: Compile Form」调用Pyuic工将 xxx.ui文件转换为 xxx_Ui.py文件，是可以相互转化的。

      1
      2
      3
      # -x 开关向生成的 Python 脚本（来自 XML）添加了少量附加代码，使其成为可自执行的独立应用程序。
      pyuic5 -x input.py -o output.ui
      python -m PyQt6.uic.pyuic -x register.ui -o register.py

  • 对GUI界面进行修改和调整。在文件夹栏的 .ui文件右击，点击「PYQT: Edit in Designer」，即可启动Qt Designer对GUI界面进行编辑。

  • 编辑完成后保存并退出Qt Designer，对.ui文件右击，点击「PYQT: Compile Form」，重新更新一次 xxx_Ui.py文件即可。

  1. 使用python编程，调用GUI界面的 .py文件，编写GUI界面各组件的绑定事件函数，如点击某按钮时触发某函数，实现某功能。

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    from PyQt5.QtWidgets import QApplication, QMainWindow
    import matchingNetworkDesigner_Ui # import GUI的.py文件 
    if __name__ == "__main__":
     app = QApplication(sys.argv) 
    MainWindow = QMainWindow() 
    ui = matchingNetworkDesigner_Ui.Ui_MainWindow()# ui=GUI的py文件名.类名
     ui.setupUi(MainWindow)
     ui.L_PB_cal.clicked.connect(L_cal) # 把函数绑定GUI的按钮的点击事件。
     ui.L_PB_reset.clicked.connect(L_reset)# 按钮名字「L_PB_cal」和「L_PB_reset」在Qt Designer中定义。
     MainWindow.show()
     sys.exit(app.exec_())

PyQT include

PyQT的模块组成 其余就是和web，sql，opengl等一些相关的，用不着
QtCore 其他模块使用的核心非 GUI 类
QtGui 图形用户界面组件
QtXml 处理 XML 的类
QtWidgets 用于创建经典桌面样式 UI 的类。
QtDesigner 用于扩展 Qt Designer 的类
PyQt5-tools的组成 其余不用看的
assistantQt Assistant 文档工具
pyqt5designerQt Designer GUI 布局工具
linguist Qt Linguist 翻译工具
qmake Qt 软件构建工具
pyuic5 用于从 ui 文件生成代码的 Qt 用户界面编译器

PyQT Basic Class

  • QObject 是所有 Qt 对象的基类
  • QPaintDevice类是所有可绘制对象的基类。
  • QWidget类，派生自 QObject 和 QPaintDevice 类，是所有用户界面对象的基类。一般QWidget就是初始的大页面
  • QApplication类管理 GUI 应用程序的主要设置和控制流程包含主事件循环，其实就控制每个页面的关闭开启
  • QMainWindow基于 GUI 的应用程序的顶级窗口是由 QMainWindow 小部件对象创建的

QT信号与插槽

每个派生自 QObject 类的 PyQt 小部件都可以发出 “信号” 以响应一个或多个事件。信号是一个小部件的成员函数，比如点击click（）。信号"连接connect"到一个"插槽function"。 插槽可以是任何可调用的 Python 函数。

  • 可以使用qt designer的Signal/Slot 编辑器（或按 F4）直接添加

  • widget.signal.connect(slot_function)
button.clicked.connect(slot_function)

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24

    ## 布局管理

    ### 绝对布局

    * 设置一个大画面setGeometry(10,10,300,200)，然后里面的button位于move(50,2)

    ```python
    def window():
       app = QtGui.QApplication(sys.argv)

       w = QtGui.QWidget())    
       w.setGeometry(10,10,300,200)
       w.setWindowTitl

       b = QtGui.QPushButton(w)
       b.setText("Hello World!")
       b.move(50,20e(“PyQt”)

       w.show()
       sys.exit(app.exec_())

    if __name__ == '__main__':
       window()

相对布局

  • QBoxLayout垂直或水平排列

    • addWidget()将小部件添加到

    • addStretch()创建空的可拉伸框

    • addLayout()添加另一个嵌套布局

    • vbox = QVBoxLayout()，最后要win.setLayout(vbox)

  • QGridLayout以行和列排列

  • QFormLayout创建两列表单

qt组件

多页面

不止一个界面，如何弹出界面并多页面操作

简单的提示界面

  • QDialog

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    def window():
       app = QApplication(sys.argv)
       w = QWidget()
       btn = QPushButton(w)
       btn.clicked.connect(showdialog)
       w.setWindowTitle("PyQt Dialog demo")
       w.show()
       sys.exit(app.exec_())
    def showdialog():
       dlg = QDialog()
       b1 = QPushButton("ok",dlg)

  • QMessageBox

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    def window():
       app = QApplication(sys.argv)
       w = QWidget()
       b = QPushButton(w)
       b.clicked.connect(showdialog)
       w.setWindowTitle("PyQt MessageBox demo")
       w.show()
       sys.exit(app.exec_())
    def showdialog():
       msg = QMessageBox()
       msg.setIcon(QMessageBox.Information)

真正的多页面

  • SDI 单文档接口：显示多个独立的窗口。 这需要更多的内存资源。

  • MDI 多文档接口 ：子窗口相对于彼此放置在主容器内。 容器小部件称为 QMdiArea。

QMdiArea 小部件一般占据 QMainWondow 对象的中心小部件。 该区域中的子窗口是 QMdiSubWindow 类的实例。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
class MainWindow(QMainWindow):
   count = 0

   def __init__(self, parent = None):
      super(MainWindow, self).__init__(parent)
      self.mdi = QMdiArea()
      self.setWindowTitle("MDI demo")
      self.setCentralWidget(self.mdi)
      bar = self.menuBar()

      file = bar.addMenu("File")
      file.addAction("New")
      file.triggered[QAction].connect(self.windowaction)
   def windowaction(self, q): # 多个menu摁键传入参数
      print ("triggered")
      if q.text() == "New":
         MainWindow.count = MainWindow.count+1
         sub = QMdiSubWindow()
         sub.setWidget(QTextEdit())
         sub.setWindowTitle("subwindow"+str(MainWindow.count))
         self.mdi.addSubWindow(sub)
         sub.show()

面向对象地制作GUI

QSS

Qt Style Sheets Reference

Qt Style Sheets ExamplesQt 官方例子

Qt样式表（以下统称QSS）的术语和语法规则几乎和CSS相同。

  • 类似CSS，QSS每一条都是由一个选择器和一组声明构成：

    • 选择器选出要对哪种控件进行样式修改，

    • 每个声明都是键值对，键为属性，值为属性值

设置方法

  1. 局部设置，用setStyleSheet(QSS)

    1
    2
    label1 = QLabel('标签1', self)
    label1.setStyleSheet('background-color:green;')
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    btn2 = QPushButton('按钮2', self)
    btn2.move(200, 100)
    btn2.resize(70, 30)
    #局部设置
    btn1.setStyleSheet('''
        QPushButton{
            color:red;
        }
        QPushButton:hover{
            background-color: green;
        }
    ''')

  2. 全局设置，把所有的buttun之类的都设置好QSS，然后直接对Mainwindow进行加载

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    if __name__ == '__main__' :
        app = QApplication(sys.argv)
        window = Window()
        QssStyle = '''
                QPushButton:hover{
                        background-color: green;
                    }
                QPushButton[name="btn"]:hover{
                        background-color: red;
                    }
                QPushButton#btn:hover{
                        background-color: green;
                        color:red;
                    }
                '''
        # # 全局设置
        window.setStyleSheet(QssStyle)  # 当前窗口全局有效
        window.show()
        sys.exit(app.exec_())

为降低耦合，往往把QSS写在一个单独的style.qss文件中，然后在main.py的QApplication或QMainWindow中加载样式

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
QPushButton {
    background-color: #555555;
    border: none;
    color: white;
    font-size: 14px;
    border-radius: 3px;
    padding: 5px 10px;}QPushButton:hover {
    background-color: #666666;}QProgressBar {
    background-color: #444444;
    height: 8px;
    border-radius: 4px;}QProgressBar::chunk {
    background-color: #777777;}QSlider {
    background-color: #444444;}QSlider::handle:horizontal {
    background-color: #666666;
    border-radius: 100%;
    width: 12px;
    height: 12px;
    margin: -3px 0;}
1
2
3
4
5
6
7
8
9
10
# 加载QSS样式的方法
app = QApplication(sys.argv)
window = MainWindow()

style_file = './style.qss'
style_sheet = QSSLoader.read_qss_file(style_file)
window.setStyleSheet(style_sheet)

window.show()
sys.exit(app.exec_())

Qt-material

一个github开源，可以快速设置所有的qss。还有很多其他的快速设置qss的库GTRONICK-QSS，飞扬青云-QSS，QDarkStyleSheet

1
pip install qt-material
1
2
3
4
5
6
7
8
9
10
11
12
# 使用例子
import sys
from PyQt5 import QtWidgets
from qt_material import apply_stylesheet

app = QtWidgets.QApplication(sys.argv)
window = QtWidgets.QMainWindow()

apply_stylesheet(app, theme='dark_teal.xml')

window.show()
app.exec_()