Asset - Fonts Distance Field Fonts

[Mike]

https://marketplace.yoyogames.com/assets/8656/distance-field-fonts

This free package allows for Distance Field Font rendering. Distance field fonts allows for much smoother scaling, and for effects such as single pass outline rendering - with custom border thickness. Thicker borders are a desirable effect but usually cause severe slowdown, which this method doesn't suffer from.

This package also demos multiple fonts, colouring, scaling and rotation.

This package uses the output from a website which easily generates these fonts (with different sizes/fonts), which can be found here: https://evanw.github.io/font-texture-generator/

 

[Mike]

V1.0.2: Have updated to remove the dynamic glm_release_mode() calls. Seems like these cripple Android (at the very least). Now runs at a full 60fps on a low end android device.

 

[Yal]

This looks really cool! I recently worked on a game where I wanted to use crisp modern fonts instead of the pixelated ones I usually use, and had to use a workaround with 4 different copies of the font at different font sizes (and drawn to the GUI layer) to make it still look crisp when the game was scaled up to 1920x1080... this package would've saved me a lot of headaches.


Though... from what I could tell, the font generator whose output is used can only use standard system fonts (it disables the "generate texture" button if you type in an unrecognized font name, even if there's a font with that name installed on the system, so I guess it can only use the Core Fonts For the Web or some similar set). This could be a pretty severe usability limitation (at least if you're like me and use obscure weird fonts as part of the game's branding)... but that problem's on the generator, of course, not this extension. (But being a swede, I can't not complain, so... )

I'm not well enough versed in HTML to tell how trivial/hard it would to adapt the generator for this, especially not 40 minutes past midnight on a monday morning, but I feel it's worth pointing out that the generator that creates the textures doesn't support more than a specific list of fonts for now and here be dragons or something, so beware. (But it's open-sourced so anyone that wants to use their own fonts probably can figure it out....)

 

[❤️×1]

This looks really cool! I recently worked on a game where I wanted to use crisp modern fonts instead of the pixelated ones I usually use, and had to use a workaround with 4 different copies of the font at different font sizes (and drawn to the GUI layer) to make it still look crisp when the game was scaled up to 1920x1080... this package would've saved me a lot of headaches.


Though... from what I could tell, the font generator whose output is used can only use standard system fonts (it disables the "generate texture" button if you type in an unrecognized font name, even if there's a font with that name installed on the system, so I guess it can only use the Core Fonts For the Web or some similar set). This could be a pretty severe usability limitation (at least if you're like me and use obscure weird fonts as part of the game's branding)... but that problem's on the generator, of course, not this extension. (But being a swede, I can't not complain, so... )

I'm not well enough versed in HTML to tell how trivial/hard it would to adapt the generator for this, especially not 40 minutes past midnight on a monday morning, but I feel it's worth pointing out that the generator that creates the textures doesn't support more than a specific list of fonts for now and here be dragons or something, so beware. (But it's open-sourced so anyone that wants to use their own fonts probably can figure it out....)

Well, if you have the patience, there is already a Distance Field implementation for GMS2, a multi signed distance field implementation actually, but it's in a dead branch of @Juju's scribble : https://github.com/JujuAdams/scribble/tree/dev-msdf (or you could use this version which fixes the transparency bug with very short strings : https://github.com/LastLifeLeft/scribble/tree/dev-msdf ). It uses font generated by https://msdf-bmfont.donmccurdy.com/ which works with any font you want. Keep in mind that it's not supported and has its share of problem.

 

[Mike]

This looks really cool! I recently worked on a game where I wanted to use crisp modern fonts instead of the pixelated ones I usually use, and had to use a workaround with 4 different copies of the font at different font sizes (and drawn to the GUI layer) to make it still look crisp when the game was scaled up to 1920x1080... this package would've saved me a lot of headaches.


Though... from what I could tell, the font generator whose output is used can only use standard system fonts (it disables the "generate texture" button if you type in an unrecognized font name, even if there's a font with that name installed on the system, so I guess it can only use the Core Fonts For the Web or some similar set). This could be a pretty severe usability limitation (at least if you're like me and use obscure weird fonts as part of the game's branding)... but that problem's on the generator, of course, not this extension. (But being a swede, I can't not complain, so... )

I'm not well enough versed in HTML to tell how trivial/hard it would to adapt the generator for this, especially not 40 minutes past midnight on a monday morning, but I feel it's worth pointing out that the generator that creates the textures doesn't support more than a specific list of fonts for now and here be dragons or something, so beware. (But it's open-sourced so anyone that wants to use their own fonts probably can figure it out....)

Yeah, it's a limited set and was just the easiest to get something up and running quickly. I'll probably look to do a separate generation tool at some point - or see if I can extend the webpage to do more fonts or something....

It's also worth noting this is a single channel version, not multi-channel. Not much difference code wise, except I didn't like some of the "flat" areas the multi-channel one generated, so opted for this instead.

I also needed variable thickness borders, which single channel gives more easily.... still, it's free so hey-ho.

 

[Mike]

Had a play with adding more font's to that generation page.... it's pretty simple. Download the page source, then go to Google fonts (https://fonts.google.com/) and click a + on one of the fonts.

a "Family Selected" box will appear at the bottom (and you can add more fonts if you like). Expand this box and copy "link"

a line that looks like this....
<link href="https://fonts.googleapis.com/css?family=Roboto&display=swap" rel="stylesheet">

Then add this to the webpage "body", and then make sure the name (Roboto in this case) is in the autocomplete list. run the page again (I upload it to my webserver). You can then select this font and generate a Distance Field based on it....

Which isn't too bad...

EDIT: that generation page is actually been made public domain, so you could change it and upload it publicly if you like.

License it uses...
https://creativecommons.org/publicdomain/zero/1.0/