在 EaselJS 中使用 SpriteStage 会使 Sprite 的蒙版不起作用

Question

我在 EaselJS 中使用 Sprites 制作动画，由于性能问题，我必须使用 SpriteStage class 来帮助提高性能。我还使用了很多遮罩来使精灵在某些部分被剪裁。

现在，当使用 SpriteStage 时，我的所有蒙版都不再应用。我认为这是因为 SpriteStage 不支持向 children 添加形状，但我认为它可以工作，因为我并没有真正将它添加到舞台的 children，只是将它应用于 Sprite .

我使用了另一个 SO 问题中的 this fiddle，添加了一些代码以显示遮罩在 SpriteStage 下不起作用。

var maskRect = new createjs.Graphics().drawRect(0, 0, 16, 16);
var shape = new createjs.Shape(maskRect);

var animation = new createjs.Sprite(ss);
animation.mask = shape; // Clip is applied

有没有办法在SpriteStage下使用遮罩？或者有什么方法可以达到同样的效果？

Answer 1

SpriteStage 用于基于 WebGL 的渲染，目前不支持 Graphics/vector 内容。这意味着不支持 EaselJS 形状和矢量蒙版。

您或许可以创建屏蔽内容，缓存它，然后使用 .cacheCanvas 作为您的 SpriteSheet。这并不理想，并且很难与多个精灵一起使用。您可以使用 SpriteSheetBuilder 生成有用的 SpriteSheet。这些只是建议，我之前没有测试过。

在 EaselJS 中使用 SpriteStage 会使 Sprite 的蒙版不起作用

Using SpriteStage in EaselJS makes a Sprite's mask not work

javascript

animation

sprite

easeljs