QML Drag on Rectangle doesn't capture events

Question

i'm trying to accomplish a simple drag of a Image that fires an event when the Drag is finished or started.

Rectangle {
    id: upperFooter
    color: "transparent"
    Layout.alignment: Qt.AlignLeft | Qt.AlignBottom
    Drag.onDragFinished: onDragFinished()
    Drag.dragType: Drag.Automatic
    width: 800
    height: 40
    Image {
        height: 40
        width: upperFooter.width
        source: "qrc:///images/footer/background_footer.svg"
        MouseArea {
            id: iconMouseArea
            x: 390
            y: 10
            anchors.fill: parent
            onClicked: toggleHiddenBar()
            drag {
                target: upperFooter
                axis: Drag.YAxis

            }
        }
    }

The event on the upperFooter item doesn't fire.

QML: onDragStarted / finished not called even though the drag property is active --> I've tried to put Drag.type on Drag.Automatic to solve this but still doesn't work.

QtQuick v 2.6 Layout 1.3 QML 5.6

According to [the documentation](http://doc.qt.io/qt-5/qml-qtquick-drag.html#dragType-attached-prop) you should bind Drag.active to the MouseArea: _When using Drag.Automatic you should also define mimeData and bind the active property to the active property of MouseArea : MouseArea::drag.active_ — folibis, Dec 13 '17 at 12:09
One more notice: you should place `MouseArea` as a child of `Rectangle`, not `Image` — folibis, Dec 13 '17 at 12:21
@folibis I am trying and failing to apply your advice to https://stackoverflow.com/a/38168103/13675 and would appreciate if you would make your comment here an Answer with the necessary code in this case, which I might be able to apply to that case. — Sparr, Dec 17 '18 at 21:35

score 1 · Accepted Answer · answered Mar 03 '20 at 05:45

I solved this issue by adding explicit dragActive property to the MouseArea. So in Your case code will be:

MouseArea {
    id: iconMouseArea
    drag {
        target: upperFooter
        axis: Drag.YAxis
    }

    property bool dragActive: drag.active

    onDragActiveChanged: {
        if(drag.active) { //
            ... // Dragging started
        } else {
            ... // Dragging finished
        }
    }
}

QML Drag on Rectangle doesn't capture events

1 Answers1