computern Posted February 20, 2018 Share Posted February 20, 2018 Hi, When a player goes behind something in my game, I still want them to be visible so when there is a collision I draw an outline of the player and mask it with a copy of the texture that is being touched. This works great apart from the colours of the outline get blended with the colors of the mask texture. So when the mask is something dark the outline is almost invisible. Disabling the mask shows what a difference there is. Sure I could make a solid white texture for everything the player could collide with but that would be an inconvenience. this.outline.mask = this.mask; this.maskContainer.addChild(this.mask); this.maskContainer.addChild(this.outline); Nothing I change seems to have any affect. Does anybody know if I'm doing something wrong or have any idea if its possible to disable/work around this so that the colours aernt affected? Any help would be appreciated. (I am using Pixi.js 4.5.1) Quote Link to comment Share on other sites More sharing options...
ivan.popelyshev Posted February 20, 2018 Share Posted February 20, 2018 Enter not-safe-for-newbs territory. Sprite mask uses ALPHA and RED channels. You can force it to use only alpha by changing the spriteMaskFilter fragment shader and rebuilding whole pixi: https://github.com/pixijs/pixi.js/blob/dev/src/core/renderers/webgl/filters/spriteMask/spriteMaskFilter.frag You can also use vanilla pixi + override "PIXI.SpriteMaskFilter" class with your own, change the fragment shader. Quote Link to comment Share on other sites More sharing options...
ivan.popelyshev Posted February 20, 2018 Share Posted February 20, 2018 And to do that for many characters, you have to draw trees twice: one like always, second only those who are above character, with WHITE color (change color with pixi-heaven or like that), use that lighting example from pixi-layers. Quote Link to comment Share on other sites More sharing options...
computern Posted February 22, 2018 Author Share Posted February 22, 2018 Thanks for the help Ivan. My preferred method was to overload it but I couldn't work out how. The code seemed to be trapped inside the constructor of the class or something. So I just downloaded pixi.js and removed the masky.r from the spriteMaskFilter function and it works great. So thanks very much. If you could work out how to overload it I would still prefer that for if sometime in the future i want to change versions but for now I am very happy. ivan.popelyshev 1 Quote Link to comment Share on other sites More sharing options...
ivan.popelyshev Posted February 22, 2018 Share Posted February 22, 2018 I have an idea to add that setting in pixijs so people dont have to override that thing Quote Link to comment Share on other sites More sharing options...
computern Posted February 22, 2018 Author Share Posted February 22, 2018 That would be awesome =) Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.