Qt read dynamic qproperties in stylesheets - c++

Question

I'm writing an application that contains widgets with different Qt-properties. One of these properties is a simple color-property:
Q_PROPERTY(QColor color GET color SET setColor NOTIFY colorChanged)
I would like to be able to access this property from within a stylesheet to change how the widget looks.
The stylesheet will be supplied by a user and cannot be dynamically created within the application.
I do not know what the user wants to make the application look like, but I want to give them the opportunity to set colors (and other properties) based on dynamic properties of the widget:
MyWidget {
border: 1px solid red;
background-color: <color property value>
}
In terms of color, according to the Qt documentation, the desired behaviour should be possible by accessing the widget's palette:
MyWidget {
border: 1px solid red;
background-color: palette(window);
}
However, as numerous people have already reported, this doesn't seem to be working as intended, since the stylesheet doesn't access the widget's own palette, but the application palette instead.
As mentioned in the Qt wiki, one can access dynamic properties by using either a selector for reading, or using qproperty- as a prefix for writing.
The stylesheet for writing a custom property looks like this:
MyWidget {
border: 1px solid red;
qproperty-color: red;
}
Reading a custom property using a property-selector looks like this:
MyWidget[color="red"] {
border: 1px solid red;
}
(note: i'm not sure if this selector would actually work, I haven't tried this with colors).
Now this would work for my case if I had a small set of possible colors.
However, my application computes a color dynamically, which would result in 2^24 (not counting alpha) colors.
Seeing that write access to properties can be obtained by using qproperty-color: <value>;, i'd have expected read access to be syntactically symmetrical:
MyWidget {
border: 1px solid red;
background-color: qproperty-color;
}
However, this doesn't work, hence me posting here.
Has anyone found any other way to access properties and using them in stylesheets to change the way widgets look without knowing the possible values beforehand?

Answer 1

I had a similar problem around a month back, and I also tried to solve it with StyleSheet but ultimately ditched the idea of using StyleSheet for QPalette.
Using StyleSheet to change the widget's look is a lot of work, especially if the widget is resizable. I would suggest using QPalette instead. However, with QPalette there is a catch: some styles, especially the default ones like window doesn't let you override all the properties of the palette of that style. I would suggest changing the default style of your application to fusion and using its palette in your application:
#include "mainWindow.h"
#include <QtWidgets/QApplication>
#include <QStyleFactory>
#include "start.h"
int main(int argc, char *argv[])
{
QApplication::setStyle(QStyleFactory::create("Fusion")); // Setting Fusion Style
QPalette light = QApplication::palette(); // Getting Fusion Style Palette
Start S(light); // Making Changes to the palette
QApplication A(argc, argv);
mainWindow W(&S, &A); // Passing the palette to main window so that you can change it dynamically
W.show();
return A.exec();
}
Using fusion style has many advantages:
Supports customization of almost all ColorGroup and ColorRole
Has a dark theme: FusionDarkTheme
Easier to maintain than StyleSheet
To be able to change the background of your widget you will also have to set it's autoFillBackground value to true otherwise its parent's background will override the widget's background. It's one of the reasons why you are unable to change the background color of your widget. You don't have to make the change individually for each widget, you can do it like this:
void mainWindow::setAutoBackgroundForWidget()
{
QList<QWidget *> widgets = this->findChildren<QWidget *>();
for(QWidget *wid : qAsConst(widgets))
{
QList<QByteArray> pro = wid->dynamicPropertyNames();
if(!pro.isEmpty())
{
for(QByteArray byt : qAsConst(pro))
{
if(byt == "Level")
{
wid->setAutoFillBackground(true);
}
}
}
}
}
The above function setAutoBackgroundForWidget() is a function created by me which I call before the end of the constructor of mainWindow. This function selects all widget, which has a dynamic property named "Level" to have its own background instead of using its parent's background. You can modify the above function accordingly to select the widgets that you need.
After you are done with the above, all that is left is to use QColorDialog to ask your users which color they need, copy the current palette and change the given ColorRole in it to the new color and apply the new palette to your widget using setPalette(). You can also do it in a single function inside your mainWindow cpp file for all your widget.
As for the StyleSheet, I can confirm that following works:
MyWidget[color="red"] {
border: 1px solid red;
}