How to avoid binding loop in scrollbar component -- mutually exclusive bindings ?

serdef

Hi,

I am trying to use a nice scrollbar, where you can swipe the content as well as moving the scrollbar.
This causes a binding loop. I am testing something based on this code :
http://stackoverflow.com/questions/17833103/how-to-create-scrollbar-in-qtquick-2-0

I always get a binding loop error for this part of the code :
@Binding {
target: handle;
property: "y";
value: (flickable.contentY * clicker.drag.maximumY / (flickable.contentHeight - flickable.height));
when: (!clicker.drag.active);
}
Binding {
target: flickable;
property: "contentY";
value: (handle.y * (flickable.contentHeight - flickable.height) / clicker.drag.maximumY);
when: (clicker.drag.active || clicker.pressed);
}@

it gives me :
file:///....MaScrollBar.qml:37:5: QML Binding: Binding loop detected for property "value"

So I tried to find a way out, make it more obvious to QML that both bindings are mutually exclusive,
but this doesnt work :

@
Binding {
id: bind1
target: flickable;
property: "contentY";
value: (handle.y * (flickable.contentHeight - flickable.height) / clicker.drag.maximumY);
when: (clicker.drag.active || clicker.pressed);
}

Binding {
    id: bind2
    target: handle;
    property: "y";
    value: (flickable.contentY * clicker.drag.maximumY / (flickable.contentHeight - flickable.height));
    when: !bind1.when
}@

this gives :

QML Binding: Binding loop detected for property "value"
QQmlExpression: Expression file:..../MaScrollBar.qml:42:15 depends on non-NOTIFYable properties:
QQmlBind::when

Would you know a solution to avoid this binding conflict for the scrollbar ?

So when you drag the scrollbar handle, the content needs to move. When you drag the content, scrollbar handle should move.
These situations are mutually exclusive, but qml doesn't see it.

Maybe there's a better scrollbar solution, working in a different way ?

tiyan

Hello!

I use the same scrollbar and I've faced with your problem.
Could you please describe how it was fixed? I would be very appreciate!!!

Thanks!

tiyan

Hello!

I use the same scrollbar and I've faced with your problem.
Could you please describe how it was fixed? I would be very appreciate!!!

Thanks!

serdef

Hi,

I am using Qt 5.3.1 now, the code did not change much,
and the problem no longer occurs for me.

@
Binding {
id: bind1
target: flickable;
property: "contentY";
value: flickable.originY+ (handle.y * (flickable.contentHeight - flickable.height) / clicker.drag.maximumY);
when: (clicker.drag.active || clicker.pressed);
}

Binding {
    id: bind2
    target: handle;
    property: "y";
    value: ((flickable.contentY-flickable.originY)* clicker.drag.maximumY / (flickable.contentHeight - flickable.height));
    when: (!clicker.drag.active);
}@

serdef

Hi,

I am using Qt 5.3.1 now, the code did not change much,
and the problem no longer occurs for me.

@
Binding {
id: bind1
target: flickable;
property: "contentY";
value: flickable.originY+ (handle.y * (flickable.contentHeight - flickable.height) / clicker.drag.maximumY);
when: (clicker.drag.active || clicker.pressed);
}

Binding {
    id: bind2
    target: handle;
    property: "y";
    value: ((flickable.contentY-flickable.originY)* clicker.drag.maximumY / (flickable.contentHeight - flickable.height));
    when: (!clicker.drag.active);
}@

tiyan

Thank you for your answer!!!
You suggestion does not work for me. I'm using Qt 5.3.2.
And I've found another way to fix it)

The problem was caused in
[code]
flickable.contentHeight - flickable.height
[/code]

As my flickable element that is passed to the scrollbar is a child element of Item with its own height and width, I made an additional

[code] property int flick_width; [/code]

in my ScrollBar.qml. So I've just replaced flickable.height by flick_width.

tiyan

Thank you for your answer!!!
You suggestion does not work for me. I'm using Qt 5.3.2.
And I've found another way to fix it)

The problem was caused in
[code]
flickable.contentHeight - flickable.height
[/code]

As my flickable element that is passed to the scrollbar is a child element of Item with its own height and width, I made an additional

[code] property int flick_width; [/code]

in my ScrollBar.qml. So I've just replaced flickable.height by flick_width.