PySide2使用ui界面文件

Python版本3.7
PySide2 Version: 5.14.1
官方文档：https://doc.qt.io/qtforpython/tutorials/basictutorial/uifiles.html
参考：https://stackoverflow.com/questions/59865610/how-to-translate-a-file-from-ui-to-py-for-pyside2

直接用代码编写界面是很繁琐的，Qt Creator为我们提供了界面设计的功能，如果能在Qt Creator编写界面，然后转化成py文件，这样就就能提高我们的效率，使我们更关注业务层面而不是界面的编写。下面来看看怎么做到的。

第一步首先是在Qt Creator里面设计界面，这个界面实际上是一个xml文件。下面是我的一个界面文件。如果没有安装Qt Creator，可以将下面的文本复制，然后保存为mainwindow.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>400</width>
    <height>300</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>MainWindow</string>
  </property>
  <widget class="QWidget" name="centralWidget">
   <widget class="QPushButton" name="pushButton">
    <property name="geometry">
     <rect>
      <x>140</x>
      <y>100</y>
      <width>114</width>
      <height>32</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>400</width>
     <height>22</height>
    </rect>
   </property>
  </widget>
  <widget class="QToolBar" name="mainToolBar">
   <attribute name="toolBarArea">
    <enum>TopToolBarArea</enum>
   </attribute>
   <attribute name="toolBarBreak">
    <bool>false</bool>
   </attribute>
  </widget>
  <widget class="QStatusBar" name="statusBar"/>
 </widget>
 <layoutdefault spacing="6" margin="11"/>
 <resources/>
 <connections/>
</ui>

然后官方教程中(上面的官方文档中)提到了一个工具pyside2-uic，我在命令行运行这个工具名提示zsh: command not found: pyside2-uic，然后我又在PySide2安装包目录找了半天，确实没有这个工具，不知道其他人有没有这种情况，但是我却找到了uic这个工具，我的uic工具位置/usr/local/lib/python3.7/site-packages/PySide2/uic(这个目录仅供参考，每个人的PySide2包位置都不一样)，请大家自行搜索pip安装包的位置，并找到PySide2这个包。

如果你电脑有pyside2-uic这个工具，那么使用下面命令进行转换。
pyside2-uic mainwindow.ui > ui_mainwindow.py
这个命令是官方给出，我没有试过，不知道能不能成功。

如果你跟我一样，没有pyside2-uic，只在PySide2包的根目录下找到了uic的话，那么执行下面这个命令(注意需要在与uic文件同目录下运行，如果想全局执行，请加入环境变量中)。
./uic -g python -o ui_mainwindow.py mainwindow.ui
o(output)表示输出的文件，g(generator)表示输出为python格式。

生成的ui_mainwindow.py内容如下：

# -*- coding: utf-8 -*-

################################################################################
## Form generated from reading UI file 'mainwindow.ui'
##
## Created by: Qt User Interface Compiler version 5.14.1
##
## WARNING! All changes made in this file will be lost when recompiling UI file!
################################################################################

from PySide2.QtCore import (QCoreApplication, QMetaObject, QObject, QPoint,
    QRect, QSize, QUrl, Qt)
from PySide2.QtGui import (QBrush, QColor, QConicalGradient, QCursor, QFont,
    QFontDatabase, QIcon, QLinearGradient, QPalette, QPainter, QPixmap,
    QRadialGradient)
from PySide2.QtWidgets import *


class Ui_MainWindow(object):
    def setupUi(self, MainWindow):
        if MainWindow.objectName():
            MainWindow.setObjectName(u"MainWindow")
        MainWindow.resize(400, 300)
        self.centralWidget = QWidget(MainWindow)
        self.centralWidget.setObjectName(u"centralWidget")
        self.pushButton = QPushButton(self.centralWidget)
        self.pushButton.setObjectName(u"pushButton")
        self.pushButton.setGeometry(QRect(140, 100, 114, 32))
        MainWindow.setCentralWidget(self.centralWidget)
        self.menuBar = QMenuBar(MainWindow)
        self.menuBar.setObjectName(u"menuBar")
        self.menuBar.setGeometry(QRect(0, 0, 400, 22))
        MainWindow.setMenuBar(self.menuBar)
        self.mainToolBar = QToolBar(MainWindow)
        self.mainToolBar.setObjectName(u"mainToolBar")
        MainWindow.addToolBar(Qt.TopToolBarArea, self.mainToolBar)
        self.statusBar = QStatusBar(MainWindow)
        self.statusBar.setObjectName(u"statusBar")
        MainWindow.setStatusBar(self.statusBar)

        self.retranslateUi(MainWindow)

        QMetaObject.connectSlotsByName(MainWindow)
    # setupUi

    def retranslateUi(self, MainWindow):
        MainWindow.setWindowTitle(QCoreApplication.translate("MainWindow", u"MainWindow", None))
        self.pushButton.setText(QCoreApplication.translate("MainWindow", u"PushButton", None))
    # retranslateUi

最后在代码中引用ui_mainwindow.py文件

from ui_mainwindow import Ui_MainWindow
from PySide2.QtWidgets import QApplication, QMainWindow
import sys


class MainWindow(QMainWindow):
    def __init__(self):
        super(MainWindow, self).__init__()
        self.ui = Ui_MainWindow()
        self.ui.setupUi(self)
        # 界面元素均可通过self.ui这个对象来获取
        self.ui.pushButton.clicked.connect(self.btn_click)

    def btn_click(self):
        print('clicked')


if __name__ == "__main__":
    app = QApplication(sys.argv)

    window = MainWindow()
    window.show()

    sys.exit(app.exec_())

上面是官方给出的第一个方法，官方还有另一种方法，使用QtUiTools类。

import sys
from PySide2.QtUiTools import QUiLoader
from PySide2.QtWidgets import QApplication
from PySide2.QtCore import QFile, QIODevice

if __name__ == "__main__":
    app = QApplication(sys.argv)

    ui_file_name = "mainwindow.ui"
    ui_file = QFile(ui_file_name)
    if not ui_file.open(QIODevice.ReadOnly):
        print("Cannot open {}: {}".format(ui_file_name, ui_file.errorString()))
        sys.exit(-1)
    loader = QUiLoader()
    # 载入界面文件
    window = loader.load(ui_file)
    ui_file.close()
    if not window:
        print(loader.errorString())
        sys.exit(-1)
    window.show()

    sys.exit(app.exec_())

不过像上面这样的话，引用界面元素好像就没有智能化提示了，我比较推荐第一种，注意第一种方式每次Qt Creator里面界面更改保存(一定要记的保存)后，都需要重新执行命令进行界面文件的更新。而第二种则不需要。