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里面界面更改保存(一定要記的保存)后,都需要重新執行命令進行界面文件的更新。而第二種則不需要。

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。