Download

Bitmap (Pixel-y) Fonts

I’ve found a few old topics discussing the use of bitmap (i.e. offline) fonts in UMG, but most of them are simply “you can’t do it” - I haven’t been able to find a solution to actually using them. It seems that most people’s use case was creating custom styles, which is addressed via the font material system, so the limitation doesn’t get much discussion these days.

I’m trying to make a PS1 retro-inspired game and, obviously, having smooth fonts doesn’t match the aesthetic. Bitmap fonts seem to be the best solution to this, but they don’t work work with UMG. I’ve thought of a few possible workarounds:

  • Render the entire UI at a lower resolution, if this is possible (I’m already using renderscale to drop the internal render resolution)
  • Use the font material system - I’m not sure it can achieve the pixel-y effect though?
  • Use some hackery with the decorator class to replace each letter with an image; this seems like an overkill solution though and requires C++, which I have no knowledge of

So has anyone managed to pull off a pixellated font look, without using C++ / Slate to drive it? I’m aware that workflow still supports offline fonts, but I really can’t build my entire UI that way.

It needs C++ to create the widget that makes it, im also looking into how to do it since is way easier to stylize the font in an external program than to use the internal render of UE4, also for some fonts the engine deforms the font (i made an 8bit NES style font to test something and oh my, it looked like ■■■■)

The problem with the “new” way is that it is procedural at run time, which as good as it might look at any resolution, it has it own share of problems, you cant easily add letters with a typewriter effect and changing color of a single word, it needs the richtextblock, which adds a small space after closing the style word

You might have seen those already, but is the only thing i have found that talks about bitmap fonts, a plugin that is not available for sale and an old post about a plugin that couldnt be sold on the marketplace

https://forums.unrealengine.com/unreal-engine/marketplace/28407-umg-bitmap-fonts

Yes I concluded the only way to do this was via C++, as Slate can still use bitmap / offline fonts. That said I don’t know C++ and so hadn’t decided what to do about that yet.

It’s a shame that plugin isn’t available as that does seem to solve the problem. It says compatible with 4.24 too, so clearly someone is updating it / maintaining the description?

Very frustrating all around. The best interim solution I have is to use a 3d widget render and try to force the resolution down, mixed with nearest-neighbor filtering, it gives a good enough ‘retro’ look. But it still requires styling the font with font materials, which isn’t ideal.

Im working on a prototype with atlas and a render target on a widget, the problem is that you cant see the results in the widget editor. But is basically how a bitmap font works

I just finished with the logic of the BP version. I wanna try to make a C++ component, but im really bad at C++, but the logic is actually pretty simple.

Thought I’d update this topic with a solution, of sorts - it’s not a way to get bitmap fonts working, but it does give you the ability to pixellate UMG widgets for a ‘retro’ style game. Basically if you use a retainer box, then the child widgets get pushed to a rendertarget and can be manipulated via a custom material. By pixellating the UVs of that material, you can make the effective UI resolution much lower.

I have an example of it in my PSX shader pack, available free on github here.