AS3基础:图片绕中心点旋转


AS3基础:图片绕中心点旋转_第1张图片
 在flex中,roation是以注册点为中心的,而一般我们的元件都是默认以左上角为注册点,而用代码是无法改变它的注册点的,平常项目中,常常需要将元件以指定位置为中心进行旋转,这一篇的小例子,是一张图片绕中心点进行旋转。

 

其实原理很简单,将图片添加到一个SPRITE容器中,而它的坐标,是(1-img.width)/2,和(1-img.height)/2;这样旋转外面的SPRITE,里面的图片看起来正好就像是以图片为中心在旋转。

 

第二篇,将介绍一下用matrix来指定任意位置进行旋转。

 

 

代码如下:

 

package  
{
	import flash.display.Bitmap;
	import flash.display.DisplayObject;
	import flash.display.Loader;
	import flash.display.MovieClip;
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.events.TimerEvent;
	import flash.geom.Matrix;
	import flash.net.URLRequest;
	import flash.utils.Timer;
	
	/**
	 * 图片旋转
	 * @author hacker47
	 */
	public class Main2 extends MovieClip 
	{
		private var loader:Loader;
		private var url:String = "1.jpg";
		private var bitmap:Bitmap;
		private var imgBox:Sprite;
		
		public function Main2() 
		{
			if (stage) init();
			else
				addEventListener(Event.ADDED_TO_STAGE, init);
		}
		
		private function init(e:Event = null):void {
			loader = new Loader();
			loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);
			loader.load(new URLRequest(url));

		}
		

		private function onComplete(e:Event):void {
			bitmap = e.target.content as Bitmap;
			imgBox = new Sprite();
			//imgBox.graphics.clear();
			//imgBox.graphics.lineStyle(1, 0, 1);
			//imgBox.graphics.drawRect( -50, -50, 100, 100);
			addChild(imgBox);
			
			
			bitmap.x = 0- bitmap.width/ 2;
			bitmap.y = 0- bitmap.height/ 2;
			imgBox.addChild(bitmap);
			
			bitmap.cacheAsBitmap = true;
			imgBox.x = stage.stageWidth / 2;
			imgBox.y = stage.stageHeight/ 2;

			stage.addEventListener(MouseEvent.MOUSE_MOVE, running1);
			
		}

		private function running1(e:MouseEvent):void {
			
			var dy:Number = Math.round(mouseY) - (imgBox.y);
			var dx:Number = Math.round(mouseX) - (imgBox.x);
			imgBox.rotation = Math.atan2(dy, dx) * 180 / Math.PI;
		}

	}

}

 

 

 

 

 

你可能感兴趣的:(as3)