How to use Universal.System or Material.System in latest Qt 5.8?

1.2k Views Asked by At

I'm playing around with Qt 5.8 RC and the new attribute System introduced in both Universal and Material themes.

However when designing a customizable app, one can choose Universal or Material in combination with Dark, Light or System. How can I know that System is actually not the string "System" but either "Dark" or "Light"?

Here's what I'm trying to build (settings.qml): Miam-Player-QML

RadioButton {
    text: qsTr("Light")
    checked: appSettings.theme === "Light"
    ButtonGroup.group: modeBG
    onClicked: {
        appSettings.theme = "Light"
        appSettings.background = "white"
        appSettings.menuPaneColor = "#eeeeee"
    }
}
RadioButton {
    text: qsTr("Dark")
    checked: appSettings.theme === "Dark"
    ButtonGroup.group: modeBG
    onClicked: {
        appSettings.theme = "Dark"
        appSettings.background = "black"
        appSettings.menuPaneColor = "#171717"
    }
}
RadioButton {
    text: qsTr("System theme")
    ButtonGroup.group: modeBG
    onClicked: {
        appSettings.theme = "System"
        //appSettings.background = "black"
        //appSettings.menuPaneColor = "#171717"
    }
}

Obviously, the following code which used to work with "hard" values no longer works (main.qml):

ToolButton {
    id: burgerMenu
    checkable: appSettings.burgerMenuIsChecked
    contentItem: Image {
        fillMode: Image.Pad
        horizontalAlignment: Image.AlignHCenter
        verticalAlignment: Image.AlignVCenter
        source: "qrc:/images/" + appSettings.style + "/" + appSettings.theme + "/drawer.png"
    }
    ...
}

Any idea?

1

There are 1 best solutions below

7
Mitch On

The documentation says:

Setting the theme to System chooses either the light or dark theme based on the system theme colors. However, when reading the value of the theme property, the value is never System, but the actual theme.

So, if you check the values of Material.theme and Universal.theme, both should return their effective values, rather than the value that you set.