`

flex图片裁剪

    博客分类:
  • Flex
阅读更多

//构造函数
public function testSprite()
		{
			this.loadImg();
			this.createSmallCanvas();
		}


//装载图片
public function loadImg(): void{
			var loader: Loader = new Loader();
			var url: String = "http://localhost/1.gif";
			var urlRequest: URLRequest = new URLRequest(url);
			loader.load(urlRequest);
			this.addChild(loader);
			loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadComplete);
		}

//图片装载成功后,创建一个sprite显示图片
private function loadComplete(e: Event): void{
			var loader: Loader = Loader(e.target.loader);
			imgmap = loader.content as Bitmap;
//下两行为图片缩放比例,但缩放后不能裁剪正确的图像位置
//			imgmap.scaleX = .3;   
//			imgmap.scaleY = 0.35;
			var imgCanvas: Sprite = new Sprite();
			imgCanvas.x = 20;
			imgCanvas.y = 20;
			this.addChild(imgCanvas);
			imgCanvas.graphics.lineStyle(1, 0x000000);
			imgCanvas.graphics.beginFill(0xcccccc, 0.5);
			imgCanvas.graphics.drawRoundRect(0,0,200,200,10,10);
			imgCanvas.graphics.endFill();
			imgCanvas.addChild(imgmap);
//蒙版,超出此imgCanvas的区域不显示
			imgmap.mask = this.imgMask();
			
			this.createCut();
		}

private function imgMask(): Shape{
			var mask: Shape = new Shape();
			mask.x = 20;
			mask.y = 20;
			this.addChild(mask);
			mask.graphics.beginFill(0xffffff,0.5);
			mask.graphics.drawRect(0,0,200,200);
			mask.graphics.endFill();
			return mask;
		}

//创建要裁剪的框
private function createCut(): void{
			cutCanvas.x = 70;
			cutCanvas.y = 70;
			this.addChild(cutCanvas);
			cutCanvas.graphics.lineStyle(1, 0xffffff);
			cutCanvas.graphics.beginFill(0xffffff,0);
			cutCanvas.graphics.drawRect(20,20,40,40);
			cutCanvas.graphics.endFill();
			cutCanvas.addEventListener(MouseEvent.MOUSE_DOWN, startDragHandler);
			cutCanvas.addEventListener(MouseEvent.MOUSE_UP, endDragHandler);
		}

		private function startDragHandler(e: MouseEvent): void{
			offsetx = e.stageX - cutCanvas.x;
			offsety = e.stageY - cutCanvas.y;
			cutCanvas.addEventListener(MouseEvent.MOUSE_MOVE, draggingHandler);
		}
		
		private function draggingHandler(e: MouseEvent): void{
			cutCanvas.x = e.stageX - offsetx;
			cutCanvas.y = e.stageY - offsety;
			e.updateAfterEvent();
		}
		
		private function endDragHandler(e: MouseEvent): void{
			this.showCutImg();
			cutCanvas.removeEventListener(MouseEvent.MOUSE_MOVE, draggingHandler);
		}

//创建显示裁剪后的图片的Sprite
		private function createSmallCanvas(): void{
			smallImgCanvas.x = 280;
			smallImgCanvas.y = 20;
			this.addChild(smallImgCanvas);
			smallImgCanvas.graphics.lineStyle(1,0xfffeee);
			smallImgCanvas.graphics.beginFill(0x000000,0.5);
			smallImgCanvas.graphics.drawRect(0,0,40,40);
			smallImgCanvas.graphics.endFill();
		}

//显示裁剪后的图片
private function showCutImg(): void{
			var newdata: BitmapData = imgmap.bitmapData.clone();
			var area: Rectangle = new Rectangle(cutCanvas.x, cutCanvas.y, cutCanvas.width, cutCanvas.height);
			var nd: BitmapData = new BitmapData(cutCanvas.width, cutCanvas.height);
			nd.copyPixels(newdata, area, nd.rect.topLeft);
			var newImg: Bitmap = new Bitmap(nd);
			smallImgCanvas.addChild(newImg);
		}
 

分享到:
评论
1 楼 Da嗒_Sunny 2011-11-30  
求使用说明

相关推荐

Global site tag (gtag.js) - Google Analytics