如何找到代理图像的位置，以及如何使用鼠标事件拖放图像

Question

我有两个画布，每个画布包含一个图像。我尝试创建他们的代理图像以使用鼠标事件拖放图像。第一个画布中 mnage 的代理图像将其当前目标（画布中存在的图像）x 位置并运行良好。但是鼠标按下时第二个画布中的图像将其代理图像从当前目标 x 位置作为第一个图像 x 位置而不是第二个图像。

How can i get the second canvas childs x position??

    package
    {
import flash.events.MouseEvent;
import flash.geom.Point;
import flash.geom.Rectangle;
import mx.containers.Canvas;
import mx.containers.HBox;
import mx.controls.Image;
public class Demo extends Canvas
{
    public function Demo()
    {
        super();
        this.setStyle("backgroundColor","blue");
        this.height=400;
        this.width=500;
        this.x=10;
        this.y=10;
        var hb:HBox=new HBox();
        /* hb.width=300;
        hb.height=300; */
        hb.setStyle("borderStyle","Solid");
        hb.setStyle("bordercolor","white");
        this.addChild(hb);
        var  can:Canvas=new Canvas();
        can.width=150;
        can.height=150;
        can.setStyle("backgroundColor","red"); 
        hb.addChild(can);
        var  can1:Canvas=new Canvas();
        can1.width=150;
        can1.height=150;
        can1.setStyle("backgroundColor","yellow"); 
         hb.addChild(can1);
          var img:Image=new Image();
          img.source="Cards/d4.png";
          img.x=60;
          img.y=40;
          can.addChild(img);
          var img1:Image=new Image();
          img1.source="Cards/br.png";
          img1.x=60;
          img1.y=40;
          can1.addChild(img1);
          imagelisteners(img);
          imagelisteners(img1);

    }

    public function imagelisteners(img:Image):void
    {
      img.addEventListener(MouseEvent.MOUSE_DOWN,Image_Mouse_DownHandler);  
      img.addEventListener(MouseEvent.MOUSE_UP,Image_Mouse_UpHandler);
      img.addEventListener(MouseEvent.MOUSE_MOVE,Image_MouseMoveHandler);
    }
    public var imgpoint:Point=new Point();
    public var cloneImage:Image=new Image();
    public var dodrag:Boolean=false;
    public var image:Image;
    public function Image_Mouse_DownHandler(event:MouseEvent):void
        {
            trace("Image_Mouse_DownHandler");
            dodrag=true;
            trace(dodrag);
        }
        public function Image_Mouse_UpHandler(event:MouseEvent):void
        {
            trace("Image_Mouse_UpHandler");
            if(dodrag)
            {
                dodrag=false;
                invalidateDisplayList();
            }           }
    public function Image_MouseMoveHandler(event:MouseEvent):void
    {
        var bounds:flash.geom.Rectangle;
        bounds=null;
                     var image:Image=event.currentTarget as Image;
        imgpoint.x=event.currentTarget.x;
        imgpoint.y=event.currentTarget.y;

        imgpoint=image.localToGlobal(imgpoint);
        trace(imgpoint);
            if(dodrag)
            {
                if(!this.contains(cloneImage))
                {
                cloneImage.source=event.currentTarget.source;
                cloneImage.alpha=0.7;
                cloneImage.x=imgpoint.x;
                cloneImage.y=imgpoint.y;
                        cloneImage.addEventListener(MouseEvent.MOUSE_UP,onmouseup);
                     cloneImage.addEventListener(MouseEvent.MOUSE_MOVE,onmousemove);
                this.addChild(cloneImage);
                bounds=new Rectangle(10,10,500,400);
                cloneImage.startDrag(false,bounds); 
                }
            }

    }
    public function onmouseup(event:MouseEvent):void
    {
        if(this.contains(cloneImage))
        {
        removeChild(cloneImage);
        }
    }
    public function onmousemove(event:MouseEvent):void
    {
        dodrag=false;

    }

   }
    }

提前谢谢你。

Answer 1

使用 localToGlobal 时，尝试添加目标

    imgpoint.x=event.currentTarget.x;
    imgpoint.y=event.currentTarget.y;
    var image:Image = event.currentTarget as Image;
    imgpoint = image.localToGlobal(imgpoint);//add target here