Spritefont generator for Construct 2/3.

Post reply
6 favourites
From the Asset Store
Target 2.0 Slot HTML5 Construct 2 and Construct 3
$15 USD
Casino? money? who knows? but the target is the same!
bellborn's avatar
bellborn

  • Here is a tool to help generate a Spritefont from any font:

    dropbox.com/s/zh299ngxv6lbfwq/spritefont_gen.capx

    Here is an example of using the generated spritefont:

    You setup the spritefont with the generated image, set the character width/height to the same as what you used in the tool, and finally use one event to set the individual character widths from the tool. Or in C3 you just set the spacing data.

    C2 example:

    dropbox.com/s/3iw0zrr0xh8skdi/spritefont_test.capx

    C3 examples:

    dropbox.com/s/3iw0zrr0xh8skdi/spritefont_test.capx

    dropbox.com/s/6xlkjo1blewshff/spritefont_test_arial.c3p

    known bugs:

    * You need to make sure all the letters fit onscreen or it will break.

    -cheers

  • Is there option to change colour?

  • Wow that's an Awesome Tool R0J0hound

    Thanks for sharing

    I have been trying to replicate for a long time the normal Txt Arial(12) from Construct into SpriteFonts using the Blackhornet's tool but I never had any success as they get a bit blurry, maybe I'm doing something wrong though.

    I tried yours and the final SpriteFont export looks very clean png but when I test it in Construct it looks very blurry not sure why.

    Is there any way to replicate the Arial(12) into a spriteFont without any blurriness?

    My target is something looking sharp and clean as the txt objects do.

    Here are my results:

    Capx:

    https://www.dropbox.com/s/8qo9ik8e6dki8xh/1-Arial%20%2812%29.capx?dl=0

  • Updated.

    * aliasing with threshold.

    * offset x and y instead of using the same value.

    * color

    * gui cleanup

    * gridlines to see if the characters fit in the bounds.

    * fix so characters are less likely to be clipped.

    * fix some math errors.

    Known bugs:

    FIXED: * color with threshold seems to be broken.

    * If the image size is bigger than 1024x512 things will break.

  • ashconstruct

    Download again. It now lets you change color.

    tarek2

    I added an option to remove the aliasing with an effect. Beyond that I’ll have to go beyond construct to have more rendering options. The text object will look blurry if you change the construct project setting from high quality to low quality. So I think construct renders text at a higher res and scales down.

  • Really awesome dude. I made myself a checkbox for the AlphaClamp already but yours is obviously much more elegant. I wonder if there's some way to generate/parse an out of the box JSON String for C3 right in your little App that you could then just copy paste into the editor where you use the generated Spritefont... It's easy enough to use as it is already but i mean that would basically make it the de-facto sprite font tool for all times :D Awesome job either way! Thanks again!

  • joelmayer

    I need to look around at the asjson format at bit more. It’s no problem generating it, but I don’t need all the data such as position and size.

    Currently you still need to fiddle with the grid sizes and offsets so that all the characters fit in their own boxes. A future idea would be to automatically find those values for a best fit and smaller overall image size. A side effect is it would allow larger textures too without as many workarounds as I have now.

  • Understand completely. For me personally, i don't mind adjusting the grid manually at all, in fact, a lot of commercial sprite font generators have you do this anyway. The one bottle neck is the JSON string. But, again, thanks for all your effort!

  • I love this generator. Awesome work. The color chooser update is great, thanks for showing how to convert colors.

    rgb(int(tokenat(fontColor.Text,0,",")), int(tokenat(fontColor.Text,1,",")), int(tokenat(fontColor.Text,2,",")))

    It would be cool to get a list of all available fonts or choose from a dropdown list with all available fonts.

  • totoe

    Unfortunately in the browser you can only check if a font is installed. You can’t get a list of all the installed fonts.

    Most online editors just have a list of fonts that they check to see are installed. Perhaps I could do something like that at some point.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads

  • Thanks for reply. Keep up being awesome!

  • I added an option to remove the aliasing with an effect. Beyond that I’ll have to go beyond construct to have more rendering options. The text object will look blurry if you change the construct project setting from high quality to low quality. So I think construct renders text at a higher res and scales down.

    Thank you R0J0hound

    I tested again but I cannot manage to create a nice clean one like the Normal txt object, I think this is a very difficult thing to replicate if not impossible and I don't wanna make you lose time on it so for that specific txt info I will keep using the normal txt for now and for anything else I will use your SpriteFont.

    Thanks again for your time

  • Updated again:

    * fixed the coloring issue.

    * let you use "white" or "black" as a color in addition to "r,g,b".

    * added an option to change the background to be darker when using lighter colors.

    * now generates the "spacing data json" that C3 uses. So in c3 no events are needed to setup the spacing. joelmayer

    * some general event cleanups.

  • Updated again:

    * fixed the coloring issue.

    * let you use "white" or "black" as a color in addition to "r,g,b".

    * added an option to change the background to be darker when using lighter colors.

    * now generates the "spacing data json" that C3 uses. So in c3 no events are needed to setup the spacing. joelmayer

    * some general event cleanups.

    R0J0hound

    Dude thank you so much seriously. I can imagine it took you hours and I really appreciate that a lot, this thing will be so useful in the future for so many people. Really really appreciate it thanks a ton!!!

    Again, if I can give you a small donation or anything anywhere, let me know I don't want you to feel like your time and effort is taken for granted.

    Thanks!!!! <3 <3 <3

    Got a little error message while trying to open it :) Probably just needs a conversion to str in front of an expression or sth.

  • joelmayer

    Updated it again to fix that error when loading into c3. Also I found the set color effect works different in c3 so I fixed that as well so it will work correct if run from c3 or c2.

Post reply
Return to board index
Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)