balance Posted March 14, 2019 Share Posted March 14, 2019 Hi, I have a need to put blendmode 'screen' on a sprite that is on top of a white rectangle to work as if the white rectangle and the canvas background was transparent. 1. Example of current situation https://www.pixiplayground.com/#/edit/MYDi0QdKVWk4MoO~uQ9Pd Here you can see that the sprite is blended in against the white rectangle to the left, and aginst the canvas background to the right. I need this to not happen, meaning the canvas background and white rectangle should be treated by the blendmode as transparent. The reason is that the white rectangle and canvas background is just for the visual purpose of showing a page you can put things on. 2. How I need the sprite to actually look (even though there will be a white background rectangle, and canvas background color) https://www.pixiplayground.com/#/edit/J~mzZDlvWdnSZs_2pcBZd What I'm trying to achieve is something that works like in Indesign: In the screenshot from Indesign above you see a page, you put things on the page, but the blendmode acts as if the page is transparent - not white. You can see that the blendmode works as expected against the white background rectangle, but treats the white of the page as transparent. TLDR; Is there a way I can have the white background rectangle and the canvas background be treated as transparent like in Indesign, when the foreground sprite has blendmode 'screen'? Quote Link to comment Share on other sites More sharing options...
ivan.popelyshev Posted March 14, 2019 Share Posted March 14, 2019 1. the sprite gets blended to our canvas framebuffer , which contains your white rectangle. 2. all canvas is blended with NORMAL (no way to change that) blendmode to page background by a browser, we cannot control that. According to https://github.com/pixijs/pixi.js/blob/v4.x/src/core/renderers/webgl/utils/mapWebGLBlendModesToPixi.js#L20 , our screen blendmode has [gl.ONE, gl.ONE_MINUS_SRC_COLOR] coefficients for both color and alpha, and all colors are premultiplied. You can try to change that with direct hack, modifying blend talbe that is used by "renderer.state" or through method described in this topic, IT DEPENDS ON PIXI VERSIONM WHETHER ITS V4 OR V5: Unfortunately, most of those kind of cases are unsolvable if you dont take pen and paper and start writing formulaes for blending. 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.