绘制三次贝塞尔曲线

此处为TypeScript代码 
cc()//创建背景随机园
kxcc()//创建背景随机空心园

/**
 *
 * @author 
 *
 */
class BG extends egret.Sprite{
    public constructor() {
        super();
        this.once(egret.Event.ADDED_TO_STAGE,this.onAddToStage,this);
    }
    
    private onAddToStage(){
        var bg:egret.Shape=new egret.Shape();
        bg.graphics.beginFill(0x000000);
        bg.graphics.drawRect(0,0,this.stage.stageWidth,this.stage.stageHeight);
        bg.graphics.endFill();
        this.addChild(bg);
        
        for(var i:number=0;i<50;i++){
            this.cc();
        }
        
        for(var j:number=0;j<7;j++){
            this.kxcc();
        }
        
        
        var arrControlP1=[
            [],
            []
        ];
        
        var lineSp:egret.Sprite=new egret.Sprite();
        this.addChild(lineSp);
        
        for(var m:number=0;m<10;m++){
            
            var moveP = new Point2D(100,this.stage.stageHeight/2 + Math.random() * 100 - 50);
                
            var fh = Math.random() < 0.5?-1:1;
            
            var minOffsetY=30;
            var rdOffsetY = 100;
                
            var rd = Math.random() * rdOffsetY;
            
            var jl = fh * (minOffsetY + rd);
                
            var controlP1 = new Point2D(170 + Math.random() *100,0);
              controlP1.y = moveP.y + jl;
                  
            var bfb = fh * (rd / rdOffsetY);
            console.log('moveP.y:%d,   rd:%d,    controlP1.y:%d,   百分比:',moveP.y,rd,controlP1.y,bfb);
                
            var controlP2 = new Point2D(100 + Math.random() * 100,0);
            controlP2.y = moveP.y+bfb*250;
            console.log(controlP2.y);
            
            var endP = new Point2D(0,0);
            endP.y = moveP.y + bfb * 350;
            endP.x=250+Math.random()*50;
                  
            var cp = [moveP,controlP1,controlP2,endP];
            
              var line:egret.Shape=new egret.Shape();
              line.graphics.lineStyle(2,0xc6017d+(0xffc600 - 0xc6017d)* Math.random());
              line.graphics.moveTo(cp[0].x,cp[0].y);
              line.graphics.endFill();
              lineSp.addChild(line);
            this.arrLine.push(line);
            
            line['points']=this.ComputeBezier(cp,100,[]);
            //console.log(line['points']);
        }
        //console.log(this.arrLine.length);
        
        /*lineSp.anchorOffsetX = lineSp.x =this.stage.stageWidth/2;
        lineSp.anchorOffsetY = lineSp.y =this.stage.stageHeight/2;
        lineSp.rotation=90;*/
        
        
        this.addEventListener(egret.Event.ENTER_FRAME,this.onEnterframe,this);
    }
    
    private arrLine=[];
    private iIndex=0;
    private onEnterframe(event:egret.Event){
        for(var m: number = 0; m < this.arrLine.length; m++) {
            var line= this.arrLine[m];
            if(line['points'][this.iIndex])
                line.graphics.lineTo(line['points'][this.iIndex].x,line['points'][this.iIndex].y);
        }
        this.iIndex++;
    }
    private cc(circle?:egret.Shape){
        if(!circle){
            circle= new egret.Shape();
            circle.graphics.beginFill(0xffffff * Math.random());
            circle.graphics.drawCircle(0,0,1+Math.random()*20);
            circle.graphics.endFill();
            this.addChild(circle);
        }
        circle.alpha = 0;
        circle.scaleX = circle.scaleY = 0;
        circle.x = this.stage.stageWidth * Math.random();
        circle.y = this.stage.stageHeight * Math.random();
        var delay=Math.random()*2000;
        var duration = 2000 + Math.random() * 2000;
        var alpha=0.1+Math.random()*0.9;
        egret.Tween.get(circle)
            .wait(delay).to({scaleX:1,scaleY:1,alpha:alpha},duration)
            .wait(delay).to({ scaleX: 0,scaleY: 0,alpha: 0 },duration).call(function(){
                this.cc(circle);
            },this);
    }
    private kxcc(circle?:egret.Shape) {
        if(!circle) {
            circle = new egret.Shape();
            circle.graphics.lineStyle(1,0xffffff);
            //circle.graphics.beginFill(0xffffff * Math.random());
            circle.graphics.drawCircle(0,0,150 + Math.random() * 150);
            circle.graphics.endFill();
            this.addChild(circle);
        }
        circle.alpha = 0;
        circle.scaleX = circle.scaleY = 0.5;
        circle.x = this.stage.stageWidth * Math.random();
        circle.y = this.stage.stageHeight * Math.random();
        var delay = Math.random() * 4000;
        var duration = 2000 + Math.random() * 2000;
        var alpha = 0.1 + Math.random() * 0.9;
        egret.Tween.get(circle).wait(delay)
            .to({ scaleX: 1,scaleY: 1,alpha: alpha },duration)
            .to({ scaleX: 1.5,scaleY: 1.5,alpha: 0 },duration).call(function() {
                this.kxcc(circle);
            },this);
    }
    
    
    /*
         cp在此是四個元素的陣列:
         cp[0]為起始點,或上圖中的P0
         cp[1]為第一個控制點,或上圖中的P1
         cp[2]為第二個控制點,或上圖中的P2
         cp[3]為結束點,或上圖中的P3
         t為參數值,0 <= t <= 1
        */
      private PointOnCubicBezier(cp,t) {
        var ax,bx,cx;
        var ay,by,cy;
        var tSquared,tCubed;
        var result = new Point2D();
    
        /*計算多項式係數*/
    
        cx = 3.0 * (cp[1].x - cp[0].x);
        bx = 3.0 * (cp[2].x - cp[1].x) - cx;
        ax = cp[3].x - cp[0].x - cx - bx;
    
        cy = 3.0 * (cp[1].y - cp[0].y);
        by = 3.0 * (cp[2].y - cp[1].y) - cy;
        ay = cp[3].y - cp[0].y - cy - by;
    
        /*計算位於參數值t的曲線點*/
    
        tSquared = t * t;
        tCubed = tSquared * t;
    
        result.x = (ax * tCubed) + (bx * tSquared) + (cx * t) + cp[0].x;
        result.y = (ay * tCubed) + (by * tSquared) + (cy * t) + cp[0].y;
    
        return result;
    }
    
    /*
         ComputeBezier以控制點cp所產生的曲線點,填入Point2D結構的陣列。
         呼叫者必須分配足夠的記憶體以供輸出結果,其為<sizeof(Point2D) numberOfPoints>
      */

      private ComputeBezier(cp,numberOfPoints,curve) {
        var dt;
        var i;
    
        dt = 1.0 / (numberOfPoints - 1);
    
        for(i = 0;i < numberOfPoints;i++)
            curve[i] = this.PointOnCubicBezier(cp,i * dt);
            
        return curve;
    }
}
原文地址:https://www.cnblogs.com/izengbin/p/6844645.html