Graphic Font System Colours
[Share Code: LXK7U2Y5AN]
I'm working on a graphical font system, using Alien Outcast's fonts. You add all four files (Caps, Low, Num, SPC) and specify which characters each file contains, and the FontPrint() routine takes a string and determines which file each character belongs to, and copies that tile to the screen. This is working great, and was much easier than I was anticipating. See video. (Title animation is something different, just a custom routine.)
But I'm now trying to add custom colouring but can't figure out the best method. I'm using the drawSheet() command, which doesn't seem to support colouring. I could create sprites (and colour them) using the setSpriteAnimation() command, but that seems like a lot of overhead if you have a lot of text to display.
The other option is the drawImageEx() command. It has a tint parameter. But how do I determine the character x,y position inside the sprite sheet? I can get the tile size, but is there a tilePosition command?
Is there another way (using drawSheet()) to add colouring? There are a few graphic commands I'm unfamiliar with and may have overlooked something.
Thanks for your help.
You can achieve the same effect as tinted colours using the multiply blend mode via the
For example you could modify the
PrintFont()function by drawing a coloured box before
drawSheet()and blending the character with multiply:
box(x, baseLine - size.y + offset, size.x, size.y, red, false) setBlend(BLEND_MUL) drawSheet(...) setBlend(BLEND_MIX)
I would use the drawImageEx() and just multiply the tile width with the position to get the x coordinate.
I'm not adept enough with blend modes, but I'm sure @Gothon's method would work brilliantly. I would personally go down the route suggested by @vinicity - drawImageEx() allows for easy tint application, and you can multiply the letter number in the string (the 'i' counter in the for loop which draws each letter from a string) by the tile width to get your x position. Any offset would also have to be factored in.
Just want to add, we're aware of the limitation with drawSheet and plan to add a companion function matching the functionality of drawImageEx for drawSheet in a future patch.
Thanks for the tips! I started to go with the DrawImageEx(), but realized this wouldn't work. I needed to use DrawQuad().
I ended up hand creating a dot matrix font in the image editor, which was fairly easy.
(I actually created two others I didn't like as much. Ha, waste of time?)
Couldn't figure out how to set each character's width in the editor. They are all square. For now, I just hard coded the widths in the code, messy but works. If I could read the pixel values, I could figure it out procedurally.
I realized sometimes I want a fixed width! So I created a FontPrintFixed() routine. (For the Hi-Scores table).
Everything is looking great now:
I added the font to the game play too: