Sprites don't stop dragging on MOUSE_UP

Question

I have Sprites that I want to have move around when I click and hold them and stop when I release them. I have methods that add Event listeners to the Sprites:

    public function layOutEventListeners():void
    {

        var addSpriteEventListener:Function =
        function(spr:Dictionary, index:int, vector:Vector.<Dictionary>)
        {
            spr["sprite"].addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
            spr["sprite"].addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
        }

        gridVec.forEach(addSpriteEventListener);
    }`

and methods to handle the events:

    public function mouseDownHandler(me:MouseEvent):void
    {
        trace(me.target.toString());
        trace(me.currentTarget.toString());

        this.drawSprite(me.target);
        this.growByTwo(me.target);
        me.stopImmediatePropagation();

        me.currentTarget.startDrag(me);
    }

    public function mouseUpHandler(me:MouseEvent):void
    {
        trace(me.target.toString());
        trace(me.currentTarget.toString());

        me.stopImmediatePropagation();
        this.originalSize(me.target);
        me.currentTarget.stopDrag();
    }`

My problem is: when I click on the Sprites, as soon as I move the cursor, the Sprite's registration point snaps to the cursor, and when I release the mouse the Sprite doesn't stop following the cursor. I initially thought it was a problem with pixel collision. I thought the cursor wasn't touching anything on MOUSE_UP, but that proved to be false after I experimented. I even replicated the exact same Event adding and handling methods by starting another project and found that I wasn't having this problem. The test Sprite was simply dragging and dropping like usual, not snapping to the registration point, and being dragged by the point I clicked.

The only difference I can see, and also my only suspicion, is that the Sprites in my original code are being added to a Sprite, which is then being added to the stage, whereas the Sprite in the test project is being added to the root DisplayObject. I'm thinking that somehow the Event propagating down to the container Sprite and dragging and dropping that without dropping the other Sprite. The weird snapping I'm seeing might be the cursor snapping to the object behind the other sprite. Another important thing: when I drop a Sprite on top of another Sprite, that Sprite stops moving like I want it to, but still trails the registration point.

Regardless, I'm really stumped and I really don't know that I'm running over. Any ideas?

Cay Cay · Accepted Answer · 2011-03-01T01:26:40

This is usually because sometimes the mouse is not over the clip when MOUSE_UP occurs, either because of other clips getting in the way or maybe the player is not refreshing the stage fast enough, etc...

I'm not sure this is your case, but either way it is often recommended to assign the MOUSE_UP event to the stage, so you can safely assure it is always triggered. Make sure to remove the listener on the mouseUp handler though ;)

spr["sprite"].addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
public function mouseDownHandler(me:MouseEvent):void {
   stage.addEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
}
public function mouseUpHandler(me:MouseEvent):void {
   stage.removeEventListener(MouseEvent.MOUSE_UP, mouseUpHandler);
}

The down side is that you lose your clip reference on mouseUp, but you can create a reference by hand on mouseDown, or do the whole thing internally (within the sprite's code).

Sprites don't stop dragging on MOUSE_UP

1 Answers