2D Toolkit Forum

2D Toolkit => Support => Topic started by: cloudcamaleoniv on July 10, 2013, 08:38:04 am

Title: Font outline - Changing color along with text.
Post by: cloudcamaleoniv on July 10, 2013, 08:38:04 am
Okay. I took BMFont, exported some black-outlined fonts. Changed the black outline to green in photoshop. When I import the font to Unity, with tk2dFont, created a TextMesh Component and changed its tk2dTextMesh color, the border paints along with the text. Okay, tk2d doesn't know anything about borders, it only knows what's inside the texture, so it paints everything.

I'm doing something wrong? Is there a way to to this?

I mean, I could paint the white parts in photoshop to the color I want, BUT, is there a way to choose the color dynamically in 2d toolkit. but leaving the border color intact?


Thanks.
Title: Re: Font outline - Changing color along with text.
Post by: unikronsoftware on July 10, 2013, 11:08:39 am
You can't do it out of the box, you'll need a custom shader (and possibly some custom font data) to go with it.
Edit: Basically, you need a way to mask the character - you can do it using different alpha values, or something similar.
Title: Re: Font outline - Changing color along with text.
Post by: cloudcamaleoniv on July 11, 2013, 08:47:14 am
Hell... no idea how to do this...

But if you say it's possible, I'll do some research. Thanks man!
Title: Re: Font outline - Changing color along with text.
Post by: x8105 on July 18, 2013, 10:33:05 pm
I ended up making 2 layers of txt, coloring the back text, scaling the front text, and adjusting the spacing, not sure what the impact on performance is because I was only using it on a couple test scenes, makes for some cool tween / animation sequences if you do this on a letter by letter basis.

Now what are the steps to making an additive textured font, I am assuming you create a new font and material out of the original texture with an additive shader, Been too busy to test... but insight is welcome.
Title: Re: Font outline - Changing color along with text.
Post by: profanicus on July 19, 2013, 01:06:04 am
Unikron mentioned distance fields in another thread, so I was thinking maybe that is something you could look into for this? I imagine you would need to export from your font package with extra padding though to accommodate the distance information it uses.

Here (http://www.valvesoftware.com/publications/2007/SIGGRAPH2007_AlphaTestedMagnification.pdf) is Valve's original paper on the technique, which includes how to do outlines (and drop shadows) in the shader. And here (http://www.horde3d.org/wiki/index.php5?title=Preprocessing_Technique_-_Distance_Field_Vector_Textures) is a way to make the distance data without an encoding application, using Photoshop.

Note that I haven't tried any of this with tk2d, I was just reading about it after Unikron mentioned it. :)