How do I style a Qt Widget not its children with stylesheets?

Question

I have a:

class Box : public QWidget

and it has

this->setLayout(new QGridLayout(this));

I tried doing:

this->setStyleSheet( "border-radius: 5px; "
                     "border: 1px solid black;"
                     "border: 2px groove gray;"
                     "background-color:blue;");

this->setStyleSheet( "QGridLayout{"
                         "background-color:blue;"
                         "border-radius: 5px; "
                         "border: 1px solid black;"
                         "border: 2px groove gray;"
                     "}"
                   );

this->setObjectName(QString("Box"));
this->setStyleSheet( "QWidget#Box {"
                         "background-color:blue;"
                         "border-radius: 5px; "
                         "border: 1px solid black;"
                         "border: 2px groove gray;"
                     "}"
                   );

but the first affects only the items that are added, the other two do nothing. I want the box itself to have rounded corners and a border (bonus for how to do lines between rows).

How do I get the stylesheet to affect the Box widget, not its children?

score 19 · Accepted Answer · edited May 23 '17 at 12:02

19

To be more precise I could have used:

QWidget#idName {
    border: 1px solid grey;
}

or

Box {
    border: 1px solid grey;
}

The latter is easier, in my opinion, as it doesn't require the use of id names.

The main problem with why these weren't working though is because this is considered a custom widget and therefore needs a custom paint event:

 void Box::paintEvent(QPaintEvent *) {
     QStyleOption opt;
     opt.init(this);
     QPainter p(this);
     style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this);
 }

This was taken from: Qt Stylesheet for custom widget

edited May 23 '17 at 12:02

Community

1
1

answered Aug 24 '12 at 22:33

chacham15

13,719
26
104
207

7

It's not because the widget is a custom widget, but because it inherits from the base `QWidget` class whose `paintEvent` function doesn't do anything. If you inherited from `QFrame` instead, you would already have a working `paintEvent` function. – alexisdm Aug 26 '12 at 03:16

score 8 · Answer 2 · edited May 23 '17 at 10:30

8

You need to identify the object class and instance, like in regular CSS.

QWidget#BoxName
{
    border-radius: 5px;
    border: 1px solid black;
    border: 2px groove gray;
}

This is the same answer as here: Get variable name of Qt Widget (for use in Stylesheet)?

box->setStyleSheet(QString::fromUtf8("QWidget#box\n"
"{\n"
"    border-radius: 5px;\n"
"    border: 1px solid black;\n"
"    border: 2px groove gray;\n"
"}\n"
""));

edited May 23 '17 at 10:30

Community

1
1

answered Aug 24 '12 at 20:48

Ben

885
1
12
25

That's the name you've given to your instance of Box; within the constructor you could use `objectName()` e.g.: this->setStyleSheet(sprintf("QWidget#%s ..." % this->objectName())) – Ben Aug 24 '12 at 21:04
I understood how to get the name, it just isnt working. see question. – chacham15 Aug 24 '12 at 21:11
Looks like you missed a quote: `"QWidget#Box {"`. This is the right approach, as for the specific syntax you will have to figure this out as i use QT with Python, not C. – Ben Aug 24 '12 at 21:16
Try it in the QT Designer, it works for me. You should be able to copy the code from there; i have added mine to the answer. – Ben Aug 24 '12 at 21:19

score 0 · Answer 3 · answered Jan 14 '22 at 03:23

you can write your custom setStylesheet function, Make the object address as object name by default. for example in python:

from PySide2 import QtWidgets


class MyWidget(QtWidgets.QFrame):
    def setStylesheetOnlySelf(self, stylesheet: str) -> None:
        objectName = self.objectName() if self.objectName() != "" else str(id(self))
        self.setObjectName(objectName)
        self.setStyleSheet("#%s {%s}" % (objectName, stylesheet))


app = QtWidgets.QApplication()

widget = MyWidget()
widget.setStylesheetOnlySelf("background: white")
widget.show()
app.exec_()

How do I style a Qt Widget not its children with stylesheets?

3 Answers3

Linked

Related