Why doesn't my QML property update when it is bound to Slider.value property?

Question

I have a QML document with an int property, a Slider and a Button in it. I want x to always have the same value as Slider.value. Here's my QML:

Page {
    property int x: 1

    content: Container {
        Slider {
            fromValue: 1
            toValue: 500
            value: x
            onValueChanged: {
                console.log("Slider value is: "+value);
                console.log("x value: "+x);  
            }
        }
        Button {
            text: "Increment x"
            onClicked: {
                x=x+10;
            }
        }
    }
}

When I press the Button the slider value is updated AND x is updated. But when I move the slider, the value of x is not updated. Why doesn't the value of x change when I move the slider?

Answer 1

Because your x is not bound to the Slider.value. When you bind Slider.value to x, if x changes, Slider.value will also change BUT if Slider.value changes (when you slide it), the x value will not be changed.

To solve this, you can use the alias type

property alias x: slider.value // assume the Slider has a id of "slider"