QListView拖动排序

QListView拖动排序

实现方法，通过鼠标拖动子项目进行排序。

代码实现

import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 1.4

Window {
    id: window_
    width: 600
    height: 800
    visible: true
    title: qsTr("测试")

    property Item theItem: null

    Rectangle{
        anchors.fill: parent

        ListModel{
            id: listModel
            ListElement {
                name: "Bill Smith"
                number: "111"
            }
            ListElement {
                name: "John Brown"
                number: "222"
            }
            ListElement {
                name: "Sam Wise"
                number: "333"
            }
            ListElement {
                name: "Sam Wise"
                number: "444"
            }
            ListElement {
                name: "Sam Wise"
                number: "555"
            }
        }

        ListView {
            id: listView
            anchors.fill: parent
            model: listModel
            spacing: 5
            interactive: false // 不可以拖动列表啦
            delegate: Rectangle {
                id: delegataRec
                height: 40
                width: window_.width
                color: "#ececec"
                Text {
                    text: qsTr(name + ": " + number)
                    anchors.centerIn: parent
                }

                onYChanged: {
                    if(delegataRec != theItem) return
                    var index_ = (theItem.y / 45).toFixed(0)
                    if(index_ >= listModel.count) index_ = listModel.count -1
                    if(index_ < 0) index_ = 0
                    if(Number(index_) !== Number(index)){
                        listModel.move(index, index_, 1)
                    }
                }

                Image {
                    source: "qrc:/Source/sort_button.png"
                    anchors.verticalCenter: parent.verticalCenter
                    anchors.right: parent.right
                    anchors.rightMargin: 10
                    MouseArea{
                        anchors.fill: parent
                        drag.target: delegataRec
                        drag.axis: Drag.YAxis
                        hoverEnabled: true
                        onPressed: {
                            theItem = delegataRec
                        }
                        onReleased: {
                            delegataRec.y = index * 40 + index * 5
                        }
                    }
                }
            }
        }


    }

}