是否可以通过 Javascript 在 Adob​​e Animate CC HTML5/Canvas 项目中分配蒙版？

Posted 2023-02-16

【中文标题】是否可以通过 Javascript 在 Adob​​e Animate CC HTML5/Canvas 项目中分配蒙版？

【英文标题】：Is it possible to assign masks in an Adobe Animate CC HTML5/Canvas project via Javascript?

【发布时间】：2017-07-10 12:09:36

【问题描述】：

我已经进行了一些挖掘，但找不到任何明确的文档。当用户点击舞台时，我想从库中拉出一个符号 A 的实例并将其放置在舞台上，然后拉出一个符号 B 的实例并将其分配为掩码。

我确信符号 B 是一个“有效”掩码，因为它只包含一个形状。

在过去，这很简单：

symbolAInstance.mask = symbolBInstance;

有什么方法可以使用 JS/CreateJS 来实现这一点？

谢谢！

【参考方案1】：

MovieClips 不能直接用作 CreateJS 中的遮罩，只能用作 Shapes/Graphics。 http://createjs.com/docs/easeljs/classes/DisplayObject.html#property_mask

如果您想使用更复杂的东西，如位图或影片剪辑，这是可能的，但需要几个步骤，并且有局限性。

缓存要用作蒙版的影片剪辑 在指向蒙版剪辑的cacheCanvas（缓存生成的位图）的“蒙版”剪辑上创建一个AlphaMaskFilter 缓存“蒙版”剪辑以应用过滤器。

AlphaMaskFilters 的文档有一个简单的示例。 http://createjs.com/docs/easeljs/classes/AlphaMaskFilter.html

主要限制之一是，如果您更改蒙版或蒙版剪辑（播放时间线、更改大小等），则必须重新缓存任何更改。因此，如果遮罩发生变化，遮罩和遮罩剪辑都需要重新缓存。这样做来为蒙版设置动画是非常昂贵的，如果可能的话应该避免。

希望对您有所帮助。