flex 拖动效果（影子效果）

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
	<![CDATA[
		import mx.graphics.ImageSnapshot;
		import mx.controls.Image;
		import mx.core.UIComponent;
	
		public var uiComponent:Object;
		public var targetImage:Image;
		public var Ax:int = 0;
		public var Ay:int = 0;
		public function mouseDown(event:MouseEvent):void{
			//在原地生成图片副本，然后将移动图片。
			this.uiComponent = event.currentTarget;
			//生成图片
			 var bd:BitmapData = ImageSnapshot.captureBitmapData( UIComponent( uiComponent ) );
    		 targetImage = new Image(); 
    		 targetImage.source = new Bitmap(bd);
    		 targetImage.x = uiComponent.x;
    		 targetImage.y = uiComponent.y;
    		 Ax = event.localX;
    		 Ay = event.localY;
    		 this.addEventListener(MouseEvent.MOUSE_MOVE, mouseMove);
    		 this.addEventListener(MouseEvent.MOUSE_UP, mouseUp);
    		 this.addChild(targetImage);
		}
		
		public function mouseMove(event:MouseEvent):void{
			targetImage.x = event.stageX-Ax;
			targetImage.y = event.stageY-Ay;
		}
		
		public function mouseUp(event:MouseEvent):void{
			this.removeEventListener(MouseEvent.MOUSE_MOVE, mouseMove);
    		this.removeEventListener(MouseEvent.MOUSE_UP, mouseUp);
    		 
			//当鼠标移动到预定位置，将图片删除，并且移动源控件。
			uiComponent.x = event.stageX-Ax;
			uiComponent.y = event.stageY-Ay;
			this.removeChild(targetImage);
			targetImage = null;
			
		}
		
		
	]]>
</mx:Script>
	<mx:Label mouseDown="mouseDown(event)" x="48" y="29" width="278" height="149" text="asdasdasdasd "/>
</mx:Application>

 

评论

1 楼 sjpsega 2009-07-25  

不错，借鉴一下，呵呵~~