You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

QStackedWidget切换箭头在PyQt5运行时消失,如何使其显示?

QStackedWidget切换箭头不显示的解决方法

嘿,我懂你遇到的问题了——Qt Designer里看到的QStackedWidget左右切换箭头只是设计模式下的辅助预览控件,实际运行程序时QStackedWidget本身并不会自带这些按钮,得咱们手动添加切换按钮并实现页面切换的逻辑才行!

我给你修改了代码,添加了左右切换按钮并绑定了切换逻辑,运行后就能看到和设计时类似的切换效果了:

# -*- coding: utf-8 -*-
from PyQt5 import QtCore, QtGui, QtWidgets

class Ui_Dialog(object):
    def setupUi(self, Dialog):
        Dialog.setObjectName("Dialog")
        Dialog.resize(314, 216)
        self.stackedWidget = QtWidgets.QStackedWidget(Dialog)
        self.stackedWidget.setGeometry(QtCore.QRect(40, 40, 211, 101))
        self.stackedWidget.setLayoutDirection(QtCore.Qt.LeftToRight)
        self.stackedWidget.setStyleSheet("selection-background-color: rgb(255, 255, 127);\n"
"background-color: rgb(154, 154, 154);\n"
"border-color: rgb(255, 0, 0);\n"
"selection-color: rgb(85, 255, 0);")
        self.stackedWidget.setFrameShape(QtWidgets.QFrame.Box)
        self.stackedWidget.setFrameShadow(QtWidgets.QFrame.Plain)
        self.stackedWidget.setLineWidth(1)
        self.stackedWidget.setMidLineWidth(2)
        self.stackedWidget.setObjectName("stackedWidget")
        self.page = QtWidgets.QWidget()
        self.page.setObjectName("page")
        self.lineEdit_2 = QtWidgets.QLineEdit(self.page)
        self.lineEdit_2.setGeometry(QtCore.QRect(80, 40, 113, 25))
        self.lineEdit_2.setMinimumSize(QtCore.QSize(113, 0))
        self.lineEdit_2.setStyleSheet("background-color: rgb(255, 255, 255);")
        self.lineEdit_2.setObjectName("lineEdit_2")
        self.label = QtWidgets.QLabel(self.page)
        self.label.setGeometry(QtCore.QRect(10, 40, 68, 19))
        self.label.setMinimumSize(QtCore.QSize(68, 0))
        self.label.setObjectName("label")
        self.stackedWidget.addWidget(self.page)
        self.page_2 = QtWidgets.QWidget()
        self.page_2.setObjectName("page_2")
        self.lineEdit = QtWidgets.QLineEdit(self.page_2)
        self.lineEdit.setGeometry(QtCore.QRect(80, 40, 113, 25))
        self.lineEdit.setMinimumSize(QtCore.QSize(113, 0))
        self.lineEdit.setStyleSheet("background-color: rgb(255, 255, 0);\n"
"border-color: rgb(0, 0, 255);")
        self.lineEdit.setObjectName("lineEdit")
        self.label_2 = QtWidgets.QLabel(self.page_2)
        self.label_2.setGeometry(QtCore.QRect(10, 40, 68, 19))
        self.label_2.setMinimumSize(QtCore.QSize(68, 0))
        self.label_2.setObjectName("label_2")
        self.stackedWidget.addWidget(self.page_2)

        # 添加左右切换按钮
        self.btn_prev = QtWidgets.QPushButton(Dialog)
        self.btn_prev.setGeometry(QtCore.QRect(10, 70, 25, 25))
        self.btn_prev.setText("<")
        self.btn_prev.clicked.connect(self.prev_page)

        self.btn_next = QtWidgets.QPushButton(Dialog)
        self.btn_next.setGeometry(QtCore.QRect(270, 70, 25, 25))
        self.btn_next.setText(">")
        self.btn_next.clicked.connect(self.next_page)

        self.retranslateUi(Dialog)
        self.stackedWidget.setCurrentIndex(0)
        QtCore.QMetaObject.connectSlotsByName(Dialog)

    def retranslateUi(self, Dialog):
        _translate = QtCore.QCoreApplication.translate
        Dialog.setWindowTitle(_translate("Dialog", "Dialog"))
        self.label.setText(_translate("Dialog", "I/P1 ="))
        self.label_2.setText(_translate("Dialog", "I/P2 ="))

    # 实现上一页切换逻辑
    def prev_page(self):
        current_index = self.stackedWidget.currentIndex()
        if current_index > 0:
            self.stackedWidget.setCurrentIndex(current_index - 1)

    # 实现下一页切换逻辑
    def next_page(self):
        current_index = self.stackedWidget.currentIndex()
        max_index = self.stackedWidget.count() - 1
        if current_index < max_index:
            self.stackedWidget.setCurrentIndex(current_index + 1)

if __name__ == "__main__":
    import sys
    app = QtWidgets.QApplication(sys.argv)
    Dialog = QtWidgets.QDialog()
    ui = Ui_Dialog()
    ui.setupUi(Dialog)
    Dialog.show()
    sys.exit(app.exec_())

修改的核心点:

  • 新增了两个QPushButton作为切换按钮,放置在StackedWidget的左右两侧,位置可以根据你的需求调整
  • 给按钮绑定了clicked信号,分别连接到自定义的prev_pagenext_page方法
  • 在切换方法里处理了边界判断,避免切换索引越界

运行修改后的代码,就能看到类似设计时的切换效果了:
QStackedWidget显示箭头的效果

内容的提问来源于stack exchange,提问作者Ahmet

火山引擎 最新活动