quadratic bezier

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

by beatspace 11 Mar 2009

Tags

beizier line points smooth tree 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 BezierTest2 extends Sprite
    {
        //private var SIZE:int = 300;
        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 BezierTest2()
        {
        	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 < 3; i++) {
            	var tmp:Sprite = new Sprite();
            	tmp.graphics.beginFill(0xFF0000 + i * 80);
            	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[1].x = 200;
            points[1].y = 200;
            points[2].x = 300;
            points[2].y = 50;
            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 = getInnerPoint(pt1, pt2, pt3, t);

            dot.x = pt4.x;
            dot.y = pt4.y;

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

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

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

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

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