Egret旋转加载进度条

先上一张效果图

然后是LoadingUI里的代码

class LoadingUI extends egret.Sprite implements RES.PromiseTaskReporter {

    public constructor() {
        super();
        this.createView();
    }

    private bg1:egret.Bitmap;
    private bg2:egret.Bitmap;
    private loadingicon:egret.Bitmap;
    private bitmapText :egret.BitmapText;
    private createView(): void {
        // 加载loadingBg图
        let loadingbg:egret.Bitmap = new egret.Bitmap()
        loadingbg.texture = RES.getRes("loading_bg_jpg");
        loadingbg.width = 640 ;
        loadingbg.height = 1136 ;
        this.addChild(loadingbg);

        this.bg1= new egret.Bitmap()
        this.bg1.texture = RES.getRes("loading_json.loading_bar1_png");
        this.bg1.anchorOffsetX = this.bg1.width /2 ;
        this.bg1.anchorOffsetY = this.bg1.height /2 ;
        this.bg1.x = 640 / 2;
        this.bg1.y = 1136 / 2;
        this.addChild(this.bg1);

        this.bg2 = new egret.Bitmap();
        this.bg2.texture = RES.getRes("loading_json.loading_bar2_png");
        this.bg2.anchorOffsetX = this.bg2.width /2 ;
        this.bg2.anchorOffsetY = this.bg2.height /2 ;
        this.bg2.x = 640 / 2;
        this.bg2.y = 1136 / 2;
        this.addChild(this.bg2);

        this.loadingicon = new egret.Bitmap();
        this.loadingicon.texture = RES.getRes("loading_json.loading_icon_png");
        this.loadingicon.anchorOffsetX = this.loadingicon.width /2 ;
        this.loadingicon.anchorOffsetY = this.loadingicon.height /2 ;
        this.loadingicon.x = 640 / 2;
        this.loadingicon.y = 1136 / 2;
        this.addChild(this.loadingicon);

        var shape: egret.Shape = this.shape = new egret.Shape();
        this.addChild(shape);
        this.bg2.mask = shape;


        this.bitmapText = new egret.BitmapText();
        this.bitmapText.font = RES.getRes("num_fnt");
        this.bitmapText.width = 640;
        this.bitmapText.height = 1136;
        this.bitmapText.textAlign = "center"
        this.bitmapText.y = 1136 /2 -20
        this.addChild(this.bitmapText);

    }

    public onProgress(current: number, total: number): void {
        // this. bg2.x = (this.stage.stageWidth - this.bg2.width) * (current / total)
        //这里开始绘制的角度为-90，剩余绘制的角度为270
        this.changeGraphics(270 * (current / total));
        this.loadingicon.rotation+=5;
        this.bitmapText.text = Math.floor(current/ total * 100).toString() + "%";
    }

    private shape:egret.Shape;
    private changeGraphics(angle){
        var shape: egret.Shape = this.shape;
        shape.graphics.clear();
        shape.graphics.beginFill(0x00ffff, 1);
        shape.graphics.moveTo(320, 1136 / 2);
        shape.graphics.lineTo(this.bg2.width /2, 0);
        //我们从上开始绘制，则弧度为-90 * Math.PI / 180
        shape.graphics.drawArc(320, 1136 / 2, this.bg1.width /2, -90 * Math.PI / 180, angle* Math.PI / 180, false);
        shape.graphics.lineTo(320, 1136 / 2);
        shape.graphics.endFill();
    }
}