Navigation

    Fuze Arena Logo
    • Register
    • Login
    • Search
    • Categories
    • Recent
    • Popular
    • Users
    • Groups
    • Help
    • Discord

    Graphic Font System Colours

    Help
    5
    6
    480
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • S
      Slydog last edited by Slydog

      [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.

      1 Reply Last reply Reply Quote 8
      • Gothon
        Gothon F last edited by

        You can achieve the same effect as tinted colours using the multiply blend mode via the setBlend() function.

        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)
        
        1 Reply Last reply Reply Quote 3
        • vinicity
          vinicity F last edited by

          I would use the drawImageEx() and just multiply the tile width with the position to get the x coordinate.

          1 Reply Last reply Reply Quote 4
          • Dave
            Dave Fuze Team last edited by

            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.

            1 Reply Last reply Reply Quote 4
            • Willpowered
              Willpowered Fuze Team last edited by

              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.

              1 Reply Last reply Reply Quote 4
              • S
                Slydog last edited by pianofire

                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:

                1 Reply Last reply Reply Quote 7
                • First post
                  Last post