当前位置: > > > AS3 - 简单游戏(鼠标拖拽箭头移动,同时绘制粉笔线轨迹)

AS3 - 简单游戏(鼠标拖拽箭头移动,同时绘制粉笔线轨迹)

这个是一个flash游戏的基础样例。
功能:鼠标按下移动时,箭头会同步移动,同时箭头角度会改变一直朝着移动的方向。箭头移动时会在画布上画出粉笔线的轨迹。

效果图:
        

代码如下:
--- Main.as ---
package {
	import flash.display.Sprite;
	import flash.events.MouseEvent;
	import flash.geom.Point;
	[SWF(backgroundColor="#000000", width="1024", height="768")]
	public class Main extends Sprite {
		// 创建用于画线的画布容器
		private var canvas:Sprite = new Sprite();
		// 箭头元件
		private var arrow:Arrow=new Arrow();
		// 鼠标实际的坐标
		private var mousePoint:Point;
		// anglePoint is the latest point we checked to determine angle of movement
		private var anglePoint:Point;
		// 线条标准的粗细。后面绘制的时候会增加个随机数改变粗细,做出封笔的效果
		private var thickness:Number=3;
		
		public function Main() {
			// 添加画布容器到舞台
			addChild(canvas);
			//添加箭头元件到舞台
			addChild(arrow);
			arrow.x=320;
			arrow.y=240;
			// 舞台添加鼠标按下监听
			stage.addEventListener(MouseEvent.MOUSE_DOWN,mousePressed);
		}
		private function mousePressed(e:MouseEvent):void {
			// 鼠标按下后。就可以移除按下的监听。开始绘制时不需要一直监听按下事件
			stage.removeEventListener(MouseEvent.MOUSE_DOWN,mousePressed);
			// 添加鼠标移动和释放监听
			stage.addEventListener(MouseEvent.MOUSE_MOVE,mouseMoved);
			stage.addEventListener(MouseEvent.MOUSE_UP,mouseReleased);
			// 保存鼠标的坐标
			mousePoint=new Point(mouseX,mouseY);
			anglePoint=new Point(mouseX,mouseY);
			// 画笔移动到箭头位置
			canvas.graphics.moveTo(arrow.x,arrow.y);
		}
		private function mouseMoved(e:MouseEvent):void {
			// 开始绘制
			// 设置线条样式
			canvas.graphics.lineStyle(thickness,0xffffff);
			// 计算目前鼠标位置相对于上次鼠标位置的横,纵方向的距离差
			var dx:Number=mouseX-mousePoint.x;
			var dy:Number=mouseY-mousePoint.y;
			// 箭头移动相应的距离
			arrow.x+=dx;
			arrow.y+=dy;
			// 画线到箭头最新的位置
			canvas.graphics.lineTo(arrow.x,arrow.y);
			// 保存鼠标最新的位置
			mousePoint.x=mouseX;
			mousePoint.y=mouseY;
			// if the distance between current mouse point and the last point where we updated arrow rotation
			// is greater than 20 pixels, let's rotate arrow sprite according to the angle and save
			// current mouse position in anglePoint Point
			if ((anglePoint.x-mouseX)*(anglePoint.x-mouseX)+(anglePoint.y-mouseY)*(anglePoint.y-mouseY)>400) {
				var angle:Number=Math.atan2(anglePoint.y-mouseY,anglePoint.x-mouseX);
				arrow.rotation=angle*57.2957795-90;
				anglePoint.x=mouseX;
				anglePoint.y=mouseY;
			}
			// 通过随机数改变线条的粗细
			thickness=thickness+Math.floor(Math.random()*3)-1;
			// 确保线条粗细在2~5范围
			if (thickness<2) {
				thickness=2;
			}
			if (thickness>5) {
				thickness=5;
			}
		}
		private function mouseReleased(e:MouseEvent):void {
			// 释放鼠标后从新添加鼠标按下监听
			stage.removeEventListener(MouseEvent.MOUSE_MOVE,mouseMoved);
			stage.removeEventListener(MouseEvent.MOUSE_UP,mouseReleased);
			stage.addEventListener(MouseEvent.MOUSE_DOWN,mousePressed);
		}
	}
}
--- Arrow.as ---
package
{
	import flash.display.Bitmap;
	import flash.display.Sprite;

	public class Arrow extends Sprite
	{
		//包外类测试
		[Embed(source="arrow.png")]   //与下面的类关连
		private var IconClass:Class;
		public function Arrow()
		{
			var icon:Bitmap = new IconClass();
			//图片平滑
			icon.smoothing = true;
			//设置图片中心点为原点
			icon.x = -icon.width/2;
			icon.y = -icon.height/2;
			addChild(icon);
		}
	}
}
在线试玩:

评论0