1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95
|
import QtQuick 2.0
Rectangle {
id: root
width: 200
height: 200
property int duration: 100
property int count: grid.count
Component {
id: myDelegate
Rectangle {
id: wrapper
property string nameData: name
property bool removalStarted: false
property real minX: 0
property real minY: 0
onXChanged: if (removalStarted) grid.recordPosition(x, y)
onYChanged: if (removalStarted) grid.recordPosition(x, y)
objectName: "wrapper"
width: 80
height: 80
border.width: 1
Column {
Text { text: index }
Text {
text: wrapper.x + ", " + wrapper.y
}
Text {
id: textName
objectName: "textName"
text: name
}
}
color: GridView.isCurrentItem ? "lightsteelblue" : "white"
GridView.onRemove: SequentialAnimation {
PropertyAction { target: wrapper; property: "removalStarted"; value: true }
PropertyAction { target: wrapper; property: "GridView.delayRemove"; value: true }
NumberAnimation { target: wrapper; property: "scale"; to: 0.5; duration: root.duration; easing.type: Easing.InOutQuad }
PropertyAction { target: wrapper; property: "GridView.delayRemove"; value: false }
PropertyAction { target: grid; property: "animationDone"; value: true }
}
}
}
GridView {
id: grid
property int displaceTransitionsDone: 0
property bool animationDone: false
property point minimumPosition: Qt.point(0, 0)
signal delegateMoved(real x, real y)
objectName: "grid"
focus: true
anchors.fill: parent
cacheBuffer: 0
cellWidth: 80
cellHeight: 80
model: testModel
delegate: myDelegate
displaced: Transition {
id: transition
SequentialAnimation {
NumberAnimation {
properties: "x,y"
duration: root.duration
easing.type: Easing.OutBounce
}
ScriptAction { script: grid.displaceTransitionsDone += 1 }
}
}
function recordPosition(index, x, y) {
if (x < minimumPosition.x || y < minimumPosition.y) {
minimumPosition = Qt.point(x, y)
}
}
}
Rectangle {
anchors.fill: grid
color: "lightsteelblue"
opacity: 0.2
}
}
|