Dynamic View Ordering of SwipeViews

[BryanG 0]

Hi,

I have a list of Swipeviews that I am trying to rearrange when you hold one down. My current problem is that when the SwipeView is held down it is not able to move. But when you hold down the rectangle it is in, you can rearrange it. Which won't work for me as the SwipeView needs to take up the entire space of the rectangle.

I used the Dynamic View Ordering tutorial as the base for the code:
https://doc.qt.io/qt-5/qtquick-tutorials-dynamicview-dynamicview3-example.html

main.qml

ApplicationWindow {
    id: root
    visible: true

    Rectangle {
        anchors.fill: parent
        id: rect
        Component {
            id: dragDelegate

            MouseArea {
                id: dragArea

                property bool held: false

                anchors { left: parent.left; right: parent.right }
                height: content.height

                drag.target: held ? content : undefined
                drag.axis: Drag.YAxis
                propagateComposedEvents: true
                onPressAndHold: held = true
                onReleased: held = false

                Rectangle {
                    id: content
                    anchors {
                        horizontalCenter: parent.horizontalCenter
                        verticalCenter: parent.verticalCenter
                    }
                    width: dragArea.width; height: rect.height/3



                    border.width: 5
                    border.color: "lightsteelblue"

                    color: dragArea.held ? "lightsteelblue" : "red"
                    Behavior on color { ColorAnimation { duration: 100 } }

                    radius: 2
                    Drag.active: dragArea.held
                    Drag.source: dragArea
                    Drag.hotSpot.x: width / 2
                    Drag.hotSpot.y: height / 2
                    states: State {
                        when: dragArea.held

                        ParentChange { target: content; parent: rect }
                        AnchorChanges {
                            target: content
                            anchors { horizontalCenter: undefined; verticalCenter: undefined }
                        }
                    }

                    Loader{
                        id: tileLoader
                        anchors.centerIn: parent
                        width: parent.width/2
                        height: parent.height/2
                        source: page
                    }
                }
                DropArea {
                    anchors { fill: parent; margins: 10 }

                    onEntered: {
                        visualModel.items.move(
                                    drag.source.DelegateModel.itemsIndex,
                                    dragArea.DelegateModel.itemsIndex)
                    }
                }
            }
        }
        DelegateModel {
            id: visualModel

            model: PageModel {}
            delegate: dragDelegate
        }

        ListView {
            id: view

            anchors { fill: parent; margins: 2 }

            model: visualModel

            spacing: 4
            cacheBuffer: 50
        }
    }
}

PageModel.qml

import QtQuick 2.0

ListModel {
    ListElement {
        page: "testPage1.qml"
    }
    ListElement {
        page: "testPage1.qml"
    }
    ListElement {
        page: "testPage1.qml"
    }
    ListElement {
        page: "testPage1.qml"
    }
}

testPage1.qml

import QtQuick 2.0
import QtQuick.Controls 2.3
import QtQml 2.2
import QtCharts 2.0

SwipeView {
    spacing: 5

    Rectangle{
        MouseArea {
                anchors.fill: parent
                propagateComposedEvents: true

                onClicked: mouse.accepted = false;
                onPressed:{
                     console.log("MousePressed but passed on")
                     mouse.accepted = false;
                }
                onReleased: mouse.accepted = false;
                onDoubleClicked: mouse.accepted = false;
                onPositionChanged: mouse.accepted = false;
                onPressAndHold: mouse.accepted = false;
        }
        color: "green"
        Text{
            id: textbox1
            text: qsTr("this is textSwip1")
            anchors.verticalCenter: parent.verticalCenter
            anchors.horizontalCenter: parent.horizontalCenter
        }
    }

    Rectangle{
        color: "green"
        Text{
            id: textbox2
            text: qsTr("this is textSwip2")
            anchors.verticalCenter: parent.verticalCenter
            anchors.horizontalCenter: parent.horizontalCenter
        }
    }

    Rectangle{
        color: "green"
        Text{
            id: textbox3
            text: qsTr("this is textSwip3")
            anchors.verticalCenter: parent.verticalCenter
            anchors.horizontalCenter: parent.horizontalCenter
        }
    }
}

Any and all help is much appreciated.
Thank you