javascript - 如何在phaserjs中使用混合

Question

我已经搜索了整个文档，实际上我下载了它们并手动搜索。我发现的只是过滤器方法，它允许您使用您必须编写的 webgl 着色器。

我想要的是一种混合，就像你在 Photoshop 灯光混合中看到的图层等一样。

在互联网上，我在 pixijs 中找到了示例，并谈论了半年前发生的未来支持它。因此，请任何一直关注 Phaserjs 并了解 filter/blendMode 的人告诉我。

Answer 1

新的 Phaser 2.0 引入blendMode了 Sprite 对象的属性。并且有一个 PIXI 枚举用于识别：

PIXI.blendModes = {
    NORMAL:0,
    ADD:1,
    MULTIPLY:2,
    SCREEN:3,
    OVERLAY:4,
    DARKEN:5,
    LIGHTEN:6,
    COLOR_DODGE:7,
    COLOR_BURN:8,
    HARD_LIGHT:9,
    SOFT_LIGHT:10,
    DIFFERENCE:11,
    EXCLUSION:12,
    HUE:13,
    SATURATION:14,
    COLOR:15,
    LUMINOSITY:16
};

所以，你可以简单地写

sprite.blendMode = PIXI.blendModes.ADD;

就在这里。

Answer 2

你可以简单地使用：

spriteName.blendMode =  PIXI.blendModes.TypeOfBlendMode;  

在哪里：

spriteName 是精灵的名称（比如说玩家/敌人），TypeOfBlendMode 是您要使用的混合类型（可以是以下之一：NORMAL、ADD、MULTIPLY、SCREEN、OVERLAY、DARKEN、LIGHTEN、COLOR_DODGE、 COLOR_BURN、HARD_LIGHT、SOFT_LIGHT、DIFFERENCE、EXCLUSION、HUE、SATURATION、COLOR、LUMINOSITY）。

示例：假设精灵名称是播放器，我想将混合模式设置为 MULTIPLY，然后我会写：

player.blendMode = PIXI.blendModes.MULTIPLY;