Newline in Bitmap Text Object

Hello. I really liked the new Bitmap Text object, I needed that, but I ran into a problem when I tried it: when the text ends with a newline, the text shown is shifted up. This can be annoying especially for those who use the object for a dialogue system. Attached I leave some images depicting the problem. Thanks a lot!
Cattura1
In this screenshot the text doesn’t end with a newline and nothing is wrong.
Cattura|
In this screenshot the text ends with a newline.

N.B.: These are screenshots of the editor, but launching the game the result is the same.

When you create the BM Font check the line height, or set a width/Height fixed to each letter of the font type.
You can create one with BMFont or Hiero

Each letter, and even on the white space.

I’ve already created the Bitmap Font and I saved it as a .fnt file; how can I import it in one of the editors you suggested?

You will need to recreate the bitmap font in general. In general, here are the settings I recommend for bitmap font creation in BMFont, important ones highlighted in yellow:

Font settings page:

Export options page:

Also, ensure you’re including the actual new line character in your bitmap font.

image

While those empty spaces above and below the characters may seem like extra, in many cases fonts use different spacing widths for different characters, and new lines are a separate character as well. If you don’t include the blank spaces you may be missing the newline character and the engine has to guess.

I can’t select the characters from U+0000 to U+001F and all other unprintable characters, there is a kind of grid.

Just out of curiosity, have any of you ever encountered the same problem?
And if nobody has, can anyone attach a BM Font file where everything works?
Anyway, thanks for your availability.

Yes, I can confirm this too.

I also found that ending the last line with a space will shift the text slightly to the right. (e.g. “Test” and "Test " will produce different positions.)

If you use the scroll clipped text function in Yarn, your sentence will always be hopping a little to the right whenever the sentence encounters a space, and it will hop upwards a little when wrapping to a new line. So there is something going on with a “space” character and a “new line”.

Oddly, once the text wraps to a new line, this behavior doesn’t happen for the “space” character, yet the “new line” hop up still occurs.

I am not sure whether my Bitmap font file is not configured correctly (I used the recommended programs to generate it) or if it is something related to the way GDevelop handles it.

I am away from my computer right now, but I don’t have this issue. I’ll post an example font and atlas image later today.

I have found a solution for the space problem editing the .fnt file, but I didn’t solve the newline problem yet.

Single line:
image

Multi Line setting:

After clicking apply:
image

Font and atlas file (Link good for 30 days as of today: Upload files for free - NAVReduxResize.zip - ufile.io )

Original TTF file used to make: Dogica by rmocci (dogicapixel.ttf from this)

BMFont settings:



Edit: Also make sure when you preview your font file in BMFont that you only have 1 page of characters. If you have multiple pages your export size is too small, as GD5 only accepts one atlas file, I believe. Bump up your export size and ensure everything fits on one image.

Thank you for sharing your BMFont. I have tried it and the space and new line quirk still happens.

To clarify, this only occurs when there is a space at the end of a line or an empty new line. Try adding a space to the single line “Start Game” or an empty new line to the end of the multiline example. You will see the slight shifts to the right and upwards respectively.

Normally, this wouldn’t be a problem when BMFont is used for labels as you wouldn’t put an extra space behind a word or introduce an empty line for no reason. However, when used with a dialogue system, especially with some kind of typewriter effect/scrolling text where the sentence is redrawn one character at a time, you will inevitably have to deal with spaces and empty new lines during the redrawing process.

Could this suggest an odd behavior with the BMFont object in GDevelop itself?

Ah, the solution to the “space” issue is to not draw the space character by altering the .fnt file’s width and height for space (char id 32) to 0.

However, I can’t figure out how to solve the new line quirk. Is there a “new line” character for bitmap fonts?

The character id of newline in GDevelop is 10 (U+000A), but altering it in the .fnt file nothing happens.

Might need @Bouh to look at this behavior. While it is a very specific use case, I could understand the need.

I can reproduce this now based off the info above:
This is the font above, with a Bitmap Font object, with the following settings:
Normal (Just “START GAME”)
image

"START GAME
" (Start game, return key press)
image

"START GAME "
(Start Game, space at end)
image

Edit: @GiAnMMV @drearyweary as a workaround for the Newline issue, if you put a space on the newline, it “fixes” the boundary box/placement.

image

I’ll submit a fix for the next update

Here my result

Text on right have a empty line.
image

A fix has been submit here if you want follow the bug.

Thx for your help guys!

3 Likes

Thanks for the fix. Bitmap text is a really good feature!

Well, it could be a big problem in a dialogue with a typewriter effect.

Maybe I’m not understanding, but most games with typed characters tend to have the line stop at the end of the last line, not a new line.

Unless you mean more like an old-school ascii console effect? Which I guess I could see.