Change Background Color specific QSplitter Child

Question

I am using Qt Creator 4.13.1 with Qt 5.15.1 on Windows 10 Pro.

I am new to using Stylesheets in Qt and a bit confused of the possible selectors considering QSplitter and its child. I want to have 2 childs separated by a splitter-handle and draw their backgrounds in different colors.

This is an example szenario

QSplitter* splitter = new QSplitter();

QWidget* widgetA = new QWidget();
// add a layout with some further child widgets
QWidget* widgetB = new QWidget();
// add a layout with some further child widgets

splitter->addWidget(widgetA);
splitter->addWidget(widgetB);

layout()->addWidget(splitter);

where I tried:

• widgetA->setStyleSheet("background-color: #ff0000;"); which applies to all child widgets of widgetA (e.g. QLabels, QPushButtons, ...) , but not to their surrounding widgetA itself
• splitter->setStyleSheet("background-color: #ff0000;"); applies to the widgetA, widgetB and the handle and all widgets below widgetA and widgetB
• naming widgetA->setObjectName("Tim"); and splitter->setStyleSheet("QWidget#Tim {background-color: #ff0000;}"); which has no effect at all.
• [EDIT] splitter->setStyleSheet("QSplitter QWidget #Andy {background-color: #ff0000;}"); applies the background only to a certain widget inside either child widget. But using splitter->setStyleSheet("QSplitter #Tim {background-color: #ff0000;}"); has (again) no effect at all.

How would I set the background-color of widgetA separately, so without affecting the childs of widgetA or the other splitter child widgetB?

Answer 1

I don't see any problems with using widget->setStyleSheet() in your case. Here, I have tested your implementation of setObjectName():

Application::Application(QWidget *parent) :
    QWidget(parent)
{
    //set a base layout for the parent of splitter
    QHBoxLayout *boxLayout = new QHBoxLayout(this);
    this->setLayout(boxLayout);
    //allocate splitter with parent
    QSplitter* splitter = new QSplitter(this);

    QWidget* widgetA = new QWidget();
    widgetA->setObjectName("widgetA");
    widgetA->setLayout(new QVBoxLayout());
    //example buttons as child for widgetA
    QPushButton *p = new QPushButton("0",widgetA);
    widgetA->layout()->addWidget(p);
    p = new QPushButton("1",widgetA);
    widgetA->layout()->addWidget(p);
    p = new QPushButton("2",widgetA);
    widgetA->layout()->addWidget(p);
    p = new QPushButton("3",widgetA);
    widgetA->layout()->addWidget(p);
    //widgetB, all similar to widgetA
    QWidget* widgetB = new QWidget();
    widgetB->setObjectName("widgetB");
    widgetB->setLayout(new QVBoxLayout());
    widgetA->setStyleSheet("QWidget#widgetA{background-color: #ff0000;}");
    widgetB->setStyleSheet("QWidget#widgetB{background-color: #00ff00;}");
    p = new QPushButton("1",widgetB);
    widgetB->layout()->addWidget(p);
    p = new QPushButton("2",widgetB);
    widgetB->layout()->addWidget(p);
    p = new QPushButton("3",widgetB);
    widgetB->layout()->addWidget(p);
    
    //add both widgets to splitter
    splitter->addWidget(widgetA);
    splitter->addWidget(widgetB);

    //add splitter to base layout
    this->layout()->addWidget(splitter);
}

Output