Render pixel overflow on multiple image texture!

I created bitmap font rendering code. I draw the characters on one texture. Some characters when drawn, such as the ‘i’, will overflow into the next character, in this case ‘j’, on the texture. I tried spacing the characters out by 1 or 2 pixels. 1 or 2 pixels works with small fonts, but when the fonts are huge I need at least 10 pixels of space between each character.

Is this a common problem? How do I stop it?

Well, it’s common for me.

I just make the padding larger, but my font characters are never much larger than say 16p or so, which fit neatly in a 256x256 texture, 512x512 tops.

You could try using different padding amounts and packing them into a square texture algorithmically (if image real estate is your concern), but I think it’s not worth the trouble. Performance wise you probably have the most to gain by just batching as much of your rendered text together as possible (avoid state changes and switching textures).


This is my workaround for now:
byte overflowPad= fontH*.05f;

Seems to be enouph spacing for any size font to avoid overflow.