六、Layaair功能:图片360度旋转消失

  游戏中我们经常会用到圆形旋转消失(或者出现)的功能,如下图所示:这在U3D中比较简单,只要勾选下image属性即可,layaair中则要麻烦些。

  处理思路是遮罩+扇形显示。主要代码如下:

export default class RotateShade extends Laya.Script {

    static img:Laya.Sprite;
    private sp: Laya.Sprite;
    private graphicsImg():void{
        this.sp = new Laya.Sprite();
        // Laya.stage.addChild(this.sp);
        //画圆
        this.sp.graphics.drawPie(-170,-210,300,-90,-90,"#ff0000");
        this.sp.pos(RotateShade.img.x,RotateShade.img.y);
        //实现img显示对象的遮罩效果
        RotateShade.img.mask = this.sp;

    }   
    onStart()
    {
        this.graphicsImg();
    }
    private Angle:number=-90;
    onUpdate(){    

        console.log(this.Angle);
        if(this.Angle<270)
        {
            this.Angle+=1;
            this.sp.graphics.drawPie(-170,-210,300,-90,this.Angle,"#ff0000");
        }     

    }

}

  最终效果如图:

 

  工程链接:https://download.csdn.net/download/tel17610887670/11560799

 

 

----------------------------2019/8/15夜晚更新--------------------------

 

实际项目中,发现不能重新绘制,所以每次都需要将img的mask置空,然后删掉sp,重新绘制

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章