官方文档:https://doc.qt.io/qt-5/qml-qtquick-droparea.html
DropArea 用于指定区域中的拖放处理。
但是它是不可见的。
Drag 是一个附加属性,它可用于在将 Item 拖过时通知 DropArea
代码
import QtQuick 2.15
import QtQuick.Window 2.15
Window {
id: root
width: 640
height: 480
visible: true
title: qsTr("Hello World")
/* DropArea 设定起作用的区域 */
DropArea {
id: dropZone
anchors.top: parent.top
anchors.right: parent.right
anchors.bottom: parent.bottom
width: 300
onEntered: { rect02.color = "lightgreen" }
onExited: { rect02.color = "lightblue" }
onDropped: { rect02.color = "green" }
/* 由于 DropArea 是不可见的,
我们需要有一个带颜色的控件来使得作用区域更加明显 */
Rectangle {
id: rect02
anchors.fill: parent
color: "lightblue"
x: root.width - width
y: 0
}
}
/* 这是允许用户拖动的控件 */
Rectangle {
x: 100; y: root.height/2
width: 50
height: 50
radius: 50
color: "red"
border.color: "black"
border.width: 2
//https://doc.qt.io/qt-5/qml-qtquick-drag.html#active-attached-prop
Drag.active: dragArea.drag.active
MouseArea {
id: dragArea
anchors.fill: parent
drag.target: parent
onReleased: { parent.Drag.drop() }
}
}
}
//https://www.zhihu.com/people/frostV 更详细的笔记会写在这里