'Why setStyleSheet works strangely in different places in the code?

I found that my styles for the child widget weren't working. Code:

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    this->setStyleSheet("* { background-color: white; }");

    QVBoxLayout* vLayout = new QVBoxLayout();
    for(int i = 0; i < 30; ++i) {
        QPushButton * btn = new QPushButton(tr("word %1").arg(i));
        btn->setStyleSheet("background-color: gray;");
        vLayout->addWidget(btn);
    }
    QWidget* widget= new QWidget;
    widget->setLayout(vLayout);

    QScrollArea* techScroll = new QScrollArea();
    techScroll->setParent(this);
    techScroll->setStyleSheet("QScrollArea { border: none; background-color: transparent; }"
                          "QScrollBar:vertical {  border: none; background-color: transparent; width: 5px;}"
                          "QScrollBar::horizontal { border: none; background-color: transparent; height: 5px; }"
                          "QScrollBar::add-line, QScrollBar::sub-line { border: none; width: 0px; height: 0px; }"
                          "QScrollBar::add-page, QScrollBar::sub-page { background-color: transparent; }"
                          "QScrollBar::handle { background-color: #C4C4C4; border-radius: 2px; }"
    );
    techScroll->setWidgetResizable(true);
    techScroll->setWidget(widget);
    techScroll->move(50, 50);
    techScroll->setFixedWidth(300);
    techScroll->setFixedHeight(400);
}

enter image description here

It turned out that you need to write setParent function after pasting styles of child widget. Code:

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    this->setStyleSheet("* { background-color: white; }");

    QVBoxLayout* vLayout = new QVBoxLayout();
    for(int i = 0; i < 30; ++i) {
        QPushButton * btn = new QPushButton(tr("word %1").arg(i));
        btn->setStyleSheet("background-color: gray;");
        vLayout->addWidget(btn);
    }
    QWidget* widget= new QWidget;
    widget->setLayout(vLayout);

    QScrollArea* techScroll = new QScrollArea();
    techScroll->setStyleSheet("QScrollArea { border: none; background-color: transparent; }"
                          "QScrollBar:vertical {  border: none; background-color: transparent; width: 5px;}"
                          "QScrollBar::horizontal { border: none; background-color: transparent; height: 5px; }"
                          "QScrollBar::add-line, QScrollBar::sub-line { border: none; width: 0px; height: 0px; }"
                          "QScrollBar::add-page, QScrollBar::sub-page { background-color: transparent; }"
                          "QScrollBar::handle { background-color: #C4C4C4; border-radius: 2px; }"
    );
    techScroll->setParent(this); // moved here
    techScroll->setWidgetResizable(true);
    techScroll->setWidget(widget);
    techScroll->move(50, 50);
    techScroll->setFixedWidth(300);
    techScroll->setFixedHeight(400);
}

enter image description here

Is this a bug or is this design and i'm not understanding something?

Qt version 5.15.2

qtqt5


Solution 1:[1]

Probably It is intended to work like that. Like any QWidget, QScrollArea snaps to the parent widget, so either you set the parent widget or you just pass this as input parameter, like:

new QScrollArea(this);

The issue may be due to the fact that stylesheet rendering is tricky.

Anyway, I can't stress this enough: rather use the ui designer than writing manually your ui code.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Giancarlo

Related Questions