Question

我正在尝试在QML中实现基本拖拽。在功能上，它的工作原理 - 我能够拖动一个字符串。但是，我无法使我的可拖动Rectangle对象跟随光标。它将Rectangle的x和y恰当地设置为可见的框架，但随后它保持静止而不是用鼠标移动。这是我的代码：

MouseArea {
    id: mouseArea
    anchors.fill: parent
    drag.target: draggable
}

Rectangle {
    id: draggable
    height: 18
    width: dragText.width + 8
    clip: true
    color: "#ff333333"
    border.width: 2
    border.color: "#ffaaaaaa"
    visible: false
    anchors.verticalCenter: parent.verticalCenter
    anchors.horizontalCenter: parent.horizontalCenter

    Drag.active: mouseArea.drag.active
    Drag.hotSpot.x: 0
    Drag.hotSpot.y: 0
    Drag.mimeData: { "text/plain": "Teststring" }
    Drag.dragType: Drag.Automatic
    Drag.onDragStarted: {
        visible = true
    }
    Drag.onDragFinished: {
        visible = false
    }

    Text {
        id: dragText
        x: 4
        text: "Teststring"
        font.weight: Font.Bold
        color: "#ffffffff"
        horizontalAlignment: Text.AlignHCenter
    }
}

Answer 1

您的矩形没有移动，因为您将锚点设置为矩形。锚固件应固定在锚固点上。

删除

anchors.verticalCenter: parent.verticalCenter
anchors.horizontalCenter: parent.horizontalCenter

在您的QML中。

如果你想把它放在父母的中心，你需要这样设置：

x: parent.width / 2 - this.width / 2
y: parent.height / 2 - this.height / 2

您可能还想删除

Drag.dragType: Drag.Automatic

如果矩形应该跟随光标，而不是仅在拖动结束后移动。

Answer 2

我最终通过完全避免Draggable框架来解决这个问题，基本上只是使用变通方法。我将以下内容添加到MouseArea中以使矩形正确移动：

onMouseXChanged: {
    draggable.x = mouseX - draggable.width/2
}
onMouseYChanged: {
    draggable.y = mouseY - draggable.height/2
}

为了模拟丢弃功能，我以编程方式计算“拖放区域”的位置，将其与基本碰撞检测的鼠标位置进行比较，然后附加到附加到“拖放区域”的ListView。

可拖动的项目在QML中不起作用

2 个答案: