Property bindings getting lost in Qml when an Item accesses same value from different items in different files

0
votes

There are a bunch of Qml Properties questions on StackOverflow, all of them are related to items in the same file, and that's easily fixable by using a Connections or a Binding directly. But what happens if an Qml object loses the connection to the outside because of a missing binding?

I created a "Spinner Slider", that's a Spinner and a Slider that shares the same value:

SpinnerSlider.qml

import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Layouts 1.3

RowLayout {
    id: root

    property alias value: sliderControl.value
    property alias from: sliderControl.from
    property alias to: sliderControl.to

    Slider {
        id: sliderControl
        Layout.fillWidth: true
        stepSize: 1
        wheelEnabled: true
    }

    SpinBox {
        id: spinBox
        from: root.from
        to: root.to
        value: root.value
        stepSize: sliderControl.stepSize
        editable: true
        onValueChanged: root.value = value
    }
}

And I want to use in the following way, Two sliders, one above the other. Modifying the top one should change the value on the bottom one, changing the value on the botton one should do nothing.

main.qml

import QtQuick 2.12
import QtQuick.Window 2.12

Window {
    Column {
        anchors.fill: parent

        SpinnerSlider {
            id: outerSlider
            from: 0
            to: 500
            value: 50
        }

        SpinnerSlider {
            id: innerSlider
            from: 0
            to: 500
            // Does Not Work
            // value: outerSlider.value

            // Works
            Connections {
                target: outerSlider
                onValueChanged: innerSlider.value = outerSlider.value
            }

            // Works
            Binding on value {
                 value: outerSlider.value
            }
        }
    }
}

As per the comments in the code, if I use the "usual" way of connecting things on Qml, value: something.value, the code will not work as soon as I change the values on the SpinBox because the onValueChange will trigger and I will remove the Property Binding by effectively setting a constant to it.

What I really want is to be able to use the value: outerSlider.value way What I tried: Connections, Qt.bindings, Bindings on.. in the SpinnerSlider.qml, but nothing seemed to work. Any hints?

1
qtqml
From what I understand you, you want the SpinnerSlider value property to be modified by 1) moving the internal Slider, 2) moving the internal Spinner, 3) by an external element such as the outerSlider modifies innerSlider. Am I correct? I have a doubt about it, for example if the third method is used then should the values of the internal Slider and Spinner be modified? – eyllanesc
This is why there is the valueModified signal on the original Slider. I think you need to add such a signal to your SpinnerSlider as well and use that to signal a change from either Slider or Spinner. – Amfasis
@Amfasis the signal exists as I'm using a propertyAlias. The values changes correctly via an outside source, it only stops working when I touch the SpinBox values. – Tomaz Canabrava
@eyllanesc Yes, the internal values of the slider and spinner should be modified if the 3rd method is used. And this currently works untill I touch on the SpinBox values by changing them. – Tomaz Canabrava
@TomazCanabrava I was referring to valueModified instead of valueChanged (which is a signal there by convention, in your case of property alias, it's even automagic). Actually that is for SpinBox, Slider has the moved signal. – Amfasis

1 Answers

0
votes

I managed to fix the code by using Binding on multiple times. This way I don't break the outer binding. 

Binding on value {
    when: sliderControl.pressed
    value: sliderControl.value
}

Binding on value {
    when: spinBox.up.pressed
    value: spinBox.value
}

Binding on value {
    when: spinBox.down.pressed
    value: spinBox.value
}

Binding on value {
    when: spinBox.focus
    value: spinBox.value
}