Cocos Creator Mask

自定义遮罩挖洞

作者：未生畏死

介绍

• 关于新手引导和各种层级展示，有时候展现效果会显得很麻烦。所以我查阅大佬们的资料，自己写了一个小脚本。

效果展示

原理

• 依赖于cc.Mask组件.将mask组件尺寸归0.选择反向遮罩。基于mask的_graphics通过传入的节点数组进行绘图。
• 然后有一个子节点bg作为遮盖。在子节点上注册事件处理事件穿透即可。关键属性swallowTouches。

代码展示

···
const { ccclass, property, requireComponent, disallowMultiple, executeInEditMode } = cc._decorator;

@ccclass
//@ts-ignore
@disallowMultiple(false)
// @executeInEditMode()
@requireComponent(cc.Mask)
export default class MaskCut extends cc.Component {
@property(cc.Node)
bg: cc.Node = null;
private mask: cc.Mask = null;
private list: Array<cc.Node&