96 lines
2.7 KiB
QML
96 lines
2.7 KiB
QML
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
|
|
}
|
|
}
|
|
|