在我们做游戏的时候经常会有新手引导,让用户点某个区域,又或者说我们需要做个刮刮乐游戏。那就需要动态画图或将图中间扣空。

所以,我们现在通过Mask来实现:
Mask设置:
202008201215.jpg

具体代码如下:

let mask:cc.Mask = this.node.getChildByName("mask").getComponent(cc.Mask);
var stencil = mask._clippingStencil;
var color = cc.color(255, 255, 255, 0);
stencil.drawPoly(mask._calculateCircle(cc.p(0,0),cc.p(50,50), 64), color, 0, color);
stencil.drawPoly(mask._calculateCircle(cc.p(50,0),cc.p(50,50), 64), color, 0, color);
stencil.drawPoly(mask._calculateCircle(cc.p(-50,0),cc.p(50,50), 64), color, 0, color);

最终效果图:
202008201216.jpg

PS:鼠标移动代码这里就不演示,自行监听touchBegin,touchMoved等事件处理就行。
Creator 版本: 1.10.3

标签: 蒙版, Mask, 新手引导, 刮刮乐

评论已关闭