Convert a pixel-perfect ImageFont to a TrueType font?

Questions about the LÖVE API, installing LÖVE and other support related questions go here.
Forum rules
Before you make a thread asking for help, read this.
Post Reply
User avatar
V360
Prole
Posts: 3
Joined: Sat Jan 13, 2018 5:08 am
Contact:

Convert a pixel-perfect ImageFont to a TrueType font?

Post by V360 » Mon May 20, 2019 7:14 pm

Does anyone know a way to convert an ImageFont to a TrueType font? I've tried FontStruct and FontForge, but neither of them give me any good options other than "recreate the entire thing".

User avatar
zorg
Party member
Posts: 2618
Joined: Thu Dec 13, 2012 2:55 pm
Location: Absurdistan, Hungary
Contact:

Re: Convert a pixel-perfect ImageFont to a TrueType font?

Post by zorg » Mon May 20, 2019 8:32 pm

Why do you need to do the conversion?
Me and my stuff :3True Neutral Aspirant. Why, yes, i do indeed enjoy sarcastically correcting others when they make the most blatant of spelling mistakes. No bullying or trolling the innocent tho.

User avatar
pgimeno
Party member
Posts: 1686
Joined: Sun Oct 18, 2015 2:58 pm

Re: Convert a pixel-perfect ImageFont to a TrueType font?

Post by pgimeno » Tue May 21, 2019 4:10 pm

What's an ImageFont, anyway? The Google references I can find are a Python library with that name.

If you just mean an image-based font, I've seen such conversions done with a couple fonts (ZX81 and Frontier). I suspect they were not done with an automatic program, but I can't tell for sure.


User avatar
pgimeno
Party member
Posts: 1686
Joined: Sun Oct 18, 2015 2:58 pm

Re: Convert a pixel-perfect ImageFont to a TrueType font?

Post by pgimeno » Tue May 21, 2019 4:44 pm

Gah, should have looked that up first. Thanks.

User avatar
raidho36
Party member
Posts: 1796
Joined: Mon Jun 17, 2013 12:00 pm

Re: Convert a pixel-perfect ImageFont to a TrueType font?

Post by raidho36 » Wed May 22, 2019 3:41 am

There are online font generators that can create fonts from images. So, you can try generating a font image from your image font, and then feed it to one of those font generators.

User avatar
V360
Prole
Posts: 3
Joined: Sat Jan 13, 2018 5:08 am
Contact:

Re: Convert a pixel-perfect ImageFont to a TrueType font?

Post by V360 » Wed Jun 05, 2019 3:06 am

TL;DR: http://fontcutter.fbksoft.com/ is useful, mess around with values in the resulting .fnt file using this, everything before the "Binary file layout" header

Unfinished garbage tutorial draft below:

Whoops, I abandoned this thread after making it. Good news though: I found a basic workflow that's pretty good! Gonna write this blog-style, starting from the top.

So, a lot of game engines support "Bitmap Fonts", which are made up of an image file and a .fnt file. Bitmap fonts are typically made from existing fonts you have installed to your font folder, generated using this tool. However, there is a way to make your own Bitmap font. And no, it won't force you to waste hours recreating it in FontForge. (I didn't know you can't overlap points until I went to export it... :cry:)

There's an open-source tool called "Fontcutter". It's a bit old, and it has quite a few bugs, but it's a great starting point. It takes in image files that are somewhat like the Love2D image fonts, and slices them and outputs a .fnt file. I say "somewhat like" because there's a catch: you can't just throw in a normal Love2D and expect it to immediately work. There's two catches actually. First: the program only supports monospace fonts. Second: you're gonna have to remove the background color that separates each glyph. (If you don't have a monospace font, keep a backup!)

Don't be discouraged by either of these! A little tweaking and it will work. Set the text lines to one, dump in your glyph string, (don't forget to correct the escaped characters!) and make sure that the glyph string neither begins or ends with a space, as that space will get removed! Then, adjust the char width and char height parameters to fit at least one of your characters.

Now, check the preview tab. If you didn't make a monospace font, keep moving and try not to throw up. Don't worry, we'll fix this in a second. Even if your font looks good in the preview tab, there's a few things we'll have to change. Check the Ouput [sic] tab and select all the text. Copy it into a new text editor window. Save it as whatever you want, just don't forget to give it the .fnt extension. Wait a sec-- did we just make a .fnt file? Yep. Internally, it's that simple.

Now, this is the hard part. If you have a monospace font and your font looks good, skip the next paragraph.

You're gonna have to open a good pixel-perfect image editor like Aseprite or Paint.Net, and go through, glyph by glyph, correcting each of the parameters. todo finish draft

User avatar
zorg
Party member
Posts: 2618
Joined: Thu Dec 13, 2012 2:55 pm
Location: Absurdistan, Hungary
Contact:

Re: Convert a pixel-perfect ImageFont to a TrueType font?

Post by zorg » Wed Jun 05, 2019 3:20 am

You still managed to not explain why you are not satisfied with löve's style of imagefonts...

THEN AGAIN, the wiki clearly states that löve ALSO supports the bmfont format, so i'm unsure what you're on about with the fontcutter thing, since i feel like that's also useless in this context.
Me and my stuff :3True Neutral Aspirant. Why, yes, i do indeed enjoy sarcastically correcting others when they make the most blatant of spelling mistakes. No bullying or trolling the innocent tho.

User avatar
pgimeno
Party member
Posts: 1686
Joined: Sun Oct 18, 2015 2:58 pm

Re: Convert a pixel-perfect ImageFont to a TrueType font?

Post by pgimeno » Wed Jun 05, 2019 3:38 pm

Yeah I have that feeling that this a case of seeking help with an extremely convoluted solution for a problem that should be simpler to solve.

Post Reply

Who is online

Users browsing this forum: Exabot [Bot], Google [Bot] and 9 guests