Binding loop detected when parent height changed to childrenRect.height

chocis

Hi, this simple code generates "QML Rectangle: Binding loop detected for property "height"" warning/error when clicked and Rectangle becomes visible. I really do not see that there is a binding loop.
The warning/error is not printed if Rectangle initial property expanded is true, so this object has height at the beginning.
Is this QML bug or there are some under the hood strange initializations, when size is 0 at beginning?

Windows 7, 64-bit, Qt 5.4.0, QtQuick 2.4

Thank you

UPDATED
Further investigating I found out that it happens not when initial parent height is 0, but any value, so the warning is printed when parent becomes childrenRect.height

@Item {
width: 400
height: 400

Rectangle {
    id: subOptionList

    property bool expanded: false

    height: expanded ? childrenRect.height : 0
    clip: true
    width: parent.width

    Rectangle {
        border.color: "red"
        width: parent.width
        height: 20
    }
}

MouseArea {
    anchors.fill: parent
    onClicked: {
        subOptionList.expanded = !subOptionList.expanded
    }
}

}@

sierdzio

Height of the red rectangle may not be the same as childrenRect. What happens when you try this instead:
@
// ...
height: expanded ? myRect.height : 0
clip: true
width: parent.width

Rectangle {
id: myRect
border.color: "red"
width: parent.width
height: 20
}
// ...
@

chocis

Thanks for suggestion, but that is not the intended use case, because in end application I want the child Items to be dynamic, so the parent needs to adjust its size using childrenRect. I simplified the example to the minimum for easy reproducing.

Anyway some more realistic use case, where objects are created dynamically and creates the same error/warning message.

@Item {
width: 400
height: 400

Component {
    id: dynamicRec
    Rectangle {
        border.color: "red"
        width: parent.width
        height: 20
    }
}

Column {
    id: subOptionList

    property bool expanded: false

    height: expanded ? childrenRect.height : 0
    clip: true
    width: parent.width


    Component.onCompleted: {
        dynamicRec.createObject(subOptionList,{});
        dynamicRec.createObject(subOptionList,{});
        dynamicRec.createObject(subOptionList,{});
    }
}

MouseArea {
    anchors.fill: parent
    onClicked: {
        subOptionList.expanded = !subOptionList.expanded
    }
}

}@

I really like QML so want to know if this could be a bug, so it can be reported and fixed :)

sierdzio

You can report it and find out ;-)

The Column element is designed to automatically expand to fit all it's children.

Since you effectively want to hide it when not expanded, then why not keep the height constant, and hide it either off screen, or set visibility/ opacity to 0?

chocis

Thanks, that won't also work, because I want that the height is really 0, so that other dependent elements move accordingly. Example where visibility and opacity doesn't work:

@Item {
width: 400
height: 400

Component {
    id: dynamicRec
    Rectangle {
        border.color: "red"
        width: parent.width
        height: 20
    }
}

Column {
    id: subOptionList

    property bool expanded: false

// opacity: expanded ? 1 : 0
// visible: expanded ? true : false
height: expanded ? childrenRect.height : 0
clip: true
width: parent.width

    Component.onCompleted: {
        dynamicRec.createObject(subOptionList,{});
        dynamicRec.createObject(subOptionList,{});
        dynamicRec.createObject(subOptionList,{});
    }
}

MouseArea {
    anchors.fill: parent
    onClicked: {
        subOptionList.expanded = !subOptionList.expanded
    }
}
Rectangle {
    anchors.top: subOptionList.bottom
    width: parent.width
    height: 40
    color: "blue"
}

}@