Hello,
I tested a example to do somme drag and drop.
Here is my code
import QtQuick 2.0
Rectangle {
width: 800
height: 800
id: root
DropArea {
id: dragTarget1
width: 200; height: 200
y: 100; x: 100
onDropped: {
drop.source.anchors.centerIn = dragTarget1
console.log("dropped in 1")
}
Rectangle {
id: target
anchors.fill: parent
color: "lightgreen"
}
states: [
State {
when: dragTarget1.containsDrag
PropertyChanges {
target: target
color: "green"
}
}
]
}
DropArea {
id: dragTarget2
width: 200; height: 200
y: 400; x: 100
onDropped: {
drop.source.anchors.centerIn = dragTarget2
console.log("dropped in 2")
}
Rectangle {
id: target2
anchors.fill: parent
color: "lightgreen"
}
states: [
State {
when: dragTarget2.containsDrag
PropertyChanges {
target: target2
color: "green"
}
}
]
}
Rectangle {
MouseArea {
id: maDrag
drag.target: parent
onReleased: parent.Drag.drop()
anchors.fill: parent
}
id: request
color: "blue"
width: 100; height: 100
x: 600; y: 600
anchors.centerIn: undefined
Drag.active: maDrag.drag.active
Drag.hotSpot.x: width/2
Drag.hotSpot.y: height/2
states: [
State {
when: maDrag.drag.active
PropertyChanges {
target: request
opacity: 0.5
}
PropertyChanges {
target: request
anchors.centerIn: undefined
}
}
]
}
}
With this code there is no problem. When i drag my blue square in a dropaera 1, it is dropped in the center of the dropaera 1. When i drag the same from the first dropaera to the second, it is dropped in the center of the dropaera 2.
Now i want to start with my blue square in the center of the dropaera 1. So i changed one line.
import QtQuick 2.0
Rectangle {
width: 800
height: 800
id: root
DropArea {
id: dragTarget1
width: 200; height: 200
y: 100; x: 100
onDropped: {
drop.source.anchors.centerIn = dragTarget1
console.log("dropped in 1")
}
Rectangle {
id: target
anchors.fill: parent
color: "lightgreen"
}
states: [
State {
when: dragTarget1.containsDrag
PropertyChanges {
target: target
color: "green"
}
}
]
}
DropArea {
id: dragTarget2
width: 200; height: 200
y: 400; x: 100
onDropped: {
drop.source.anchors.centerIn = dragTarget2
console.log("dropped in 2")
}
Rectangle {
id: target2
anchors.fill: parent
color: "lightgreen"
}
states: [
State {
when: dragTarget2.containsDrag
PropertyChanges {
target: target2
color: "green"
}
}
]
}
Rectangle {
MouseArea {
id: maDrag
drag.target: parent
onReleased: parent.Drag.drop()
anchors.fill: parent
}
id: request
color: "blue"
width: 100; height: 100
x: 600; y: 600
anchors.centerIn: dragTarget1 //LINE CHANGED HERE
Drag.active: maDrag.drag.active
Drag.hotSpot.x: width/2
Drag.hotSpot.y: height/2
states: [
State {
when: maDrag.drag.active
PropertyChanges {
target: request
opacity: 0.5
}
PropertyChanges {
target: request
anchors.centerIn: undefined
}
}
]
}
}
And here, there is a probem. I can’t drag my square to the dropaera 2. It’s always return to the dropaera 1.
Is someone can help me ?
Thanks
matteli
↧