[SOLVED] QML states not updating image rotation property
-
Try running the code below yourself. When the button is clicked, the state changes, but the image rotation does not change like it's supposed to. (I know you don't have the images, but the debug console output shows you it doesn't change, still 0) Also, if I set the initial state of the button to 'hidden' it does not automatically set the opacity=0 as the state should be directing it to. What am I doing wrong?
@import QtQuick 1.1
Rectangle {
id: dropDownButton
width: 28
height: width
opacity: 1
color: "transparent"
property string state: "collapsed";// Possible Button States = "collapsed" or "expanded" or "hidden" signal buttonStateChange(string state); Image { id: button source: "images/button-blue.png" anchors.fill: parent Image { id: dropDownButtonArrow source: "images/white-triangle.png" anchors.horizontalCenter: parent.horizontalCenter anchors.verticalCenter: parent.verticalCenter rotation: 0 } MouseArea { anchors.fill: parent; onClicked: { dropDownButton.state = (dropDownButton.state === "expanded") ? "collapsed" : "expanded"; buttonStateChange(dropDownButton.state); // send signal to notify button owner console.log("state=" + dropDownButton.state + " imgrotation=" + dropDownButtonArrow.rotation); } } } states: [ State { name: "collapsed"; PropertyChanges { target: dropDownButtonArrow; rotation: 0 } PropertyChanges { target: button; opacity: 1 } }, State { name: "expanded"; PropertyChanges { target: dropDownButtonArrow; rotation: 180 } PropertyChanges { target: button; opacity: 1 } }, State { name: "hidden"; PropertyChanges { target: dropDownButtonArrow; rotation: 0 } PropertyChanges { target: button; opacity: 0 } } ]
}
@ -
Change the name of 'state' custom property to something else(like '_state') and update it along with the default 'state' property(or just use the default property instead)... The state property is present in the elements by default and by defining a custom property by the same name, you over-ride it... Hence in your code, when the 'state' changes, it is just the your custom string property named 'state' that is changing, not the state of the element...
-
Good explanation, thanks.
So I just deleted the 'property string' bit so that I'm using the default 'state' property and now everything works correctly.