介紹
最初,因為課設的緣故,我只是想做一個通過按鍵進行切面切換而已,但是我看網上資料里面僅是語焉不詳,讓我困惑的很,但后面我通過摸索才發現這件事實在是太簡單了,因此我想要記錄下來。
本博客將介紹如何使用PyQt5庫創建一個具有多界面切換功能的應用程序。通過詳細的代碼示例,我們將展示如何設計一個包含兩個主要界面的應用,用戶可以通過菜單欄的選項在這兩個界面之間自由切換。代碼示例中,我們使用了QStackedWidget來實現界面的切換。此外,我們還將分享如何連接菜單項與界面切換功能的技巧。無論是初學者還是有一定經驗的開發者,都能通過本博客快速掌握PyQt5中多界面切換的實現方法,為自己的應用程序增添更多交互性和靈活性。
UI的設計
創建不需要選擇其他,就只用選擇主窗口,即下面圖所示
在左邊的控件中的Containers中選擇Stacked Widget。拉到主窗口中,拉托到合適的大小。
由于目前的不是很明顯,所以你可以暫時先修改一下它的屬性。將frameShape修改為Box。
?現在就明顯許多了,接下來我們隨便的添加一些控件。
預覽效果如下所示:
界面1
?界面2
可以通過右上角的兩個三角形進行切換,沒關系,只是這里的預覽有,通過代碼就沒有了。接下來我準備使用菜單欄來進行示例,如下所示:
這里我們將菜單欄部分的“界面1”命名為action_1,“界面2”命名為action_2。
菜單欄控制界面切換
下面為我設計的簡單ui轉換的代碼,Switch.py。
# -*- coding: utf-8 -*-# Form implementation generated from reading ui file 'Switch.ui'
#
# Created by: PyQt5 UI code generator 5.15.9
#
# WARNING: Any manual changes made to this file will be lost when pyuic5 is
# run again. Do not edit this file unless you know what you are doing.from PyQt5 import QtCore, QtGui, QtWidgetsclass Ui_MainWindow(object):def setupUi(self, MainWindow):MainWindow.setObjectName("MainWindow")MainWindow.resize(798, 553)self.centralwidget = QtWidgets.QWidget(MainWindow)self.centralwidget.setObjectName("centralwidget")self.stackedWidget = QtWidgets.QStackedWidget(self.centralwidget)self.stackedWidget.setGeometry(QtCore.QRect(50, 70, 721, 401))self.stackedWidget.setFrameShape(QtWidgets.QFrame.Box)self.stackedWidget.setObjectName("stackedWidget")self.page = QtWidgets.QWidget()self.page.setObjectName("page")self.checkBox1 = QtWidgets.QCheckBox(self.page)self.checkBox1.setGeometry(QtCore.QRect(430, 150, 75, 16))font = QtGui.QFont()font.setFamily("Times New Roman")font.setPointSize(10)font.setBold(True)font.setWeight(75)self.checkBox1.setFont(font)self.checkBox1.setObjectName("checkBox1")self.pushButton1 = QtWidgets.QPushButton(self.page)self.pushButton1.setGeometry(QtCore.QRect(260, 150, 93, 28))self.pushButton1.setObjectName("pushButton1")self.stackedWidget.addWidget(self.page)self.page_2 = QtWidgets.QWidget()self.page_2.setObjectName("page_2")self.pushButton2 = QtWidgets.QPushButton(self.page_2)self.pushButton2.setGeometry(QtCore.QRect(300, 140, 93, 28))self.pushButton2.setObjectName("pushButton2")self.checkBox2 = QtWidgets.QCheckBox(self.page_2)self.checkBox2.setGeometry(QtCore.QRect(320, 230, 75, 16))font = QtGui.QFont()font.setFamily("Times New Roman")font.setPointSize(10)font.setBold(True)font.setWeight(75)self.checkBox2.setFont(font)self.checkBox2.setObjectName("checkBox2")self.stackedWidget.addWidget(self.page_2)self.label = QtWidgets.QLabel(self.centralwidget)self.label.setGeometry(QtCore.QRect(330, 10, 141, 41))font = QtGui.QFont()font.setFamily("宋體")font.setPointSize(12)self.label.setFont(font)self.label.setObjectName("label")MainWindow.setCentralWidget(self.centralwidget)self.menubar = QtWidgets.QMenuBar(MainWindow)self.menubar.setGeometry(QtCore.QRect(0, 0, 798, 26))self.menubar.setObjectName("menubar")self.menu = QtWidgets.QMenu(self.menubar)self.menu.setObjectName("menu")MainWindow.setMenuBar(self.menubar)self.statusbar = QtWidgets.QStatusBar(MainWindow)self.statusbar.setObjectName("statusbar")MainWindow.setStatusBar(self.statusbar)self.action_1 = QtWidgets.QAction(MainWindow)self.action_1.setObjectName("action_1")self.action_2 = QtWidgets.QAction(MainWindow)self.action_2.setObjectName("action_2")self.menu.addAction(self.action_1)self.menu.addAction(self.action_2)self.menubar.addAction(self.menu.menuAction())self.retranslateUi(MainWindow)self.stackedWidget.setCurrentIndex(0)QtCore.QMetaObject.connectSlotsByName(MainWindow)def retranslateUi(self, MainWindow):_translate = QtCore.QCoreApplication.translateMainWindow.setWindowTitle(_translate("MainWindow", "MainWindow"))self.checkBox1.setText(_translate("MainWindow", "test1"))self.pushButton1.setText(_translate("MainWindow", "界面1"))self.pushButton2.setText(_translate("MainWindow", "界面2"))self.checkBox2.setText(_translate("MainWindow", "test2"))self.label.setText(_translate("MainWindow", "多界面切換測試"))self.menu.setTitle(_translate("MainWindow", "選擇"))self.action_1.setText(_translate("MainWindow", "界面1"))self.action_2.setText(_translate("MainWindow", "界面2"))
下面是實現通過菜單欄進行切換的核心代碼,此處僅作一個示例。?
from PyQt5 import QtWidgetsfrom Switch import Ui_MainWindowclass SwichWindow(QtWidgets.QMainWindow, Ui_MainWindow):def __init__(self):super().__init__()self.setupUi(self)self.action_1.triggered.connect(self.showinterface_1)self.action_2.triggered.connect(self.showinterface_2)def showinterface_1(self):self.stackedWidget.setCurrentIndex(0)def showinterface_2(self):self.stackedWidget.setCurrentIndex(1)if __name__ == "__main__":import sysapp = QtWidgets.QApplication(sys.argv)window = SwichWindow()window.show()sys.exit(app.exec_())
其實,這里應該是可以直接通過槽信號連接的,但我實在是有段時間沒有接觸了,況且使用代碼也比較容易。?
演示效果
如果覺得這個框有點礙眼,可以將其調回無框的狀態。?