Fancy Text extension not rendering text properly

[new_account123456]

Link to font if needed: https://arcade.makecode.com/_J8bdte9MVL3Y

The Fancy Text extension is not rendering text correctly (renders glyphs as squares).

My font in the Font Editor:

I tested the font with the string “HELLO WORLD!” and this is the output:

Does anyone know how to fix this?
The font is 8x8.

[WoofWoof]

I just recently delved into how Fancy Text fonts work, so I guess I’ll take a look!
…
This is very weird…
…
Yeah I got nothing. @richard I summon thee!

Also who is approving stuff at 12:30 am??

[new_account123456]

Actually, any font that i make and test is rendering as squares.

[richard]

ack, sorry! this is my fault. i made some changes to the font format but i haven’t bumped the extension yet. i’ll try to get a new version out later today. the bright side is it will have lots of new features

[WoofWoof]

Oh yeah! You said something about changing the extension on one of the advanced streams! The interesting thing is that the data format kinda works in my own font editor, but only kinda, and I think I can see how your new data format works just by looking at this broken font, which is really cool!

[richard]

i’m surprised it works at all in your editor. i think my format is completely different from the baked in one.

BTW, the binary format is documented here:

src/lib/font.ts

[WoofWoof]

Lol yeah me too! I’m guessing that the messed up chunk at the beginning is that metadata? and the rest is encoded in byte sized pieces. Is your format using the default font style of one or two bytes per column? Or are they packed closer than that? Like, if the character has a height of 7 does each column still take a whole byte or are you packing it so that every 7 bits is a column? If so, then this only works because the font I was given happened to be 8 pixels tall.

[ADM_F]

i tried to make a font earlier missing this post and got confused when it was just squares

before i remake the font i wanted to ask if it works now

[richard]

sorry, i’ve been busy working on microbit things. let me push the update right now

[richard]

alright, pushed! the new version is 0.2.0. here are the new features:

two-tone fonts!

you can now create two-tone fonts in the font editor, just go into the font settings and check the “two-tone” setting. once two-tone is enabled, you can switch between the two colors by clicking this button:

as the name implies, two-tone fonts can have two colors instead of 1. to set the color of a text sprite using a two-tone font, use the new two-tone color block:

you can slot it into the color field just like a normal color:

kerning!

fonts now support kerning! if you want your font to automatically be kerned, you can check the “auto kern” setting in the font setting menu. this will automatically adjust the characters in your font so that they are kerned.

all of the built-in fonts are now also kerned. for example, see how the “T” overhangs the “a” in this image:

here’s how that text looked in the old version:

line spacing!

you can now set the amount of spacing to put between lines of text in the font settings!

[richard]

also, the font editor now supports importing fonts that are made for the Playdate console!

this is cool, because it means you can now use this much better font editor for making fonts:

tophat

if you’re making a new font, consider using tophat instead! it supports unicode characters from other languages, outling fonts, manual kerning, etc.

steps for turning a tophat/playdate font into an arcade font:

1. export your font as a .fnt file:
   
   
2. in my font editor, click the import button:
   
   
3. click “Choose File” and select your .fnt file
4. share or download the font just like normal!