8 Comments

  1. Steve T say:

    Hi Sergey,

    Thanks for making this tutorial, it works like a dream.

    Unfortunately I have a sprite with a white border and this border is affected by the tint colors. I’m new to shader writing, can you give me any advise on how to make this work with a white outline please? I don’t even need the alpha to darken areas – just red, green, blue as tints and the white to remain untouched.
    Thanks again, great site.

    • admin say:

      Hi Steve

      Replace line

      baseColor = alpha * (baseColor.r * _TintColorRed ……

      with this formula

      float iswhite = step(baseColor.r + baseColor.g + baseColor.b, 2.95f);
      baseColor = iswhite * (alpha * (baseColor.g * _GreenMaskColor + baseColor.r * _RedMaskColor + baseColor.b * _BlueMaskColor)) + (1.0 – iswhite)*baseColor;

      ‘iswhite’ will be = 1 if you desn’t have white color and = 0 if you have it

      • Steve T say:

        Hi Sergey,

        Thanks very much for your help. There’s no way I would have figured that out and I tried lots of things.

        However, I can’t get it to compile without errors. I suspect the _RedMaskColor should be _TintColorRed etc, but even then I get errors on the ‘float iswhite’ line and that seems ok to me. Odd..

        Also, I forgot to mention but my edge is an anti-aliased white outline created in Photoshop as a Layer Style and exported as PNG, so the alpha should take care of the edge transparency. Does that affect the code you wrote?

        Thanks again!

          • Steve T say:

            Thanks again Sergey. That worked this time.

            It didn’t quite have the desired effect. The area where the colors overlaps is not well blended. Here’s my example sprite.

            http://i59.tinypic.com/2nqsdc7.jpg

            The image on the left is the original. The one on the right is tinted.

          • admin say:

            Oh, you need blending between mask color and white color. No, it is impossible. You cannot blend colored and uncolored parts of image, because in the border you will have not a white color and for shader logic it is masked color.

            In this calse you need to have two parts of image – colored with alpha and not colored (white in your case). Than in shader you simply blend this two images.

            I will add this shader to the article as soon as I get some free time.

  2. Steve T say:

    Yes, I suspected it wasn’t possible. I have a solution I can work with though. I use red and blue for the two body colors (this is all I need), and I use green for the outline and eyeball on my character which I tint to white. The pupil in the eye stays black. So this is all good and they blend together perfectly.

    Thank you again, you are very generous with your time. I’ll credit you in my game if it ever sees the light of day!

Write a comment