如何在QML中处理来自父Flickable的gridview内容Y,Y位置

时间:2017-12-08 01:49:06

标签: qt qml

我有一个backGroundList,位于Flickable的顶部gridview上。

我想处理来自父Flickable的gridview contentY,Y位置,当我将gridview高度指定为内容高度时,它正在工作,但由于内存问题,我不想在之前创建项目。

代码:

Flickable {
            id: mainFlickable
            width: 1920
            height: 1080
            contentHeight: gridView.contentHeight + 660 + 140 // topmargin + bottom margin

            ListView {
                id:backGroundList
                width: 1920
                height: 1080
                y: mainFlickable.contentY
                orientation: ListView.Horizontal

                MouseArea {
                    id: myMA12
                    anchors.fill: parent
                    hoverEnabled: true
                }
            }

            GridView {
                id: gridView
                objectName: "gridView"

                width: 1920
                height: 1080



                cellWidth: 372
                cellHeight: 290

                interactive: false
                 y: {
                    if (mainFlickable.contentY > 660)
                        return 660 + (mainFlickable.contentY - 660)
                    else
                        return 660
                }

                contentY: {
                    if (mainFlickable.contentY > 660){
                        return (mainFlickable.contentY - 660)
                    }
                    else {
                        return 0
                    }
                }

                delegate: Rectangle {
                    width: 352
                    height: 270
                    color: "blue"
                    opacity: 0.5

                    Text {
                        text: index
                        anchors.centerIn: parent
                    }
                }
                model:100
                anchors {
                    left: parent.left
                    leftMargin: 30
                    right: parent.right
                    rightMargin: 30
                }
            }
}

它没有按预期工作。 当我更新Y值时,ContentY会自动更新为零

约束:Qt5.9.0

有人可以帮我解决这个问题。

1 个答案:

答案 0 :(得分:0)

如果我理解你的话,你想要另外两个...View一个。当其中一个人轻弹到最后时,你想让View从窗口中弹出,第二个就会弹出,然后开始轻弹。

在我看来,只有一个Flickable嵌套其他两个,这不是干净利落的。

使用Flickable作为兄弟姐妹很容易实现。在我的示例代码中,我使用了两个Flickable。一个用于控制contentY - 属性,另一个用于在两个View之间滚动。只需使用Item即可轻松高效地解决后期问题。

Window {
    id: rootWin
    width: 800; height: 600; visible: true

    Flickable {
        id: flck
        anchors.fill: parent
        contentHeight: lv1.height + lv2.height
        interactive: false
        contentY: Math.min(Math.max(0, mainFlick.contentY - lv1.contentHeight + lv1.height), contentHeight - height)

        ListView {
            id: lv1
            height: rootWin.height
            width: 100
            model: 90
            delegate: Rectangle {
                border.width: 1
                width: 100
                height: 50
                Text {
                    anchors.centerIn: parent
                    text: index
                }
            }
            interactive: false
            contentY: Math.min(mainFlick.contentY, contentHeight - height)
            onContentYChanged: console.log(contentY, contentHeight, height)
        }
        ListView {
            id: lv2
            height: rootWin.height
            anchors.top: lv1.bottom
            width: 100
            model: 90
            delegate: Rectangle {
                border.width: 1
                width: 100
                height: 50
                Text {
                    anchors.centerIn: parent
                    text: index
                }
            }
            interactive: false
            contentY: Math.min(Math.max(0, mainFlick.contentY - lv1.contentHeight), contentHeight - height)
        }
    }
    Flickable {
        id: mainFlick
        anchors.fill: parent
        contentHeight: lv1.contentHeight + lv2.contentHeight
    }
}