0

我只是想让图像在指定的画布区域内移动。如果鼠标光标移出画布区域，图像应该回到原来的位置。下面是我尝试过的代码。

  <mx:Script>
<![CDATA[
    import mx.controls.Image;
    import mx.containers.Canvas;
    import flash.geom.Rectangle;
     /* [Embed(source="cards/2C.png")]
     private var pic:Class; */
     public var points:Point;
     public var clan:Canvas;
     public var offset_x:int;
     public var offset_y:int;
     public var dropIndex:int=-1; 
     public var img:Image;
     public var dragImage:Image;
     public var myImage:Image;
     public var doDrag:Boolean;
     public var acceptDrag:Boolean;
     public function init():void

     {
        myImage = new Image();
        clan = new Canvas();
        clan.width=400;
        clan.height=300;
        clan.x=200;
        clan.y=150;
        clan.setStyle("backgroundColor",0xcfdccc);
        addChild(clan);
        myImage.source= pic.pic1;
        clan.addChild(myImage);
        myImage.addEventListener(MouseEvent.MOUSE_DOWN, ondown);
        myImage.addEventListener(MouseEvent.MOUSE_MOVE, mm); 

     }
     public function ondown(event:MouseEvent):void
     {
        doDrag=true;
        return;
     }
    public function mm(event:MouseEvent):void
    {
        if(doDrag==true)
        {

        points = new Point();
        myImage.source=event.target.source;
        points.x=event.target.x;
        points.y=event.target.y;
        points=localToGlobal(points);
        dragImage = mx.controls.Image(event.target);
        myImage.x=points.x;
        myImage.y=points.y;
        trace(points);
        var mywidth:int=clan.width-myImage.width;
        var myheight:int=clan.height-myImage.height;

        var boundar:flash.geom.Rectangle=new Rectangle(offset_x, offset_y ,mywidth,myheight);
        myImage.startDrag(false, boundar);
        myImage.addEventListener(MouseEvent.MOUSE_MOVE, onmove);
        myImage.addEventListener(MouseEvent.CLICK, onup);
        event.updateAfterEvent();
        }

    }

    public function onmove(event:MouseEvent):void
    {
        if(doDrag)
        {

    //  myImage = new Image();
        clan = new Canvas();
        var diff:Number = NaN;
        var doIncrement:Boolean=false;
        var point2:flash.geom.Point= new Point();
        img=mx.controls.Image(event.target);

        point2.x=this.x;
        point2.y=this.y;
        point2=globalToLocal(point2);

        trace("point2="+ point2);
        diff=points.x; 
        /* trace(stage.x);
        trace(stage.y); */
        points.x=img.x;
        points.y=img.y;
        points=globalToLocal(points);
        diff=points.x;
        trace("points.x="+points.x);
        trace("diff: "+ diff);
        trace("dropIndex: "+ dropIndex);
        if(diff >=0)
        {
            dropIndex=Math.floor(points.x / offset_x);
            doIncrement=true;
            trace("dropIndex1: "+ dropIndex);

        }
        else
        {
            dropIndex=Math.floor(points.x / offset_x);

        }
         if(doIncrement)
        {
            dropIndex++;
        } 
         if(dropIndex >= 0)
        {
             acceptDrag = true;
        }

           else if (dropIndex >= -5 && dropIndex <= -1) 
                {
                    dropIndex = 0;
                    acceptDrag = true;
                }  
        }
    }
    public function onup(event:MouseEvent):void
    {

        doDrag=false;
        img.stopDrag();
        acceptDrag=false;
    }
        ]]>
      </mx:Script>
4

2 回答 2

1

如果我正确理解你的问题，我相信你让它变得比它需要的复杂得多。向 Canvas 添加 MouseEvent.ROLL_OUT 事件侦听器，然后将图像重置为其原始坐标应该会导致您正在寻找的行为。这是我测试的一个快速而肮脏的版本，您可以使用、扩展或借用：

<fx:Script>
    <![CDATA[
        private var offset_x:int;
        private var offset_y:int;

        /**
         * Calibrates the drag operation so that they ghosted image follows the cursor based on
         *     where the image was clicked.  It then makes the ghosted image visible and
         *     attaches the MOUSE_MOVE handler so that it will begin tracking.
         **/
        private function myImageMouseDownHandler(event:MouseEvent):void {
            offset_x = myImage.mouseX;
            offset_y = myImage.mouseY;
            dragImage.visible = true;

            clan.addEventListener(MouseEvent.MOUSE_MOVE, onDrag);
        }

        /**
         * Calls the cleanup function then resets the ghosted image for further use.
         **/
        private function clanRolloutHandler(event:MouseEvent):void {
            dragCleanup();

            dragImage.x = myImage.x;
            dragImage.y = myImage.y;
        }

        /**
         * Calls the cleanup function then sets the main Image to the ghosted image's location.
         **/
        private function endDrag(event:MouseEvent):void {
            dragCleanup();

            myImage.x = dragImage.x;
            myImage.y = dragImage.y;
        }

        /**
         * Sets the ghosted image to follow the mouse cursor offset by the location of the
         *     original click.
         **/
        private function onDrag(event:MouseEvent):void {
            dragImage.x = clan.mouseX - offset_x;
            dragImage.y = clan.mouseY - offset_y;
        }

        /**
         * Hides the ghosted image and removes the MOUSE_MOVE event handler so that the function
         *     is no longer called.
         **/
        private function dragCleanup():void {
            dragImage.visible = false;
            clan.removeEventListener(MouseEvent.MOUSE_MOVE, onDrag);
        }
    ]]>
</fx:Script>
<mx:Canvas id="clan" rollOut="clanRolloutHandler(event)" mouseUp="endDrag(event)" horizontalScrollPolicy="off" verticalScrollPolicy="off"
           top="150" left="200" width="400" height="300" backgroundColor="#CFDCCC">
    <mx:Image id="myImage" mouseDown="myImageMouseDownHandler(event)" 
              source="http://www.leadersinstitute.com/wp-content/uploads/2011/02/playing-cards.jpg" height="50" width="50"/>
    <mx:Image id="dragImage" alpha="0.5" visible="false" 
              source="http://www.leadersinstitute.com/wp-content/uploads/2011/02/playing-cards.jpg" height="50" width="50"/>
</mx:Canvas>
于 2012-09-11T19:17:12.163 回答
0

MouseEvent.MOUSE_LEAVE 将在鼠标完全离开 Flash 窗口时触发，您可以尝试在这种情况下重置图像位置，并在需要时使用 MouseEvent.MOUSE_ENTER 重新开始跟踪。

这应该会有所帮助：http ://www.kirupa.com/developer/flashcs3/detecting_when_mouse_leaves_movie.htm

于 2012-09-11T09:56:15.833 回答