如何滚动到 Flickable 的 Repeater 中的最后一项

Question

我有一个带有分栏布局的 Flickable that is holding two Repeaters。我希望滚动到第一个转发器中的最后一项。这可能吗？

我想一种方法是计算第一个中继器中有多少项，然后将其乘以我正在使用的代理的高度。（代表是固定高度。）或者用中继器的高度减去最后一个代表的高度。等等...虽然我希望有比这更好的方法。

import QtQuick 2.7
import QtQuick.Controls 2.0

Item {
    id:passwordsView
    Flickable {
        id: flickable1
        anchors.fill: parent
        contentHeight: passwordsView_column.height
        ScrollBar.vertical: ScrollBar { }
        Column {
            id:passwordsView_column
            spacing: 15
            anchors.left: parent.left
            anchors.right: parent.right
            Repeater {
                id: passwordsView_breadcrumb
                anchors.left: parent.left
                anchors.right: parent.right
                model: BreadcrumbModel {}
                delegate: PasswordFolderDelegate {
                    y: 8;
                    anchors.left: parent.left;
                    anchors.right: parent.right;
                }
            }

            Repeater {
                id: passwordsView_contents
                model: PasswordModel {}
                PasswordFolderDelegate {
                    y: 8
                    anchors.left: parent.left
                    anchors.right: parent.right
                }
                anchors.left: parent.left
                anchors.right: parent.right
            }
        }
    }
}

Answer 1

Or take the height of the repeater and subtract the height of the last delegate.

Repeater 没有高度，因为它只是定位项目，所以这可能有点困难。

我能想到的最简单的方法是使用 mapToItem():

import QtQuick 2.7
import QtQuick.Controls 2.0

ApplicationWindow {
    width: 400
    height: 400
    visible: true

    Flickable {
        id: flickable1
        anchors.fill: parent
        contentHeight: passwordsView_column.height
        ScrollBar.vertical: ScrollBar { }
        Column {
            id:passwordsView_column
            spacing: 15
            anchors.left: parent.left
            anchors.right: parent.right
            Repeater {
                id: passwordsView_breadcrumb
                anchors.left: parent.left
                anchors.right: parent.right
                model: 10
                delegate: Rectangle {
                    width: 50
                    height: 50
                    color: "transparent"
                    border.color: "salmon"

                    Text {
                        text: index
                        anchors.centerIn: parent
                    }
                }
            }

            Repeater {
                id: passwordsView_contents
                model: 10
                delegate: Rectangle {
                    width: 50
                    height: 50
                    color: "transparent"
                    border.color: "#444"

                    Text {
                        text: index
                        anchors.centerIn: parent
                    }
                }
            }
        }
    }

    Button {
        text: "Position at end"
        anchors.top: parent.top
        anchors.right: parent.right
        onClicked: {
            var lastItem = passwordsView_breadcrumb.itemAt(passwordsView_breadcrumb.count - 1);
            flickable1.contentY = lastItem.mapToItem(flickable1.contentItem, 0, 0).y
        }
    }
}

请注意，这会使视图立即移动。如果你想要平滑滚动，你可能必须以某种方式计算所需的速度并将其传递给 flick().

如何滚动到 Flickable 的 Repeater 中的最后一项

How do I scroll to the last item in a Flickable's Repeater

qt

qml

qtquick2