1. 程式人生 > >Egret引擎實現多個遮罩

Egret引擎實現多個遮罩

Egret 引擎中DisplayObject 有mask屬性,作為遮罩,只顯示mask矩形區域內的部分。

但是有一個侷限就是,它只有一個矩形,不能實現諸如視窗效果的多區域遮罩。我們可以這樣實現,下面以重寫Sprite類來實現。

class MultiMasksSprite extends egret.Sprite{

constructor(){

super();

}

     masks: Array<egret.Rectangle>=[];

public _render(renderContext: egret.RendererContext):void{

var

 render =<egret.HTML5CanvasRenderer>renderContext;

var ctx = render.canvasContext;

         ctx.save();

         ctx.beginPath();

for(var i =0; i <this.masks.length; i++){

var mask =this.masks[i];

             ctx.rect(mask.+ render._transformTx, mask.+ render._transformTy, mask.width

, mask.height);

}

         ctx.clip();

         ctx.closePath();

super._render(renderContext);

         ctx.restore();

}

}


向masks中新增遮罩區域即可