Solved QML - Gradient not working
-
I have created a dashboard for my project. In my first review I didn't add signal and slot, that time gradient worked properly. For example if I press the button color will appear on button. Now I have connected signals and slot but gradient not working.
Problem :
gradient: Gradient { GradientStop { position: 5 ; color: control.pressed ? "red" : "#eee" } GradientStop { position: 6 ; color: control.pressed ? "red" : "#ccc" } }
qrc.qml
Item { Example { id: example1; } Button { x:380 y:295 text: "Start" MouseArea { anchors.fill: parent onClicked: example1.startClicked() } style: ButtonStyle { background: Rectangle { implicitWidth: 100 implicitHeight: 40 border.width: control.activeFocus ? 1 : 2 border.color: "red" radius: 10 gradient: Gradient { GradientStop { position: 5 ; color: control.pressed ? "red" : "#eee" } GradientStop { position: 6 ; color: control.pressed ? "red" : "#ccc" } } } } } }
-
@Jerwinprabu GradientStop::position expects a value between 0 and 1. 0 means the top of the rectangle and 1 is the bottom.
-
@sletta I have tried, but It is not working. Before that I didn't added MouseArea, that time it was working When I have added Mouse Area clicked, it is not working but signal and slot working. If I press the button signal and slot message printed, only problem this (I cannot see the color changes in the button).
gradient: Gradient { GradientStop { position:0.0 ; color: control.pressed ? "red" : "#eee" } GradientStop { position:1.0 ; color: control.pressed ? "red" : "#ccc" } }```
-
Thanks for your response guys. I have found a solution for that. Ya exactly this code was working properly, when I press the start button signal is passing to c++ slot, but I cannot see the color changes in my dashboard at the time of pressing the button, So I have deleted mouse area simply connected signal and slot using onClicked.
Item { Example { //here's the instance, remember it is declarative id: example1; } Button { x:380 y:295 text: "Start" onClicked: example1.startThread() style: ButtonStyle { background: Rectangle { implicitWidth: 100 implicitHeight: 40 border.width: control.activeFocus ? 1 : 2 border.color: "red" radius: 10 gradient: Gradient { GradientStop { position: 5 ; color: control.pressed ? "red" : "#eee" } GradientStop { position: 6 ; color: control.pressed ? "red" : "#ccc" } } } } } }