Not able to cancel the drag when we exit mouse area

Question

I have an slider and an image used for sliding over the slider as shown below.

Image
{
    id: slideImg
    source:  "/slider/SliderSelected.png"
    width: 65
    height: 65

    onDragActiveChanged:
    {


        if (!dragActive )
        {
            main.selection (x + slideImg.width/2 , true);
        }

    }
  property bool dragActive: dragArea.drag.active

}

The mouseArea looks like this :

MouseArea
{
    id: dragArea
    anchors.fill: thumb
    enabled: !isDisabled
    height: 65
    width: 463
    drag
    {
        readonly property int dragThreshold: 10
        target: thumb
        minimumX: 0
        minimumY: 0
        maximumY:100

        maximumX: mainElement.width - thumb.width
        axis: Drag.XAxis
        threshold: dragThreshold
    }
    onCanceled: {
        console.log("onCanceled ")

    }
    onExited: {
        console.log("onExited ")
        Drag.cancel()
    }


}

When i hold the sliderImage and slide it outside the area of the slider i would want to cancel the drag . The drag area should be limited to the mouse area .If we move out of the mouse area i would want to cancel the drag . But the Drag.cancel() is not cancelling the drag . Is there any way to cancel the drag?

Answer 1

I am not sure, what you try to achieve by this, but try to unset drag.target

onExited: drag.target = null
onEntered: drag.target = myTarget

I think this should work for you.

But you might also want to look at states (have a dragging state, which is only enabled when the mouse is over the area.

MouseArea {
    id: dragArea
    anchors.fill: parent

    states: [
        State {
            when: dragArea.containsMouse

            PropertyChanges {
                target: dragArea
                drag.target: dragger
            }
        }
    ]
}

You might also want to look at the maximum and minimum X and Y values. This is probably the thing you are really looking for.
I don't think it is possible to automatically reset the position, but you can easily handle that your self, by storing the ne values in a extra variable, once you legitimately end a drag, and restoring them, once you don't.

I hope I was able to help you!