GridView in a ScrollView hangs when window is resized (cell width depends on window width)

[Diego Donate]

Hi,

I have a QML code to show a GridView in a ScrollView, with grid cells width depending on the ScrollView width.

When I resize quickly the window, to change the width, it hangs. It happens when the scroll appears/disappears, since the width changes

I see a warning in the output: QML GridView: Binding loop detected for property "cellHeight"

I hope anyone could tell me the problem. It is clearly a loop related with the cells width, but I can not find it..

My code:

import QtQuick 2.0
import QtQuick.Controls 1.3

Item {
    width: 400
    height: 400

    Text {
        id: header
        anchors { top: parent.top; topMargin: 20;  horizontalCenter: parent.horizontalCenter }
        text: "Header"
    }

    ScrollView {

        id: scrollGrid

        anchors{ top: header.bottom; topMargin: 40; bottom: parent.bottom; bottomMargin: 20; left: parent.left; right: parent.right }

        GridView {
            id: grid

            anchors{ top: parent.top; left: parent.left; right: parent.right}

            height: parent.height

            model: fruitModel

            cellHeight: grid.width/3
            cellWidth: grid.width/3

            visible: scrollGrid.visible

            delegate: Rectangle {
                width: grid.cellWidth; height: grid.cellHeight
                Text {
                    anchors.fill: parent
                    text: name
                    verticalAlignment: Text.AlignVCenter; horizontalAlignment:  Text.AlignHCenter
                }
                border.width: 1
            }
        }
    }

    ListModel {
        id: fruitModel

        ListElement { name: "Apple" }
        ListElement { name: "Orange" }
        ListElement { name: "Banana" }
        ListElement { name: "Banana1" }
        ListElement { name: "Banana2" }
        ListElement { name: "Banana3" }
        ListElement { name: "Banana4" }
        ListElement { name: "Banana5" }
        ListElement { name: "Banana6" }
        ListElement { name: "Banana7" }
        ListElement { name: "Banana8" }
        ListElement { name: "Banana9" }
        ListElement { name: "Banana0" }
        ListElement { name: "Ban2ana" }
        ListElement { name: "Ban3ana" }
        ListElement { name: "Ban4ana" }
        ListElement { name: "Ban5ana" }
        ListElement { name: "Ban6ana" }
        ListElement { name: "Ban7ana" }
        ListElement { name: "Ban8ana" }
    }
}