在as3上创建一个DragDrop类

Question

I'm making a DragDrop class on as3. I'm trying to make movable movie clips "stick" to a target MovieClip. I've got the basic drag drop and positioning/sticking to work but when I try to create an "easing" effect using Enter Frame, somehow the movie clips move to 0 x and y position.

Here's the code that's working (without EnterFrame Event).

package {
    public class DragDrop {
        public var clip:MovieClip;
        public var targ:MovieClip;
        public var myHomeX:Number;
        public var myHomeY:Number;
        public var myFinalX:Number;
        public var myFinalY:Number;

        public function selectClip(clipV:MovieClip,targV:MovieClip):void {
            clip = clipV;
            targ = targV;
            var myHomeX = clip.x;
            var myHomeY = clip.y;
            var myFinalX = targ.x;
            var myFinalY = targ.y;

            clip.addEventListener(MouseEvent.MOUSE_DOWN,startDragging);
            clip.addEventListener(MouseEvent.MOUSE_UP,stopDragging);
            clip.addEventListener(MouseEvent.ROLL_OVER,rollOver);
            clip.addEventListener(MouseEvent.ROLL_OUT,rollOut);

            function startDragging(e:MouseEvent):void {
                clip.startDrag();
                clip.beingDragged = true;
                clip.parent.setChildIndex(clip,clip.parent.numChildren - 1);
            }

            function stopDragging(e:MouseEvent):void {
                clip.stopDrag();
                clip.beingDragged = false;
                var onTarget:MovieClip;
                if (clip.dropTarget != null)
                {
                    onTarget = e.target.dropTarget.parent;
                }
                else
                {
                    onTarget = null;
                } 
                if ((onTarget == targ))
                {
                    clip.onTarget = true;
                    targ.gotoAndStop(2);
                    clip.x = myFinalX;
                    clip.y = myFinalY;
                }
                else
                {
                    clip.onTarget = false;
                    targ.gotoAndStop(1);
                    clip.x = myHomeX;
                    clip.y = myHomeY;
                }
            }

            function rollOver(e:MouseEvent) {
                clipGlow.restart();
            }

            function rollOut(e:MouseEvent) {
                clipGlow.reverse();
            }
        }
    }
}

Here's the code that's not working (with EnterFrame Event).

package {
    public class DragDrop {
        public var clip:MovieClip;
        public var targ:MovieClip;
        public var clip:MovieClip;
        public var targ:MovieClip;
        public var myHomeX:Number;
        public var myHomeY:Number;
        public var myFinalX:Number;
        public var myFinalY:Number;

        public function selectClip(clipV:MovieClip,targV:MovieClip):void {
            clip = clipV;
            targ = targV;
            var myHomeX = clip.x;
            var myHomeY = clip.y;
            var myFinalX = targ.x;
            var myFinalY = targ.y;

            clip.addEventListener(MouseEvent.MOUSE_DOWN,startDragging);
            clip.addEventListener(MouseEvent.MOUSE_UP,stopDragging);
            clip.addEventListener(MouseEvent.ROLL_OVER,rollOver);
            clip.addEventListener(MouseEvent.ROLL_OUT,rollOut);
            clip.addEventListener(Event.ENTER_FRAME,slide);

            function startDragging(e:MouseEvent):void {
                clip.startDrag();
                clip.beingDragged = true;
                clip.parent.setChildIndex(clip,clip.parent.numChildren - 1);
            }

            function stopDragging(e:MouseEvent):void {
                clip.stopDrag();
                clip.beingDragged = false;
                var onTarget:MovieClip;
                if (clip.dropTarget != null)
                {
                    onTarget = e.target.dropTarget.parent;
                }
                else
                {
                    onTarget = null;
                }
                if ((onTarget == targ))
                {
                    clip.onTarget = true;
                    targ.gotoAndStop(2);

                }
                else
                {
                    clip.onTarget = false;
                    targ.gotoAndStop(1);
                }
            }

            function rollOver(e:MouseEvent) {
                clipGlow.restart();
            }

            function rollOut(e:MouseEvent) {
                clipGlow.reverse();
            }

            function slide(e:Event):void {
                if (! clip.beingDragged && ! clip.onTarget)
                {
                    clip.x -=  clip.x - clip.myHomeX / 5;
                    clip.y -=  clip.y - clip.myHomeY / 5;
                    clip.scaleX +=  (1 - clip.scaleX) / 5;
                    clip.scaleY +=  (1 - clip.scaleY) / 5;
                }
                else if (! clip.beingDragged && clip.onTarget)
                {
                    clip.x -=  clip.x - clip.myFinalX / 5;
                    clip.y -=  clip.y - clip.myFinalY / 5;
                    clip.scaleX +=  (1.5 - clip.scaleX) / 5;
                    clip.scaleY +=  (1.5 - clip.scaleY) / 5;
                }
            }
        }
    }
}

Thanks in advance for any help. :)

Answer 1

If you do this:

var myHomeX = clip.x;
var myHomeY = clip.y;
var myFinalX = targ.x;
var myFinalY = targ.y;

Then maybe clip.myHomeX should be myHomeX only etc?

function slide(e:Event):void {
            if (! clip.beingDragged && ! clip.onTarget)
            {
                clip.x -=  clip.x -myHomeX / 5;
                clip.y -=  clip.y -myHomeY / 5;
                clip.scaleX +=  (1 - clip.scaleX) / 5;
                clip.scaleY +=  (1 - clip.scaleY) / 5;
            }
            else if (! clip.beingDragged && clip.onTarget)
            {
                clip.x -=  clip.x -myFinalX / 5;
                clip.y -=  clip.y -myFinalY / 5;
                clip.scaleX +=  (1.5 - clip.scaleX) / 5;
                clip.scaleY +=  (1.5 - clip.scaleY) / 5;
            }
        }