Egret引擎實現多個遮罩
阿新 • • 發佈:2019-01-22
Egret 引擎中DisplayObject 有mask屬性,作為遮罩,只顯示mask矩形區域內的部分。
但是有一個侷限就是,它只有一個矩形,不能實現諸如視窗效果的多區域遮罩。我們可以這樣實現,下面以重寫Sprite類來實現。
class MultiMasksSprite extends egret.Sprite{ constructor(){ super(); } masks: Array<egret.Rectangle>=[]; public _render(renderContext: egret.RendererContext):void{ var 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.x + render._transformTx, mask.y + render._transformTy, mask.width } ctx.clip(); ctx.closePath(); super._render(renderContext); ctx.restore(); } } |
向masks中新增遮罩區域即可