I’m trying to make stylized pixel art text similar to a prototype I made in an external art program, but I’m not sure how exactly to recreate it. I’m fairly new to working with ui in godot.
Here is an example picture of the effect I’m trying to recreate:
Its made up of 3 main effects:
A shine color applied to the top and bottom of the letters
An outline color applied around the text itself (with corners)
A drop shadow color 1 pixel right and 1 pixel down
(font is m3x6 by Daniel Linssen)
The only way I can think of to make a label look like that is to combine Labels/RichTextLabels with shaders and a custom font. The native drop shadow and outlines are notoriously terrible in Godot, especially with pixel art text.
If you only intend on displaying numbers. I would simply create individual sprites for all ten numbers. Add TextureRects and assign the number sprites to them through code. So if your max number is 1 000 000, you can add 7 TextureRects to an HBoxContainer and assign the sprites to the TRect’s according to the value.
If you are only using specific characters (numbers, symbols, etc.) you could possibly make a custom ImageFont by adding the effects to all the characters you need and assembling them in a spritesheet. Then you can reimport the spritesheet as an ImageFont and it works just like a regular font.
You may need to add the font as a FontVariation in a Label or RichTextLabel so you can get custom character spacing to join all the characters together.
