Jump to content

ColorReplaceFilter vs Tinting


Recommended Posts

Hi, right now I'm using tinting to change the color of my bitmap text, but I want to be able to change the stroke too.. as of now the stroke is black and the inside is white, so changing the tint works perfectly but what if I want to change the stroke? Is it worth having a separate sprite from the same texture overlap eachother, one with a white stroke and transparent fill color and one with no stroke and white fill color, then tinting each one appropriately.. 

The alternative is to use color replace filter and chang the black and white that way, but I know filters can be extremely expensive while tinting is free. But I'm wondering if color replace under the hood works similarly to tinting and I can get away with it? 


Link to comment
Share on other sites

Fllters are expensive because extra framebuffer change. Two sprites tinting is much better, because tinting is already present in pixijs default filter and doesnt require anything.

If you have experience with adding your shaders to pixi, its possible to batch ColorReplace shader using heaven SpriteRenderer (https://github.com/gameofbombs/pixi-heaven/blob/master/src/twotint/sprites/SpriteHeavenRenderer.ts), so colorReplace will be inside batcher too. That solution will allow you to use one sprite instead of two, and save 50% fillrate , but that will affect your app only if you have a full screen of those texts.

Link to comment
Share on other sites

25 minutes ago, visgotti said:

Awesome, thank you. I don't have experience with shaders but I was going to look into using color replacement anyway for changing color palettes for some of my character clothing, thanks for the info. 

There is "pixi-plugin-example" project that explains how to add custom renderer shader in v4. 

But adding pixi-heaven and extending "PIXI.heaven.MultiTextureSpriteRenderer" is faster, but it doesn't have example how to add uniforms there :(

I don't know what to recommend, how to learn those skills. Some people start from coding their own filter. In any case, its very hard to debug. 

Alternatively you can try to find someone who'll do it for you in pixijs slack, do you want an invite?

Link to comment
Share on other sites

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.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...