关于tabbar的奇怪事情..帮我解决

Question

我刚开始学习 pyqt。当我尝试使用 tabbar 时，我遇到了这个。作为一个最小的例子，我想在 tab1 中显示一个按钮，在 tab2 中显示一个标签。这就是我所做的

from PyQt4 import QtGui    
class Ui_TabWidget(QtGui.QTabWidget):        
    def __init__(self,parent=None):
        QtGui.QTabWidget.__init__(self,parent)

        self.setObjectName("TabWidget")
        self.resize(400, 300)
        self.setWindowTitle(QtGui.QApplication.translate("TabWidget", "TabWidget", None, QtGui.QApplication.UnicodeUTF8))

        #Creating the tabbar
        self.tabBar=QtGui.QTabBar(self)

        #Adding the first tab
        self.tabBar.addTab("tab1")
        self.tabBar.setTabText(0,"TAB1")

        #The widget intended for tab1
        self.widgetforTab1=QtGui.QWidget()
        self.addTab(self.widgetforTab1,"")
        self.buttonForTab1=QtGui.QPushButton(self.widgetforTab1)
        self.buttonForTab1.setText("Button in Tab1")

        #Adding the second Tab
        self.tabBar.addTab("tab2")
        self.tabBar.setTabText(1,"TAB2")

        #The widget intended for tab2
        self.widgetForTab2=QtGui.QWidget()
        self.addTab(self.widgetForTab2,"")
        self.labelForTab2=QtGui.QLabel(self.widgetForTab2)
        self.labelForTab2.setText("Label in Tab2")

        #Adding the tabbar to the tabwidget
        self.setTabBar(self.tabBar)

        self.tabBar.setMovable(True)
        self.setCurrentIndex(0)

if __name__ == "__main__":
    import sys
    app = QtGui.QApplication(sys.argv)
    ui = Ui_TabWidget()
    ui.show()
    sys.exit(app.exec_())

在上述程序中，用于 tab1 和 tab2 的小部件运行良好。无论如何，我看不到小部件和标签栏之间的连接。标签栏标签是独立创建的，因此标签小部件标签。两者都有标签标题，仅显示标签栏的标题。但是如果我将索引设置为 o，则第一个标签与 widgetForTab1 一起显示。

在我的第二个程序中，小部件和标签栏之间缺乏耦合是问题的原因..

from PyQt4 import QtGui    
class Ui_TabWidget(QtGui.QTabWidget):
    def __init__(self,parent=None):
        QtGui.QTabWidget.__init__(self,parent)

        self.setObjectName("TabWidget")
        self.resize(400, 300)
        self.setWindowTitle(QtGui.QApplication.translate("TabWidget", "TabWidget", None, QtGui.QApplication.UnicodeUTF8))

        #Creating the tabbar
        self.tabBar=QtGui.QTabBar(self)

        #Adding the first tab
        self.tabBar.addTab("tab1")
        self.tabBar.setTabText(0,"TAB1")

        #Adding the second Tab
        self.tabBar.addTab("tab2")
        self.tabBar.setTabText(1,"TAB2")

        self.tabBar.setMovable(True)
        #Adding the tabbar to the tabwidget
        self.setTabBar(self.tabBar)

        #The widget intended for tab1
        self.widgetforTab1=QtGui.QWidget()
        self.addTab(self.widgetforTab1,"")
        self.buttonForTab1=QtGui.QPushButton(self.widgetforTab1)
        self.buttonForTab1.setText("Button in Tab1")

        #The widget intended for tab2
        self.widgetForTab2=QtGui.QWidget()
        self.addTab(self.widgetForTab2,"")
        self.labelForTab2=QtGui.QLabel(self.widgetForTab2)
        self.labelForTab2.setText("Label in Tab2")

        self.setCurrentIndex(0)

if __name__ == "__main__":
    import sys
    app = QtGui.QApplication(sys.argv)
    ui = Ui_TabWidget()
    ui.show()
    sys.exit(app.exec_())

第二个程序的输出太糟糕了。我得到了四个，前两个选项卡没有选项卡文本，选项卡在 Tab1 中有 Button，Tab2 中有标签，Tab2 中有标签，Tab2 中有标签。你能告诉我为什么会这样？？？我该怎么解决这个问题？？？

Answer 1

我知道这个问题被问到已经有一段时间了，但我注意到您对上一个答案的回答是您需要能够使用样式表自定义选项卡。这在使用 QTabWidget 时也是可能的！由于所有的 QWidget 都有setStyleSheet()，并且 QTabWidget 在底层使用 QTabBar，因此您几乎可以使用开箱即用的相同样式表。例如，这是我用来更改基于 PyQt/PySide 的 Web 浏览器中选项卡外观的样式表，它使用 QTabWidget：

QTabWidget::tab-bar {
    left: 2px; /* move to the right by 2px */
}

/* Style the tab using the tab sub-control. Note that
 * it reads QTabBar _not_ QTabWidget
 */
QTabBar::tab {
    min-width: 24px;
    max-width: 280px;
    padding: 2px 5px;
    font-size: .85em;
}

QTabBar::tab:!selected {
    margin-top: 2px; /* make non-selected tabs look smaller */
}

/* make use of negative margins for overlapping tabs */
QTabBar::tab:selected {
    /* expand/overlap to the left and right by 4px */
    margin-left: -2px;
    margin-right: -2px;
}

QTabBar::tab:first:selected {
    /* first selected tab has nothing to overlap with on the left */
    margin-left: 0;
}

QTabBar::tab:last:selected {
    /* last selected tab has nothing to overlap with on the right */
    margin-right: 0;
}

QTabBar::tab:only-one {
    /* if there is only one tab, we don't want overlapping margins */
    margin-left: 0;
    margin-right: 0;
}

样式表本身肯定需要一些调整，但它确实展示了将样式应用于 QTabWidget 时的可能性。您还可以查看官方 Qt 样式表示例页面上的 QTabBar and QTabWidget section。

Answer 2

完成您在这里尝试的最佳方法是使用QTabWidget。它比QTabBar 方便得多，并且会在 99.99% 的时间里做你想做的一切。

这是使用 QTabWidget 的典型示例：

from PyQt4.QtCore import *
from PyQt4.QtGui import *


class AppForm(QMainWindow):
    def __init__(self, parent=None):
        QMainWindow.__init__(self, parent)

        self.create_main_frame()       

    def create_main_frame(self):        
        tabs = QTabWidget()

        # Create first page
        page1 = QWidget()
        button1 = QPushButton('joy', page1)
        vbox1 = QVBoxLayout()
        vbox1.addWidget(button1)
        page1.setLayout(vbox1)

        # Create second page
        page2 = QWidget()
        label2 = QLabel('here I am')
        button2 = QPushButton('button on second page', page1)
        vbox2 = QVBoxLayout()
        vbox2.addWidget(label2)
        vbox2.addWidget(button2)
        page2.setLayout(vbox2)

        tabs.addTab(page1, 'First page')
        tabs.addTab(page2, 'Second page')

        self.setCentralWidget(tabs)



if __name__ == "__main__":
    import sys
    app = QApplication(sys.argv)
    form = AppForm()
    form.show()
    app.exec_()