在最后一个元素处停止Pathview移动

Question

当QML到达模型中的最后一个元素时（如列表视图和网格视图默认行为），如何在QML中停止Pathview元素的移动.ie，我不想要循环移动。

在下面的代码中，如果我们在第一个（“第一个”）项目之后向右滑动（“最后”）将显示（然后是“Jane Doe”）。可以做什么来阻止在第一个到达时向右滑动到达最后一个项目时，在左侧进一步向左滑动。当到达第一个或最后一个时，它应该停止

import QtQuick 2.5
import QtQuick.Window 2.2

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    ListModel {
        id:contactModel
         ListElement {
             name: "first"
             icon: "pic.png"
         }
         ListElement {
             name: "Jane Doe"
             icon: "pic.png"
         }
         ListElement {
             name: "John Smith"
             icon: "pic.png"
         }

         ListElement {
             name: "Bill Jones"
             icon: "pic.png"
         }
         ListElement {
             name: "Jane Doe"
             icon: "pic.png"
         }
         ListElement {
             name: "John Smith"
             icon: "pic.png"
         }
         ListElement {
             name: "Bill Jones"
             icon: "pic.png"
         }
         ListElement {
             name: "Jane Doe"
             icon: "pic.png"
         }
         ListElement {
             name: "last"
             icon: "pic.png"
         }
     }

         Component {
             id: delegate
             Column {
                 id: wrapper
                 Image {
                     anchors.horizontalCenter: nameText.horizontalCenter
                     width: 64; height: 64
                     source: icon
                 }
                 Text {
                     id: nameText
                     text: name
                     font.pointSize: 5
                     color: wrapper.PathView.isCurrentItem ? "red" : "black"
                 }
             }
         }

         PathView {
             anchors.fill: parent
             model: contactModel
             delegate: delegate
             snapMode:PathView.SnapOneItem
             path: Path {
                 startX: 0; startY: 100


                 PathLine { x: 640; y: 400;  }
             }
         }

}

Answer 1

这是实现的样子（我无法找到可用的属性）

PathView {
    property int previousCurrentIndex: 0
    currentIndex: 0
    ...

    onCurrentIndexChanged: {
        var lastIndex = contactModel.count - 1
        if (currentIndex == 0 && previousCurrentIndex == lastIndex) {
            pathViewId.positionViewAtIndex(lastIndex, PathView.Beginning)
        } else if (currentIndex == lastIndex && previousCurrentIndex == 0) {
            pathViewId.positionViewAtIndex(0, PathView.Beginning)
        }
        previousCurrentIndex = currentIndex
    }
}

定制属性previousCurrentIndex被引入并且实际currentIndex的计算是在发射onCurrentIndexChanged信号时完成的

Answer 2

您可以在PathView中添加以下代码。它会阻止视图从结束移动到开始，反之亦然。

property real previousOffsetVal: 0.

onOffsetChanged: {
            /* 10 is a threshhold, should be smaller than the total elements count*/
            if (Math.abs( previousOffsetVal - offset) > 10 ) {
                offset = previousOffsetVal
            }

            previousOffsetVal = offset
}