Appropriate method for creating widget classes specific for qcss classes?
-
I'm working on a dialog based application (not too many widgets on a single screen) and it needs to be stylesheet friendly so we can easily customize the look of the application e.g. dark themes etc.
Currently, during development, I'm just hard-coding style-sheet in designer but once all is done, it'll be better to have style-sheet at dialog/window level or better off application level.
The problem is that widgets don't have a way to specify style-sheet class i.e. the style sheet can be applied to QPushButton or button with a specific name. Does that mean that I have to create a new subclass for each style of Button? e.g. QRegularButton, QProminentButton etc and then use the appropriate classname in stylesheets? How do you work with subclassed controls in designer?
Any other way of accomplishing this?
-
Even better! Just found it in docs as well. Too bad the stylesheet documentation makes a passing reference to these important features. That's why I didn't really look into it initially, because I thought Property selector was only for pre-defined widget properties.
Someone should really update the documention and make these more clear to the readers (newbies to Qt).
-
Hi
Im not sure i understand.
A Stylesheet can target by name so you can style two QPushbuttons either the same or with different settings.
https://doc.qt.io/qt-5/stylesheet-syntax.html#selector-types
Is that not enough? -
Hi
Im not sure i understand.
A Stylesheet can target by name so you can style two QPushbuttons either the same or with different settings.
https://doc.qt.io/qt-5/stylesheet-syntax.html#selector-types
Is that not enough?@mrjj The problem is that of maintainability. The application will have numerous dialogs, the dialogs will have various types of texts (QLabel) e.g. Header, Instructions, warning etc, all of which will have different styling (size, color etc) applied. Similarly there are different button styles e.g. hyperlink button, normal button, warning button etc.
I could apply style to each one by name, but then I would need to copy style sheet to each dialog. If I make changes, then I have to update stylesheet in each class. This will result in loads of stylesheets for just one style/theme, not to mention easy way for bugs to creep in.
I'm looking for something similar to specifying css class for an element in html. The best way I can think of is by subclassing widgets that way I can have a QHeaderLabel and then have one global stylesheet entry targeting QHeaderLabel class. I'm wondering if that's possible, if there's a better solution and if there are any downsides to subclassing approach?
-
@mrjj The problem is that of maintainability. The application will have numerous dialogs, the dialogs will have various types of texts (QLabel) e.g. Header, Instructions, warning etc, all of which will have different styling (size, color etc) applied. Similarly there are different button styles e.g. hyperlink button, normal button, warning button etc.
I could apply style to each one by name, but then I would need to copy style sheet to each dialog. If I make changes, then I have to update stylesheet in each class. This will result in loads of stylesheets for just one style/theme, not to mention easy way for bugs to creep in.
I'm looking for something similar to specifying css class for an element in html. The best way I can think of is by subclassing widgets that way I can have a QHeaderLabel and then have one global stylesheet entry targeting QHeaderLabel class. I'm wondering if that's possible, if there's a better solution and if there are any downsides to subclassing approach?
@Taytoo
But you don't need to copy stylesheets around.
you assign it to QApplication (in main) and it will apply to all Widgets owned by it.
(including Dialogs)
The only issue i see if a button named the same in different dialogs, you want to style them differently.
But since you can use dynamic properties, you can tag it and use the tag in the stylesheet to have more than the name to
rely on. -
@Taytoo
But you don't need to copy stylesheets around.
you assign it to QApplication (in main) and it will apply to all Widgets owned by it.
(including Dialogs)
The only issue i see if a button named the same in different dialogs, you want to style them differently.
But since you can use dynamic properties, you can tag it and use the tag in the stylesheet to have more than the name to
rely on.But since you can use dynamic properties, you can tag it and use the tag in the stylesheet to have more than the name to
rely on.Perfect! That's what I was looking for, hours for work saved :)
For anyone interested: https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-using-dynamic-properties
-
But since you can use dynamic properties, you can tag it and use the tag in the stylesheet to have more than the name to
rely on.Perfect! That's what I was looking for, hours for work saved :)
For anyone interested: https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-using-dynamic-properties
@Taytoo
super.
and it does have some sort of class tag. (not sure how it works , saw it on forum)
if i add a dynmaic property (text) with the name class
like
and do this in style sheet.
.red {
color: red;
}it picks up the style.
I assume its a shorthand for the full property syntax.
-
Even better! Just found it in docs as well. Too bad the stylesheet documentation makes a passing reference to these important features. That's why I didn't really look into it initially, because I thought Property selector was only for pre-defined widget properties.
Someone should really update the documention and make these more clear to the readers (newbies to Qt).
-
Even better! Just found it in docs as well. Too bad the stylesheet documentation makes a passing reference to these important features. That's why I didn't really look into it initially, because I thought Property selector was only for pre-defined widget properties.
Someone should really update the documention and make these more clear to the readers (newbies to Qt).
