如何在不改变QWidget的情况下使用样式表定义选项卡背景？

Question

我希望制作一个非常基本的GUI：选项卡，文本区域。

但我想给我的选项卡着色，并使它们在MAC、Windows和Linux上始终保持相同的外观。

因此，我尝试使用样式表：

QTabWidget::pane
{
    border-top: 2px solid #1B1B1B;
    background-color: #262626;
}

QTabWidget::tab-bar
{
    left: 5px;
    alignment: left;
    background: #3E3E3E;
}

QTabBar::tab
{
    background: transparent;
    color: #757575;
    padding: 15px 5px 15px 5px;
}

QTabBar::tab:hover
{
    text-decoration: underline;
}

QTabBar::tab:selected
{
    color: #DEF600;
    background: qlineargradient( x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #262626, stop: 1.0 #3D3D3D );
}

即使选项卡看起来很好，仍然存在一个问题：选项卡窗格仍然是透明的...... 我可以通过添加以下内容来强制设置背景颜色：

QWidget
{
    background-color: #262626;
}

但是，正如您所知，这会更改所有小部件的背景颜色，甚至是我仍然希望拥有白色背景的QPlainTextEdit。而且更烦人的是，这会重置操作系统的皮肤并显示丑陋的滚动条（我真的想保持它们原来的样子）。

有没有一种方法可以更改选项卡窗格的背景，而无需重新设计所有组件？

- MARTIN Damien

Answer 1

我也遇到了同样的问题。这个方法可以解决：

QTabWidget::pane > QWidget {
    background-color: #262626;
}

- Ruan

---

我在全球范围内搜索如何正确设置QTabWidget的背景颜色，而这篇文章就是让我找到了答案。这应该被标记为正确答案。 - Stanton

终于有一个有用的答案了，它应该被更加突出地展示！ - CybeX

这也会改变所有子小部件的背景颜色。我用 QTabBar { background-color: #262626; } 取得了更多成功。 - elsamuko

在我的情况下，这是唯一有效的解决方法，谢谢！ - Oka

Answer 2

试一下这个。

QTabWidget::pane {
    background: red;
}

你可以阅读这篇文章了解详情。还有一件事需要注意，你可以使用QObject::objectName()作为样式表的id选择器。例如，

QTabWidget#myTab { ... }

希望这能有所帮助。

- Joonhwan

---

在QTabWidget :: pane上更改背景颜色对我不起作用。看起来背景仍然是透明的。目前，我通过设置QMainWindow的背景颜色来解决这个问题（这对我有效，但在一般情况下不是解决方案）。 - MARTIN Damien

QWidget的样式具有层次结构。在继续之前，首先创建一个简单的应用程序，仅配置QTabWidget :: pane样式以测试其是否有效。然后，我相信您可以逐个添加其他样式，直到出现问题为止。 - Joonhwan

Answer 3

可以简单地通过以下方式实现：

* {background: green;}

这个样式为这个小部件及其所有子元素设置了背景，因此您需要知道一件重要的事情。您认为是QTabWidget的区域实际上是QWidget，它被设置在QTabWidget内部。您可以通过将其添加到样式中轻松检查QTabWidget和其子元素的位置。

QTabWidget::pane {background: green; padding: 10px;}

绿色区域是一个QTabWidget，所有内部内容都被QTabWidgets的子元素（使用addTab()函数添加的任何QWidget）覆盖。

- NRUB

Answer 4

尝试使用以下代码启用文档模式：

myTab->setDocumentMode(true);

当其他方法都失败时，这个方法对我很有效。您可以在代码中执行此操作，也可以在qtcreator中调整属性。

您可能仍需要对窗格应用一些样式，例如：

QTabWidget:pane{
background: red;
}

想要了解更多，请查看文档。

- Mr. Developerdude

Answer 5

添加样式

 "background-color:rgb(255,255,255)"    

到每个选项卡。

- Al2O3

---

这个可以实现，但我想改变面板的背景颜色（即没有选项卡的地方）。在Qt中，QTabWidget::pane仍未使用background-color，因此即使我的选项卡有一个漂亮的背景，没有选项卡的空间仍将保持透明。 - MARTIN Damien

Answer 6

参考这个链接： http://doc.qt.digia.com/qt/stylesheet-syntax.html 在选择器类型下阅读ID选择器。您可以指定仅针对给定对象名称应用某种样式。因此，您可以使用您为tabWidget指定的任何名称。

- warunanc

---

或者你可以简单地设置QTabBar {background-color: #fff;}这将为没有选项卡的区域设置颜色。 - warunanc