Solved How to make ToolButton icon grayscale?
-
I have a QML app with a ToolBar with ToolButtons with images, for example, a ToolButton that loads something is defined in QML in this way:
ToolButton { contentItem: Image { source: "Icons/load.png" } enabled: scene.loadEnabled onClicked: loadDialog.open() }
and I am looking for a sample code that automatically makes the icon grayscale when the ToolButton is disabled.
Should I manually implement the algorithm that makes the image graysacle and bind Image.source to a property returning the resulting image or there is a better way?
-
You can do it with
Desaturate
:import QtGraphicalEffects 1.0 ... contentItem: Image { source: "Icons/load.png" layer.enabled: true layer.effect: Desaturate { desaturation: parent.enabled ? 0 : 1 Behavior on desaturation { NumberAnimation { easing.type: Easing.InOutQuad } } } }