前言

本節(jié)我們使用QT Designer.exe設(shè)計(jì)stackedWidget實(shí)現(xiàn)導(dǎo)航功能。

成都創(chuàng)新互聯(lián)堅(jiān)信：善待客戶，將會(huì)成為終身客戶。我們能堅(jiān)持多年，是因?yàn)槲覀円恢笨芍档眯刨?。我們從不忽悠初訪客戶，我們用心做好本職工作，不忘初心，方得始終。10年網(wǎng)站建設(shè)經(jīng)驗(yàn)成都創(chuàng)新互聯(lián)是成都老牌網(wǎng)站營(yíng)銷服務(wù)商,為您提供成都做網(wǎng)站、網(wǎng)站建設(shè)、網(wǎng)站設(shè)計(jì)、H5響應(yīng)式網(wǎng)站、網(wǎng)站制作、品牌網(wǎng)站設(shè)計(jì)、小程序制作服務(wù),給眾多知名企業(yè)提供過(guò)好品質(zhì)的建站服務(wù)。

一、基礎(chǔ)知識(shí)

1. QStackedWidget簡(jiǎn)介

QStackedWidget，叫做堆載窗口控件，可以添加多個(gè)page,每個(gè)page顯示不同的內(nèi)容，頁(yè)面中使用這個(gè)功能，可以再共同一區(qū)域在不同條件下顯示不同內(nèi)容，方便開(kāi)發(fā)使用，關(guān)于API本文不做過(guò)多介紹，我們使用QT設(shè)計(jì)師來(lái)設(shè)計(jì)StackedWdiget，只需要了解調(diào)用QStackedWidget.setCurrentindex(index)可以顯示不同的頁(yè)面即可。

二、實(shí)例

1. QT Designer設(shè)計(jì)UI

打開(kāi)designer.exe,使用默認(rèn)的Main Window創(chuàng)建，直接點(diǎn)擊Create按鈕即可

設(shè)計(jì)UI圖如下，并保存為stackWidget.ui

設(shè)置頁(yè)面1

設(shè)置頁(yè)面2，點(diǎn)擊Object Inspector中page2頁(yè)面，再設(shè)計(jì)框中增加一個(gè)label

切換到page2頁(yè)面，點(diǎn)解insert Page/After Current Page

2 將stack.ui轉(zhuǎn)換為ui_stack.py

進(jìn)入ui_stack.py目錄，輸入pyuic5 -o ui_stack.py stack.ui

3 編寫(xiě)python程序

#?encoding=utf-8
import?sys
import?PyQt5.QtWidgets?as?qw
import?ui_stack
class?myForm(qw.QWidget,?ui_stack.Ui_Form):
????def?__init__(self):
????????super().__init__()
????????self.setupUi(self)
????????self.pushButton1.clicked.connect(self.btn1_fun)
????????self.pushButton2.clicked.connect(self.btn2_fun)
????????self.pushButton3.clicked.connect(self.btn3_fun)
????def?btn1_fun(self):
????????self.stackedWidget.setCurrentIndex(0)
????def?btn2_fun(self):
????????self.stackedWidget.setCurrentIndex(1)
????def?btn3_fun(self):
????????self.stackedWidget.setCurrentIndex(2)
if?__name__?==?'__main__':
????app?=?qw.QApplication(sys.argv)
????w?=?myForm()
????w.show()
????sys.exit(app.exec_())

首先再Q(mào)T設(shè)計(jì)師中設(shè)計(jì)頁(yè)面，左邊是導(dǎo)航欄，再listWidget中放置三個(gè)按鈕，分別是測(cè)試項(xiàng)1，測(cè)試項(xiàng)2，測(cè)試項(xiàng)3。右邊是stackedWidget，在其中設(shè)計(jì)3個(gè)頁(yè)面，放置三個(gè)label，內(nèi)容分別是“我是測(cè)試項(xiàng)一”，“我是測(cè)試項(xiàng)二”， “我是測(cè)試項(xiàng)三”，然后導(dǎo)出成ui_stack.py文件，編寫(xiě)代碼為listWidget中的按鈕添加槽函數(shù)，在槽函數(shù)中切換到對(duì)應(yīng)的頁(yè)面，使用stackedWidget.setCurrentindex(index)即可。

三、運(yùn)行

進(jìn)入文件目錄，輸入python3 run.py,即可彈出上述用QT Designer設(shè)計(jì)出來(lái)的頁(yè)面，stckedWidget中默認(rèn)顯示第一個(gè)頁(yè)面。

點(diǎn)擊按鈕測(cè)試項(xiàng)2，結(jié)果如下圖

點(diǎn)擊按鈕測(cè)試項(xiàng)3，結(jié)果如下圖

四、結(jié)語(yǔ)

如您在使用過(guò)程中有任何問(wèn)題，請(qǐng)加QQ群進(jìn)一步交流,也可以github提Issue。

QQ交流群：906015840 (備注：物聯(lián)網(wǎng)項(xiàng)目交流)

獲取源碼：關(guān)注公眾號(hào)，回復(fù)pyqt5即可

一葉孤沙出品：一沙一世界，一葉一菩提