将背景颜色限制为 QTabBar 上的三角形选项卡

Question

我使用 Qt Designer 设置了一个 QTabWidget，并为 tabShape 选择了 "Triangular" 选项卡而不是 "Rounded" 选项卡。我希望未选中的选项卡为绿色。我之前的一个问题的答案 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtabwidget-and-qtabbar 为我提供了解决方案。但是，背景色超出了三角形标签的形状，如下所示：

上网查了一下，找到了这个，正是我想要的：

我将如何修改以下代码以将颜色保持在三角形选项卡的边框内？

self.ui.tabWidget.setStyleSheet(self.ui.tabWidget.styleSheet()
                                            + 'QTabBar::tab:!selected:hover {'
                                              ' border: 2px solid #1e90ff;'
                                              ' background-color: green; }' )

Answer 1

试一试：

import sys
from PyQt5 import QtCore, QtGui, QtWidgets


class Ui_MainWindow(object):
    def setupUi(self, MainWindow):
        MainWindow.setObjectName("MainWindow")
        MainWindow.resize(440, 400)
        self.centralwidget = QtWidgets.QWidget(MainWindow)
        self.centralwidget.setObjectName("centralwidget")
        self.verticalLayout = QtWidgets.QVBoxLayout(self.centralwidget)
        self.verticalLayout.setObjectName("verticalLayout")
        self.qtabwidget = QtWidgets.QTabWidget(self.centralwidget)
        self.qtabwidget.setObjectName("qtabwidget")
        self.tab = QtWidgets.QWidget()
        self.tab.setObjectName("tab")
        self.qtabwidget.addTab(self.tab, "")
        self.tab_2 = QtWidgets.QWidget()
        self.tab_2.setObjectName("tab_2")
        self.qtabwidget.addTab(self.tab_2, "")
        self.verticalLayout.addWidget(self.qtabwidget)
        MainWindow.setCentralWidget(self.centralwidget)

        self.retranslateUi(MainWindow)
        self.qtabwidget.setCurrentIndex(0)
        QtCore.QMetaObject.connectSlotsByName(MainWindow)

    def retranslateUi(self, MainWindow):
        _translate = QtCore.QCoreApplication.translate
        MainWindow.setWindowTitle(_translate("MainWindow", "Change the shape of the tabs of a QTabWidget"))
        self.qtabwidget.setTabText(self.qtabwidget.indexOf(self.tab), _translate("MainWindow", "Tab 1"))
        self.qtabwidget.setTabText(self.qtabwidget.indexOf(self.tab_2), _translate("MainWindow", "Tab 2"))


class Window(QtWidgets.QMainWindow, Ui_MainWindow):
    def __init__(self):
        super().__init__()
        self.setupUi(self)

        self.tab_3 = QtWidgets.QWidget()
        self.tab_3.setObjectName("tab_3")
        self.qtabwidget.addTab(self.tab_3, "Tab 3")

        # changes the shape of the tabs of the QTabWidget
        tab_shape = QtWidgets.QTabWidget.Triangular
        self.qtabwidget.setTabShape(tab_shape)


StyleSheet = '''
QTabWidget {
    background-color: green;
}
QTabWidget::pane {
    border: 1px solid #31363B;
    padding: 2px;
    margin:  0px;
}
QTabBar {
    border: 0px solid #31363B;
    color: yellow;
}
QTabBar::tab:top:selected {
    color: red;
}
'''


if __name__ == '__main__':
    app = QtWidgets.QApplication(sys.argv)
    app.setStyleSheet(StyleSheet)
    app.setFont(QtGui.QFont("Times", 12, QtGui.QFont.Bold))
    w = Window()
    w.show()
    sys.exit(app.exec_())

将背景颜色限制为 QTabBar 上的三角形选项卡

Confining background color to Triangular tab on QTabBar

python

pyqt

qtabbar

python-3.x

pyqt5