koobas.hobune.stream
Edit generated BitmapFont from Unity 4 for use in GUI
So I have created an editable copy of a Font in Unity 4, so that I can use multicolored fonts, textshadows, strokes etc. for GUI Controls.
Problem: The GUI-Text shader (and other Shaders that I found on the Wiki) doesnt seem to render any colorinformation given by the .png with the bitmap font. So if I make a red stroke around the font, the font just gets thicker, but stroke and font have the same color.
I didnt use a dynamic font, I used the GUI-Text shader, and GUI-Texture-Type for the bitmap image of the font. I might be just plain stupid, but I cant find any tutorials or walkthroughs or the like for this kind of stuff... so I would be glad if somone with any experience on this issue could help me please.
ASCII and Unicode fonts in Unity render out the glyphs to a texture. This texture is greyscale to save memory space. If you want a coloured glyphs, where, for example, each glyph is a different colour, you might want to use the almost completely undocumented "custom font". In the Project window use Create->Custom Font. The inspector gives you a whole load of options, which basically ask you to say how the glyphs are arranged in your texture. See http://answers.unity3d.com/questions/355953/custom-font-completely-broken-in-unity-4.html for advice on this. It's non-trivial.
To help as much as I can, here is a font texture. It's colored numbers on a grid, with each number 64x64 pixels. Get that into Unity, and then make a material with it. Create a custom font, and then apply the values you see in the inspector screenshot. That should get you the first 4 glyphs rendering correctly. Understanding the UV and Vert data takes a bit getting your read around. It seems to help mentally if you flip the font texture so it's upside down. (Don't do this in Photoshop, just hold the inverted texture in your head.) The UVs are then the coordinates of the corners of each of these 4x4 tiles. Note how the zero glyph in this vertically flipped mental image of the texture starts at V=0.75 and ends 0.25 later at V=1. The U/X coordinate and width works how you expect/want it to. For the pixel rectangle, the height has to be -64, but I can't figure that out just yet. For the next row of glyphs, from 4 to 7, the UV.y will be 0.5.
The other thing that cuaght me out when I had a quick play is the Index in the array of Character Rects is zero based and not the ascii char of the character. So, in my programmer artwork example (ascii chars 48 onwards) I have the Ascii start offset in the font set to 48, and then the indices are zero-based.
Will try and get some proper docs written.
Thanks for the detailed information, really appreciate it. I thought I could get around the custom font stuff, because I find it rather tedious...
And I dont get the point of the "make editable copy" function in Unity 4, when it doesnt really work (only managed to get it to work with GUI-text object and not any GUIControls). So if I want a text-shadow or stroke or whatever on any GUI-Controls I HAVE to make a Custom font? Or does it than still only work with GUI-Text and not with other GUIcontrols? welcome to 2013...
When used with a font, "make editable copy" will give you a png, material and the font settings. I guess an editor script can copy the font settings over into a custom font using Font.characterInfo. If you then color the png and make a suitable shader, I think you'd get what you want. Yes, it's not easy. :-(
#pragma strict
// copy glyph data from MyFont.ttf into a custom font called f2
//
@MenuItem ("Font/doit")
static function Doit() {
var f1 : Font = AssetDatabase.LoadAssetAtPath("Assets/MyFont.ttf", Font);
Debug.Log(f1.characterInfo.length);
var f2 : Font = AssetDatabase.LoadAssetAtPath("Assets/f2.fontsettings", Font);
Debug.Log(f2.characterInfo.length);
var myCI : CharacterInfo[] = new CharacterInfo[f1.characterInfo.length];
for (var i = 0; i < 95; i++){
myCI[i] = f1.characterInfo[i];
}
f2.characterInfo = myCI;
}
Thanks again! ...why does it have to be that complicated -.-
I'm trying to figure out what this script does. Is it getting the rect data from a font and applying it to one of Unity 4's weird fonts…?
In Unity 4.2 i just created an editable copy of the font, changed the PNG to have coloured text and edited the material of this custom font to use the 'Unlit/Transparent' shader. And now i have coloured text.
