Implementing better "fonts" ?

Ignis

I seem to recall that several GS chefs have implemented better "fonts" in their games, i.e. nice polished graphical numbers and text in their HUD displays. For all of GameSalad's powers, I find the "Display Text" feature to be sorely lacking and insufficient... 5 or 6 fonts, no styles, limited alignment/positioning options, etc. This is fine for testing, but I feel it won't be enough for a final polished game.

So how have you dealt with it? Do you create graphical numbers 1 to 10 and then create a rule to display them as graphics in the proper location? For example, "game score = 1000", thus display a "1" at position hud.X-30, and "0" at hud.X-20, X-10, X... (that's a rough example, but just a general idea).

Ideas or suggestions are appreciated as always!

quantumsheep

FireMapleGames has an excellent demo you can incorporate into your game for custom fonts with regard to scores.

Everything else is done as 'art' - i.e. you have a graphic that says 'Hello World!' in the font that you want and then put the graphic onto an actor and display it in the game.

You can use several packages to do this (everything from Photoshop to just Word) but I'd recommend art2text - it's lovely to use.

Hope that helps!

QS

Ignis

quantumsheep said:
FireMapleGames has an excellent demo you can incorporate into your game for custom fonts with regard to scores.

Hey QS... I checked out FMG's demo but I couldn't get the file to download properly. Have you downloaded and studied this demo? Did FMG use a separate actor image for each "digit" and arrange them in positional order on the screen? Then, did he change it depending on a game attribute using math functions? For example, if the total value is "83", would "digit-2" be something like "floor(game.value/10)", thus producing an "8" and loading a corresponding image "8.png" for that place? Of course, I can't think of how to determine "digit-1"... divide 83 by 100 and you get 0.83, but you need a whole integer "3" to place in the first place left of the theoretical decimal. I'm sure there's a solid math formula to handle all digits from 1 to 10000, but I'd like to hear from FMG or yourself before I dive head-first into this...

firemaplegames

Hey Ignis,

You can download any of my demos from my profile. On each demo's page is a blue Download Project button in the lower right.

Right-click that button and save as.. to your desktop.
THEN you need to rename the file extension from .game to .zip
Double-click on that to get the correct .gameproj file.

An easier way is to click on the Shared Projects tab in GameSalad creator and search for it. It will open up directly in the program.
(you can search by tags - the tags on on the demo's page by the blue download project button)

And to answer your question, yes, there are 10 separate .png images created in Photoshop. (0-9.png)

And it uses a math formula for each digit to show the appropriate graphic.

The demo is fully commented. (I was more ambitious back then!)

A word of warning, using custom font digits like that requires a Constrain Attribute behavior for each digit.
Each Constrain that you use negatively affects FPS.

On a menu or stats page, it is fine, but be careful on a game screen that has lots going on.

An iPad can handle it easily, but a 3G gets a little angry.

Ignis

Hi Joe,
Thanks for the advice. It seems that I have a custom font counter working at this moment... or almost so... just a bit more tweaking.

Since I will have upwards of 12-15 digits in the scene at once, I'm concerned about the performance hit from so many Constrains. So, I am attempting to wrap the counting routine inside a Rule, as follows:

A custom game variable (boolean) exists: "game.num_update". This is set to TRUE as default, because I want to "initialize" the counter to a starting value (in this case, it's a countdown timer which will vary from scene to scene, not always begin at 0). A game variable "game.counter_value" holds the integer that I want to display using .png digits. I might change this to a custom scene variable as I move forth with the game since it will vary by level.

Then...
`
---RULE: If "game.num_update" is TRUE:
------CONSTRAIN ATTRIBUTE "self.image" to "(your cool math routine with divisor to determine the .png)"
------TIMER: AFTER 0.2 seconds + Run to completion
------CHANGE ATTRIBUTE: game.num_update = false
`
Also...
In another actor similar to a controller, an event triggers the actual change. This event reduces "game.counter_value" AND sets "game.num_update" to TRUE, until the above rule changes it to false after 0.2 seconds.

This all appears to be working, but do you (or anybody else) see any problems or issues that might arise? In this particular game, the counter will not be changing rapidly enough that I forsee any overlapping timing issues, i.e. 10 events happening within the span of 0.2 seconds that might throw off the timer. Even if this happens, it's quite possible that the timer will allow the visual counter to catch up to the real-time counter value; further testing will be required of course.

Most importantly, do you think this will theoretically reduce the performance hit by wrapping the constrains within the Rule, such that the counter isn't constantly changing, but just changing when it needs to?

firemaplegames

That should be fine. If there's not a lot of stuff happening all at once, it should be ok.
Hiding Constrains and Timers in Rules is critical. You are on the right track.