cubic bezier

forked from http://d.hatena.ne.jp/nitoyon/20070919/bezier_2

by beatspace 11 Mar 2009

Tags

beizier line make point smooth tweener with
Embed

/*
 * forked from http://d.hatena.ne.jp/nitoyon/20070919/bezier_2
 */
package
{
	import caurina.transitions.Tweener;

	import flash.display.Sprite;
	import flash.display.StageAlign;
	import flash.display.StageScaleMode;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.events.TimerEvent;
	import flash.geom.Point;
	import flash.utils.Timer;

	[SWF(backgroundColor='0x222222')]
	public class BezierTest3 extends Sprite
	{
		private var t:Number = 0.0;
		private var p:Point = new Point();
		private var flag:Boolean = true;
		private var dot:Sprite;
		private var points:Array = new Array();

		public function BezierTest3()
		{
			stage.scaleMode = StageScaleMode.NO_SCALE;
			stage.align = StageAlign.TOP_LEFT;

			dot = new Sprite();
			dot.graphics.beginFill(0xff0000);
			dot.graphics.drawCircle(0, 0, 3);
			dot.graphics.endFill();
			addChild(dot);

			for (var i:Number = 0; i < 4; i++) {
				var tmp:Sprite = new Sprite();
				tmp.graphics.beginFill(0xFF0000);
				tmp.graphics.drawCircle(0, 0, 5);
				tmp.graphics.endFill();
				tmp.addEventListener(MouseEvent.MOUSE_DOWN, function(evt:MouseEvent):void {
						evt.target.startDrag();
					});
				tmp.addEventListener(MouseEvent.MOUSE_UP, function(evt:MouseEvent):void {
						evt.target.stopDrag();
					});          	
				tmp.addEventListener(MouseEvent.MOUSE_MOVE, function(evt:MouseEvent):void {
						graphics.clear();
					});
				addChild(tmp);
				points.push(tmp);
			}

			points[0].x = 0;
			points[0].y = stage.stageHeight / 2;
			points[1].x = stage.stageWidth / 2;
			points[1].y = stage.stageHeight / 2 - 100;
			points[2].x = stage.stageWidth / 2;
			points[2].y = stage.stageHeight / 2 + 100;
			points[3].x = stage.stageWidth;
			points[3].y = stage.stageHeight / 2;
			addEventListener(Event.ENTER_FRAME, function(event:*):void{drawLines()});
		}

		public function drawLines():void
		{
			graphics.clear();

			var pt1:Point = new Point(points[0].x, points[0].y);
			var pt2:Point = new Point(points[1].x, points[1].y);
			var pt3:Point = new Point(points[2].x, points[2].y);
			var pt4:Point = new Point(points[3].x, points[3].y);

			var pt5:Point = getInnerPoint(pt1, pt2, pt3, pt4, t);

			dot.x = pt5.x;
			dot.y = pt5.y;

			graphics.lineStyle(1, 0xcccccc);
			graphics.moveTo(pt1.x, pt1.y);
			graphics.lineTo(pt2.x, pt2.y);
			graphics.lineTo(pt3.x, pt3.y);
			graphics.lineTo(pt4.x, pt4.y);

			var line:Sprite = new Sprite();
			line.graphics.lineStyle(1, 0x0099ff);
			line.graphics.moveTo(p.x, p.y);
			line.graphics.lineTo(pt5.x, pt5.y);
			addChildAt(line, 0);

			Tweener.addTween(line, {
					alpha: 0, 
					time: 5, 
					onComplete: function():void{removeChild(line);}
				});

			p = pt5;
			t = (flag ? t + 0.02 : t - 0.02);
			if(t >= 1.0 || t <= 0) flag = !flag;
		}

		private function getInnerPoint(p0:*, p1:*,p2:*, p3:*, t:Number):Point
		{
			return new Point(
				Math.pow(1 - t, 3) * p0.x + 3 * t * Math.pow(1 - t, 2) * p1.x + 3 * Math.pow(t, 2) *(1 - t) * p2.x  + Math.pow(t, 3) * p3.x,
				Math.pow(1 - t, 3) * p0.y + 3 * t * Math.pow(1 - t, 2) * p1.y + 3 * Math.pow(t, 2) *(1 - t) * p2.y  + Math.pow(t, 3) * p3.y
				);
		}
	}
}