Qt學習-ListView的拖拽
阿新 • • 發佈:2021-07-16
最近在學習Qt 裡面的QML, 使用DropArea和MouseArea實現了ListView的拖拽.
想起了當年用Delphi, 差不多一樣的東西, 不過那是2000了. Delphi也是不爭氣啊, 多好的IDE, 硬生生髮展不起來.....
程式碼可以在 https://github.com/cnscud/learn/tree/master/qt/dragdroplistview 找到
/** samples changed from Qt tutorial "dynamicview3" */ import QtQuick 2.0 import QtQml.Models 2.1 Rectangle { id: root width: 300; height: 400 Component { id: dragDelegate MouseArea { id: dragArea anchors { left: parent.left; right: parent.right } height: content.height // Disable smoothed so that the Item pixel // from where we started the drag remains under the mouse cursor drag.smoothed: false drag.target: content drag.axis: Drag.YAxis Rectangle { id: content anchors { horizontalCenter: parent.horizontalCenter verticalCenter: parent.verticalCenter } width: dragArea.width; height: column.implicitHeight + 4 border.width: 1 border.color: "lightsteelblue" color: dragArea.drag.active ? "lightsteelblue" : "white" Behavior on color { ColorAnimation { duration: 100 } } radius: 2 Drag.active: dragArea.drag.active Drag.source: dragArea Drag.hotSpot.x: width / 2 Drag.hotSpot.y: height / 2 states: State { when: content.Drag.active ParentChange { target: content; parent: root } AnchorChanges { target: content anchors { horizontalCenter: undefined; verticalCenter: undefined } } } Column { id: column anchors { fill: parent; margins: 2 } Text { text: 'Name: ' + name } } } DropArea { anchors { fill: parent; margins: 10 } onEntered: { visualModel.items.move( drag.source.DelegateModel.itemsIndex, dragArea.DelegateModel.itemsIndex) } } } } DelegateModel { id: visualModel model: PetsModel {} delegate: dragDelegate } ListView { id: view anchors { fill: parent; margins: 2 } model: visualModel spacing: 4 cacheBuffer: 50 moveDisplaced: Transition { NumberAnimation { properties: "x,y"; duration: 200 } } } }
用的PetModels如下:
import QtQuick 2.0 ListModel { ListElement { name: "Polly" type: "Parrot" age: 12 size: "Small" } ListElement { name: "Penny" type: "Turtle" age: 4 size: "Small" } ListElement { name: "Warren" type: "Rabbit" age: 2 size: "Small" } ListElement { name: "Spot" type: "Dog" age: 9 size: "Medium" } ListElement { name: "Schrödinger" type: "Cat" age: 2 size: "Medium" } ListElement { name: "Joey" type: "Kangaroo" age: 1 size: "Medium" } ListElement { name: "Kimba" type: "Bunny" age: 65 size: "Large" } ListElement { name: "Rover" type: "Dog" age: 5 size: "Large" } ListElement { name: "Tiny" type: "Elephant" age: 15 size: "Large" } }
本文來自部落格園,作者:飛雲~,轉載請註明原文連結:https://www.cnblogs.com/cnscud/p/15020296.html