マスク対応

[SpriteStudio]

memo

• PIXI のマスク機能では不足があるようなので、自前実装が必要そう。(要詳細調査の段階)

[KengoNakata]

実装方針は以下のような形

var mask= new PIXI.Sprite.fromImage('./mask.png');
let colorMatrix = new PIXI.filters.ColorMatrixFilter();
colorMatrix.matrix = [ 0, 0, 0, 512, Math.round(-512 * 0.6),
                      0, 0, 0, 512, Math.round(-512 * 0.6),
                      0, 0, 0, 512, Math.round(-512 * 0.6),
                      0, 0, 0, 0, 1];
colorMatrix.blendMode = PIXI.BLEND_MODES.MULTIPLY;
mask.filters = [ colorMatrix ];

ColorMatrixでマスク境界をマスクに適用して二値化できるので、これをSpriteのマスクとして使用するとSSとほぼ同等の動作が実現できる。(上のコードの0.6の部分がマスク境界値)

[KengoNakata]

乗算なので、マスクテクスチャのコンテナを作る際はまず最初に白いテクスチャをいれる

[KengoNakata]

WIP: feature/mask

[SpriteStudio]

voted +1 from new user