Add QmlListViewDragDrop

Author: zhengtianzuo

QmlListViewDragDrop/QmlListViewDragDrop.pro

@@ -0,0 +1,13 @@
+#-------------------------------------------------
+#
+# Copyright (C) 2003-2103 CamelSoft Corporation
+#
+#-------------------------------------------------
+
+QT += qml quick
+
+CONFIG += c++11
+
+SOURCES += main.cpp
+
+RESOURCES += qml.qrc

QmlListViewDragDrop/main.cpp

@@ -0,0 +1,22 @@
+/*!
+ *@file main.cpp
+ *@brief 程序主文件
+ *@version 1.0
+ *@section LICENSE Copyright (C) 2003-2103 CamelSoft Corporation
+ *@author zhengtianzuo
+*/
+#include <QGuiApplication>
+#include <QQmlApplicationEngine>
+
+int main(int argc, char *argv[])
+{
+    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
+    QGuiApplication app(argc, argv);
+
+    QQmlApplicationEngine engine;
+    engine.load(QUrl(QLatin1String("qrc:/main.qml")));
+    if (engine.rootObjects().isEmpty())
+        return -1;
+
+    return app.exec();
+}

QmlListViewDragDrop/main.qml

@@ -0,0 +1,98 @@
+/*!
+ *@file main.qml
+ *@brief 主文件
+ *@version 1.0
+ *@section LICENSE Copyright (C) 2003-2103 CamelSoft Corporation
+ *@author zhengtianzuo
+*/
+import QtQuick 2.7
+import QtQuick.Controls 2.0
+
+ApplicationWindow {
+    visible: true
+    width: 400
+    height: 300
+    title: qsTr("Qml列表项拖放")
+
+    ListModel {
+        id: listModel
+
+        ListElement {
+            text: qsTr("111222333随便的一些内容")
+        }
+        ListElement {
+            text: qsTr("AAABBBCCC随便的一些内容")
+        }
+        ListElement {
+            text: qsTr("DDDEEEFFF随便的一些内容")
+        }
+        ListElement {
+            text: qsTr("GGGHHHIII随便的一些内容")
+        }
+        ListElement {
+            text: qsTr("JJJKKKLLL随便的一些内容")
+        }
+    }
+
+    ListView{
+        id: listview
+        width: parent.width
+        height: parent.height
+        anchors.fill: parent
+        model: listModel
+        delegate: listDelegate
+        interactive: false
+    }
+
+    Component{
+        id: listDelegate
+        Rectangle{
+            property int fromIndex: 0
+            property int toIndex: 0
+
+            id: listItem
+            width: parent.width
+            height: 30
+
+            Text {
+                id: label
+                font.family: "microsoft yahei"
+                font.pointSize: 12
+                height: parent.height
+                width: parent.width
+                text: model.text
+                color: "#148014"
+                verticalAlignment: Text.AlignVCenter
+            }
+            Rectangle{
+                color: "#AAAAAA"
+                height: 1
+                width: parent.width
+                anchors.bottom: parent.bottom
+            }
+            MouseArea {
+                id: mousearea
+                anchors.fill: parent
+                onPressed: {
+                    listview.currentIndex = index;
+                    listItem.fromIndex = index;
+                    label.color = "#4040FF"
+                }
+                onReleased: {
+                    label.color = "#148014"
+                    console.debug("fromIndex: ", listItem.fromIndex, "toIndex: ", listItem.toIndex);
+                }
+                onMouseYChanged: {
+                    var lastIndex = listview.indexAt(mousearea.mouseX + listItem.x,
+                                                     mousearea.mouseY + listItem.y);
+                    if ((lastIndex < 0) || (lastIndex > listModel.rowCount()))
+                        return;
+                    if (index !== lastIndex){
+                        listModel.move(index, lastIndex, 1);
+                    }
+                    listItem.toIndex = lastIndex;
+                }
+            }
+        }
+    }
+}

QmlListViewDragDrop/qml.qrc

@@ -0,0 +1,5 @@
+<RCC>
+    <qresource prefix="/">
+        <file>main.qml</file>
+    </qresource>
+</RCC>

QmlListViewDragDrop/show.gif

@@ -42,3 +42,4 @@ SUBDIRS += QmlListSlidDelete
 SUBDIRS += QmlCircularProgressButton
 SUBDIRS += QmlPageNavigation
 SUBDIRS += QmlUpDownRefresh
+SUBDIRS += QmlListViewDragDrop

QtQuickExamples.pro

@@ -196,3 +196,8 @@ QmlLanguage: Qml动态语言切换
 QmlUpDownRefresh: Qml上拉下拉刷新
 
 ![](https://github.com/zhengtianzuo/QtQuickExamples/blob/master/QmlUpDownRefresh/show.gif?raw=true)
+
+QmlListViewDragDrop: Qml列表项拖放
+
+![](https://github.com/zhengtianzuo/QtQuickExamples/blob/master/QmlListViewDragDrop/show.gif?raw=true)
+