本篇将会涉及：

• 通过Qt设计师创建一个GUI
• 添加数个窗口部件到GUI
• 转换UI代码为Python代码
• 创建一个单独的Python模块来控制GUI窗口部件

在之前的文章中，我们适用Qt设计师创建了很多GUI窗口，这些窗口都是界面与逻辑都在一个文件里面。如果GUI程序逻辑简单，倒也没什么问题，如果窗口中部件的逻辑过多，就不便于管理。

在实际的开发中，我们通常将代码分为界面代码和逻辑代码，界面与逻辑分离。下面我们将演示一下在Qt设计师创建的GUI中，解耦逻辑代码。

一、使用Qt设计师创建一个GUI

首先，我们创建一个主窗口：

然后，在主窗口中添加一个Table Widgets表格控件：

在主窗口中添加两个水平布局的按钮：

然后将窗口中的部件进行垂直布局：

基本的结构搭建好了，我们在表格部件中添加行和列：

添加好行和列之后，我们可以在表格控件中右击鼠标，选择“编辑项目”对行和列进行编辑：

这样就完成了窗口界面的布局。

二、将UI文件转为Python文件

我们没有使用Qt设计师进行任何的逻辑性操作，只是创建了一个基本的窗口布局，现在使用pyuic5将其转化为Python文件。

转换成的Python文件运行正常：

三、解耦Python逻辑代码

接下来通过Python模块对UI的主窗口进行逻辑的编辑。

我们新建一个Python文件，引入这个GUI窗口，运行的结果和直接运行那个主文件是一样的。

from GUI import nullwindow
from PyQt5 import QtCore,QtWidgets,QtGui

if __name__ == '__main__':
    import sys
    app = QtWidgets.QApplication(sys.argv)
    MainWindow = QtWidgets.QMainWindow()
    ui = nullwindow.Ui_MainWindow()
    ui.setupUi(MainWindow)
    MainWindow.show()
    sys.exit(app.exec_())

接着，我们在新建的decouple_window.py文件中对窗口的表格添加默认值：

from GUI import nullwindow
from PyQt5 import QtCore,QtWidgets,QtGui

if __name__ == '__main__':
    import sys
    app = QtWidgets.QApplication(sys.argv)
    MainWindow = QtWidgets.QMainWindow()
    ui = nullwindow.Ui_MainWindow()
    ui.setupUi(MainWindow)
    
    ui.tableWidget.setItem(0 , 0, QtWidgets.QTableWidgetItem("数据1"))
    ui.tableWidget.setItem(1 , 1, QtWidgets.QTableWidgetItem("数据2"))
    ui.tableWidget.setItem(2 , 2, QtWidgets.QTableWidgetItem("数据3"))

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

这样我们就在表格中设置了三个默认数据，现在的设置是直接在主循环中写死的，我们可以新建一个方法，将设置数据的代码放置其中：

from GUI import nullwindow
from PyQt5 import QtCore,QtWidgets,QtGui

def set_table_item():
    ui.tableWidget.setItem(0 , 0, QtWidgets.QTableWidgetItem("数据1"))
    ui.tableWidget.setItem(1 , 1, QtWidgets.QTableWidgetItem("数据2"))
    ui.tableWidget.setItem(2 , 2, QtWidgets.QTableWidgetItem("数据3"))

if __name__ == '__main__':
    import sys
    app = QtWidgets.QApplication(sys.argv)
    MainWindow = QtWidgets.QMainWindow()
    ui = nullwindow.Ui_MainWindow()
    ui.setupUi(MainWindow)

    set_table_item()

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

除了设置数据，我们还可以为按钮添加一个信号槽，当按钮点击的时候，按钮的文本进行改变：

from GUI import nullwindow
from PyQt5 import QtCore,QtWidgets,QtGui

def set_table_item():
    ui.tableWidget.setItem(0 , 0, QtWidgets.QTableWidgetItem("数据1"))
    ui.tableWidget.setItem(1 , 1, QtWidgets.QTableWidgetItem("数据2"))
    ui.tableWidget.setItem(2 , 2, QtWidgets.QTableWidgetItem("数据3"))

def button_clicked():
    ui.pushButton.setText("按钮被点击")

if __name__ == '__main__':
    import sys
    app = QtWidgets.QApplication(sys.argv)
    MainWindow = QtWidgets.QMainWindow()
    ui = nullwindow.Ui_MainWindow()
    ui.setupUi(MainWindow)

    # 调用函数
    set_table_item()
    ui.pushButton.clicked.connect(button_clicked)

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

因为有了逻辑函数，我们的信号槽能够绑定和调用的部件就可以是多种多样的，下面我们就演点击按钮，按钮和表格中的文字都进行改变。

from GUI import nullwindow
from PyQt5 import QtCore,QtWidgets,QtGui

def set_table_item(item1='数据1',item2='数据2',item3='数据3'):
    ui.tableWidget.setItem(0 , 0, QtWidgets.QTableWidgetItem(item1))
    ui.tableWidget.setItem(1 , 1, QtWidgets.QTableWidgetItem(item2))
    ui.tableWidget.setItem(2 , 2, QtWidgets.QTableWidgetItem(item3))

def button_clicked():
    ui.pushButton.setText("按钮被点击")
    set_table_item(item2='数据2被改变')

if __name__ == '__main__':
    import sys
    app = QtWidgets.QApplication(sys.argv)
    MainWindow = QtWidgets.QMainWindow()
    ui = nullwindow.Ui_MainWindow()
    ui.setupUi(MainWindow)

    # 调用函数
    set_table_item()
    ui.pushButton.clicked.connect(button_clicked)
    MainWindow.show()
    sys.exit(app.exec_())

猜你也喜欢