Changing the spacing/padding of a bitmap font after generation?

Started by
4 comments, last by WitchLord 2 years, 4 months ago

I generated a font with BMFont and I colored and added shadows to the characters, but I need more spacing between the letters without remaking the font from scratch. I also would like to be able to see more of each character as the shadow I've added is being cut off. Is there a way of adding more space (or padding? I'm not sure which) after the font has been created? I couldn't figure out how to space the characters before in the export options and nothing changed it.

None

Advertisement

I'm not aware of any existing tool that would let you change the padding on an existing bitmap font. But it is possible to create one. Basically the tool would have to read in the bitmap font separate out all the glyphs add padding and then write a new bitmap font with the new glyphs.

The question is whether it will be less effort to write such a tool than to start over from scratch. Did you spend a huge amount of time coloring and adding shadows to the generated font?

When generating a font from scratch that you want to add a shadow to you want to add padding in the export options. The padding will increase the size of the cell that will be drawn by the game/application.

Spacing on the other hand is just adding empty pixels between cells in the texture. This is necessary if the texture will have mipmaps or use interpolation between pixels when rendering, otherwise color from different glyphs may bleed into each other causing visual artifacts.

AngelCode.com - game development and more - Reference DB - game developer references
AngelScript - free scripting library - BMFont - free bitmap font generator - Tower - free puzzle game

From a slightly different angle: Is coloring the font and adding shadows directly really the best idea? Unless you are going for a very specific graphic style, or have some technical requirments that mandates you bake this information into the font, wouldn't it be more flexible to have shadows separately - for example, by drawing the same font at a certain offset with a different color? Outside of the potential overhead (which could be mitigated by caching or specific shaders), this solution would give you a lot more flexibility in what types of shadows you have (for example, in my own game I have 4 different colors of shadows for the same font depending on where its used). Similiarly, having the font base-white while applying the color in the application gives you more flexibility as well.

Again, not sure if this collides with some of your requirements that I don't know about, but just thought I'd mention it.

WitchLord said:

I'm not aware of any existing tool that would let you change the padding on an existing bitmap font. But it is possible to create one. Basically the tool would have to read in the bitmap font separate out all the glyphs add padding and then write a new bitmap font with the new glyphs.

The question is whether it will be less effort to write such a tool than to start over from scratch. Did you spend a huge amount of time coloring and adding shadows to the generated font?

When generating a font from scratch that you want to add a shadow to you want to add padding in the export options. The padding will increase the size of the cell that will be drawn by the game/application.

Spacing on the other hand is just adding empty pixels between cells in the texture. This is necessary if the texture will have mipmaps or use interpolation between pixels when rendering, otherwise color from different glyphs may bleed into each other causing visual artifacts.

Yeah, I hand dither-gradient-ed each letter (aseprite, so not completely manual but each letter was done individually) and the shadow was a special sort of tinted shadow that I used a particular effect on. I used a padding of 0 but a spacing of 5, it seemed to still have enough area to actually add a shadow to work with so not sure if the spacing helped or not.

Juliean said:

From a slightly different angle: Is coloring the font and adding shadows directly really the best idea? Unless you are going for a very specific graphic style, or have some technical requirments that mandates you bake this information into the font, wouldn't it be more flexible to have shadows separately - for example, by drawing the same font at a certain offset with a different color? Outside of the potential overhead (which could be mitigated by caching or specific shaders), this solution would give you a lot more flexibility in what types of shadows you have (for example, in my own game I have 4 different colors of shadows for the same font depending on where its used). Similiarly, having the font base-white while applying the color in the application gives you more flexibility as well.

Again, not sure if this collides with some of your requirements that I don't know about, but just thought I'd mention it.

Yeah, it was for a specific style, all the coloring and shadow looks are specific that can't really be done at runtime.

Can I just adjust the .fnt file to add more spacing or do all the glyph details depend on the spacing settings?

None

Without modifying the texture, you can manually edit the .fnt file to reduce the spacing and increase the padding for each glyph. That would allow you to keep the same arrangement of the glyphs in the texture, but still allow the application to render the shadow you added to the glyphs.

You'll have to pay attention to the before mentioned color bleeding if you reduce the spacing too much though.

To change the .fnt file use e.g. Notepad++ (assuming you used text or xml format) to adjust the x, y, width, and height to add the padding around each char. xoffset and yoffset may also need to be adjusted depending if you change x and y.

http://www.angelcode.com/products/bmfont/doc/file_format.html

Alternatively you may also generate a new bitmap font with appropriate padding, and then manually copy paste each colored glyph individually to the new texture. At least you won't have to manually add the dithering and shadow, so it might not be such a big effort after all.

AngelCode.com - game development and more - Reference DB - game developer references
AngelScript - free scripting library - BMFont - free bitmap font generator - Tower - free puzzle game

This topic is closed to new replies.

Advertisement