如何通过分别单击左右箭头将页面更改为 SwipeView 的下一项或上一项？答案

【问题标题】：How to change the page to the next or previous item of a SwipeView by clicking on the right and left arrow respectively?如何通过分别单击左右箭头将页面更改为 SwipeView 的下一项或上一项？
【发布时间】：2017-04-28 12:41:37
【问题描述】：

我有一个 SwipeView，它通过 Repeater 和 Loader 加载其内部元素。

我想通过单击 SwipeView 左右的箭头在项目之间向前和向后滑动。如何在 QML 中实现这种行为？

SwipeView {
            id: __swipeView
            Layout.fillHeight: true
            Layout.fillWidth: true
            Repeater {
                model: 3
                Loader {
                    source: "qrc:/../SwipeDelegate.qml"
                }
            }
        }

【问题讨论】：

最近有人问了类似的问题：stackoverflow.com/questions/43578012/…
好吧，这个例子和我要找的类似，只是我有 SwipeView file.qml 和另一个 file.qml SwipeView 委托，不能在委托中使用 SwipeView 方法

标签： qt qml

【解决方案1】：

在您的委托中，您可以通过SwipeView attached property 访问SwipeView，然后根据需要增加或减少当前索引：

import QtQuick 2.6
import QtQuick.Controls 2.0

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

    SwipeView {
        anchors.fill: parent

        Repeater {
            model: 3

            Item {
                id: delegate

                Button {
                    text: "<"
                    enabled: index > 0
                    onClicked: delegate.SwipeView.view.decrementCurrentIndex()
                    anchors.left: parent.left
                    anchors.verticalCenter: parent.verticalCenter
                }

                Label {
                    text: "Page " + (index + 1)
                    anchors.centerIn: parent
                }

                Button {
                    text: ">"
                    enabled: index < delegate.SwipeView.view.count - 1
                    onClicked: delegate.SwipeView.view.incrementCurrentIndex()
                    anchors.right: parent.right
                    anchors.verticalCenter: parent.verticalCenter
                }
            }
        }
    }
}

使用函数而不是直接设置currentIndex 很重要，原因描述为here。

【讨论】：