PyQt侧边导航栏的一种实现方式

文章简述:

想在PyQt中实现侧边导航栏,有两种思路:

一、在窗口左侧放置一个QListWidget作为导,在右侧放置QStackedWidget存放不同页面,将List的不同项目与不同页面绑定,起到切换的效果。具体可以参考这篇文章:PyQt:左侧选项卡

二、在左侧放置一个QWidget,摆上一排按钮,并与不同的页面绑定。本文重点讨论这种方法,所有源码请见文末(可直接运行)。

效果展示:

image

关键代码:

第一步,写主界面(QWidget),左侧界面(QWidget)和右侧界面(QStackedWidget):

#   设置主Layout
self.main_Layout = QtWidgets.QHBoxLayout()
self.setLayout(self.main_Layout)
#   设置左侧Widget
self.left_Widget = QtWidgets.QWidget()
self.left_Layout = QtWidgets.QVBoxLayout()
self.left_Widget.setLayout(self.left_Layout)
self.main_Layout.addWidget(self.left_Widget)
#   设置右侧Widget
self.right_Widget = QtWidgets.QStackedWidget()
self.main_Layout.addWidget(self.right_Widget)

第二步,新建3个按钮和3个界面:

#	三个按钮
self.btn1 = QtWidgets.QPushButton("界面1")
self.left_Layout.addWidget(self.btn1)

self.btn2 = QtWidgets.QPushButton("界面2")
self.left_Layout.addWidget(self.btn2)

self.btn3 = QtWidgets.QPushButton("界面3")
self.left_Layout.addWidget(self.btn3)
#	三个界面
self.win1 = QtWidgets.QWidget()
self.layout1 = QtWidgets.QGridLayout()
self.win1.setLayout(self.layout1)
self.lab1 = QtWidgets.QLabel("这是界面1")
self.layout1.addWidget(self.lab1)
self.right_Widget.addWidget(self.win1)

self.win2 = QtWidgets.QWidget()
self.layout2 = QtWidgets.QGridLayout()
self.win2.setLayout(self.layout2)
self.lab2 = QtWidgets.QLabel("这是界面2")
self.layout2.addWidget(self.lab2)
self.right_Widget.addWidget(self.win2)

self.win3 = QtWidgets.QWidget()
self.layout3 = QtWidgets.QGridLayout()
self.win3.setLayout(self.layout3)
self.lab3 = QtWidgets.QLabel("这是界面3")
self.layout3.addWidget(self.lab3)
self.right_Widget.addWidget(self.win3)

第三步,写一个槽函数sender,并将其与按钮绑定:

#	sender函数
def display(self):
    sender = self.sender()
    if sender.text() == "界面1":
        self.right_Widget.setCurrentIndex(0)
    if sender.text() == "界面2":
        self.right_Widget.setCurrentIndex(1)
    if sender.text() == "界面3":
        self.right_Widget.setCurrentIndex(2)
#	在适当的位置写上
self.btn1.clicked.connect(self.display)
self.btn2.clicked.connect(self.display)
self.btn3.clicked.connect(self.display)

第四步:如果想使当前页面对应的按钮保持选中状态,可以设置按钮.setCheckable(True),并在sender函数中逐个修改按钮.setChecked(),篇幅有限不作展示。

所有源码:
点击查看代码
import sys
import PyQt6.QtWidgets as QtWidgets

class MainWindow(QtWidgets.QWidget):
    def __init__(self):
        super().__init__()
        self.initUI()
        self.show()

    def initUI(self):
        #   设置主Layout
        self.main_Layout = QtWidgets.QHBoxLayout()
        self.setLayout(self.main_Layout)

        #   设置左侧Widget
        self.left_Widget = QtWidgets.QWidget()
        self.left_Layout = QtWidgets.QVBoxLayout()
        self.left_Widget.setLayout(self.left_Layout)
        self.main_Layout.addWidget(self.left_Widget)

        self.btn1 = QtWidgets.QPushButton("界面1")
        self.btn1.clicked.connect(self.display)
        self.left_Layout.addWidget(self.btn1)

        self.btn2 = QtWidgets.QPushButton("界面2")
        self.btn2.clicked.connect(self.display)
        self.left_Layout.addWidget(self.btn2)

        self.btn3 = QtWidgets.QPushButton("界面3")
        self.btn3.clicked.connect(self.display)
        self.left_Layout.addWidget(self.btn3)

        #   设置右侧Widget
        self.right_Widget = QtWidgets.QStackedWidget()
        self.main_Layout.addWidget(self.right_Widget)

        self.win1 = QtWidgets.QWidget()
        self.layout1 = QtWidgets.QGridLayout()
        self.win1.setLayout(self.layout1)
        self.lab1 = QtWidgets.QLabel("这是界面1")
        self.layout1.addWidget(self.lab1)
        self.right_Widget.addWidget(self.win1)

        self.win2 = QtWidgets.QWidget()
        self.layout2 = QtWidgets.QGridLayout()
        self.win2.setLayout(self.layout2)
        self.lab2 = QtWidgets.QLabel("这是界面2")
        self.layout2.addWidget(self.lab2)
        self.right_Widget.addWidget(self.win2)

        self.win3 = QtWidgets.QWidget()
        self.layout3 = QtWidgets.QGridLayout()
        self.win3.setLayout(self.layout3)
        self.lab3 = QtWidgets.QLabel("这是界面3")
        self.layout3.addWidget(self.lab3)
        self.right_Widget.addWidget(self.win3)

    def display(self):
        sender = self.sender()
        if sender.text() == "界面1":
            self.right_Widget.setCurrentIndex(0)
        if sender.text() == "界面2":
            self.right_Widget.setCurrentIndex(1)
        if sender.text() == "界面3":
            self.right_Widget.setCurrentIndex(2)

#   运行程序
if __name__ == "__main__":
    app = QtWidgets.QApplication(sys.argv)
    mainWindow = MainWindow()
    sys.exit(app.exec())
posted @ 2024-02-23 18:35  牦牛儿的苗  阅读(1264)  评论(0)    收藏  举报