Draggable items not working in QML

Question

I'm trying to implement basic drag n' drop in QML. Functionally, it works -- I'm able to drag a string around. However, I can't get my draggable Rectangle object to follow the cursor. It sets the Rectangle's x and y properly the frame that it becomes visible, but then it remains stationary rather than move with the mouse. Here is my code:

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

I ended up solving this by avoiding the Draggable framework altogether and basically just using workarounds. I added the following to my MouseArea to make the rectangle move around properly:

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

To emulate dropping functionality, I programatically calculate the position of the "drop area," compare it to the mouse position with rudimentary collision detection, and then append to the ListView that's attached to the "drop area."