BITMAP text visual error

(scroll to the bottom to download both projects)

ORIGINAL PROJECT:

What it should look like:

image

(Yes, this is GDevelop before anyone asks) The “walk to text”.

What is the actual result:

image

image1920×1080 134 KB

After I hover on this (it only changes the text, nothing else. When hovering on the doors or any other object, it displays the object name after “walk to” as well)

image

image1920×1080 134 KB

When I hover off AFTER the “smashed up treasure chest text”, then the text has an error like the image above. (I am purely using the bitmap text action “set to”, not “add,” just to clear things up)

What I think is the reason for the error:

I’ve experimented with the number of characters and have concluded. When the number of characters gets to a certain point, the text starts acting like the image above. Unfortunately, I couldn’t find a fix for this, so I’m reaching out for help.

Here are the Bitmap Text settings:

image

EXAMPLE PROJECT:

What it should look like:

the “walk to” text

Hovering on the object:

AFTER hovering on the object:

the same error happenes here.

Code:

NOTE: even at different resolutions and de/activating fullscreen had same error/issue.

Text Object:

No behaviours, variables or effects.

Sprite Object:

No behaviours, variables or effects.

No scene variables, no global variables.

Game properties:

Project downloads:

Original Game Download:

Example Game Download:

Operating System Version: Linux Mint 22.3 - Cinnamon 64-bit

This version of GDevelop is: 5.6.274 (editor full version: 5.6.274-82b93f13050ebec59440ce4160dfb82caccb9dc4, core version: 5.6.274-0)

NOTE: I have encountered this problem since 2024, but I didn’t know there was a bug report page, as I am not particularly smart in these situations.

The problem with the background colors might be related to your atlas (my bad, i noticed that wasnt an issue, however the following solution could still make it better), but im not sure. However, the text getting messed up is because of the poorly developed “center” feature. It looks perfectly fine like 50% of the time, because if the size of your text object and the text within the text object cannot be divided in half evenly, there will be a decimal. In pixel art, low resolution games, this is the worst setup to display something that is on a half pixel, because there is intentionally no smoothing. And so what happens is it does a terrible job of trying to display it anyway. try rounding the position of the text objects after their text is set, using the round() expression.

How would I do that - I’ve just tried doing it but now the text is going underneath as ive had to shrink the text box down to get it to center sing the SetCenterX of Action_HUD to round(SceneWindowWidth()/2)? Could you please elaborate.

will this work?:
Change the X position of [text object]: set to round(textobject.X())
Change the Y position of [text object]: set to round(textobject.Y())

It doesn’t seem to work, but I’m gonna try and see if there is a way of changing the actual length of the bitmap text object by the number of characters, if there is an expression that can find out the number of characters in a bitmap text object. And then, from that, I can centre the text in the middle of the screen using centerX = windowScreenWidth()/2. Thanks for the help, and I’ll keep and update on my progress. I might ask for a bit more help in a bit if you don’t mind.

You are trying to render font that is bigger than your resolution can handle
Increase IN GAME PROPERTIES (NOT VIA EVENTS) resolution and look what happens

no, thats perfectly fine. in his example project, the text is using the atlas “Inventory_text.png”


which appears to be perfectly 1 pixel, not scaled up. resolution has nothing to do with the handling of resources, you must be explaining wrong.

i did what you said too, all that happened was…the resolution increased, of course

I’ve managed to do what I thought would be a good idea earlier but I found an issue: the actions are not happening quick enough in a way that I can see it flickering from the woriginal wrap width to the new one :confused:

(look at the event actions below HUD that has no conditions)

Few things of note:

  • Your conditions are potentially a nightmare for debugging.
    • I’d strongly recommend adding items that can be walked to into a “WalkTo” object group (And same for other verb objects), then you can just have a single condition that checks if it’s on “WalkTo” object group (inverted). I generally just use a “Interactable” object group and the have variables on the objects to say which applies, but go with whichever method is easier for you (besides leaving them ungrouped).
    • This will not fix your issue, just make it slightly easier to debug/add new objects, and potentially reduce performance impacts if you have A LOT of objects for conditions to check.
  • “The cursor/touch is on” as an event does not care about sprite hitboxes, if you are customizing your sprite hitboxes at all for collision, you need to use “Point is inside object” and use the CursorX/Y expressions to make it adhere to that.
  • Depending on your game resolution, a bitmap font rendering 1 pixel will distort if the position is a subpixel (i.e. character Y is at 51.65 instead of 52).
    • You cannot fix that other than forcing the x/y positions to be rounded to the nearest number in your project settings and events. It still may not work if your font doesn’t have fixed-width characters, too.
    • You might also have better results setting your game to a higher resolution and then zooming all of layers (e.g. if your game is 320x180, set it to 1920x1080 and then zoom all of your layers by 6x). Then you have more positions to work with even if still looks the same. This is different than setting your game window size, to be clear, and needs to be set in your project properties.

Edit: Also keep in mind that the monkey island game fonts were designed for CRTs and not LCDs. They were also shown stretched a bit (You can read more about it here) you may not be able to perfectly replicate that font at “pixel perfect” game resolutions today, since you can’t stretch it like it was back in the day. You might get closer if you make a pixel font of the properly kerned one at the link above?

The resolution thing seems to fix the text and now it looks the same. The problem I’m coming across now is that when i scale an object down or up it doesn’t snap to the pixels, that also applies to the movement.

If you are wanting to keep everything exactly pixel perfect you are going to have to do math and only scale in intervals of 6 (if you are scaling the zoom 6x). Same with movement.

Basically you will need to ensure your movement position is kept at an even divisor of your zoom factor.

That said, you could also try keeping it all at the original resolution and just ensure you aren’t doing something like centering the text object without rounding its position (since without rounding that could lead to half pixels if you add a space). That may get you closer to what you are looking for.