How is that done? I thought about designing my own numbers as png files instead of fonts. How does a developer implement this?
Thanks. [import]uid: 128294 topic_id: 28718 reply_id: 328718[/import]
This is pretty easy and common provided that all your letters and numbers have the same width:
- create a displaygroup to hold your typography
- create a spritesheet
- use a for loop on the string you want to use, going over each character and getting the bytecode of the character.
- insert a sprite into the displaygroup for each character (so still in that for loop) and set the currentframe to the bytecode of the character in the string. Also set an offset for the X position of each character based on the for-loop.
Cheers,
Thomas [import]uid: 70134 topic_id: 28718 reply_id: 115757[/import]
@LakeviewHotel - What thomas said will work fine. My question is why not just make your own font then? its much easier and you wont have to manage the numbers. I could understand if you want some special gradients and drop shadows and all that good stuff. Lots of font programs out there if you would want to try that. Just a suggestion for another route you could go. [import]uid: 126161 topic_id: 28718 reply_id: 115760[/import]
Can you tell me what a good font program is? I’ve been looking for one.
binc [import]uid: 147322 topic_id: 28718 reply_id: 115779[/import]
I use FontCreator [import]uid: 126161 topic_id: 28718 reply_id: 115781[/import]
We use Fontlab Studio (670 dollar) but Fontographer (400 dollar) will be enough for you. Mind that custom fonts are always in a single color so no gradients, glows, special transparency effects or drop shadows - for this you need your own function as I said above.
Mind you: there are ways to create special effects with custom fonts by layering different colours of your text on top of eachother. My game “Bombaroo” (check it on App Store or Google Play) makes use of both methods: the score in the top of the screen is a text made with custom graphics (gradients etc…), while the tip of the day is in a custom font, but with a (sharp) shadow layered underneath it.
Cheers,
Thomas [import]uid: 70134 topic_id: 28718 reply_id: 115783[/import]
@3 Dreams Gaming: How much does FontCreator cost? [import]uid: 147322 topic_id: 28718 reply_id: 115784[/import]
FYI if this is just for a score - http://corona.techority.com/2011/01/26/how-to-add-a-score-to-your-iphone-app/
That uses PNG images for 0-9.
Peach 
[import]uid: 52491 topic_id: 28718 reply_id: 115792[/import]
Here’s some quick and dirty copy/pasted code from Bombaroo. You’ll have to find your own way around because there’s some stuff missing (like the spritesheet) but the basic concept is there - first block is the creation of the displaygroup with the numbers, second block (the function) read from the score and sets the right spriteframes. Good luck!
[lua]scoreText = display.newGroup()
scoreText.tileSheet = sprite.newSpriteSheet(“Bombaroo-Scorefont.png”, 51, 64)
scoreText.tileSet = sprite.newSpriteSet(scoreText.tileSheet, 1, 20)
for i = 1, 7 do
local Letter = sprite.newSprite(scoreText.tileSet)
Letter:setReferencePoint(display.TopLeftReferencePoint)
Letter.x = (i*48)
Letter.y = 0
Letter.currentFrame=1
Letter.alpha = 0
scoreText:insert(Letter)
end
local function setScore()
local scoreLength = (string.len(score))
local counter = 7
for i = 1, scoreLength do
local character = (scoreLength+1) - i – so we start with the last character and go to the first
scoreText[counter].currentFrame = string.byte(string.sub(score, character, character))-47
scoreText[counter].alpha = 1
–print(string.byte(string.sub(score, character, character)))
counter = counter - 1
end
end[/lua] [import]uid: 70134 topic_id: 28718 reply_id: 115797[/import]
@3 Dreams Gaming - I’ve been having a hard time trying to find a good inkscape tutorial for creating my own, so wanted to know what other options are out there, given I don’t have much money right now. [import]uid: 128294 topic_id: 28718 reply_id: 115826[/import]
That’s the same thing I was thinking. I don’t really have a free 670 or 400 dollars lying around [import]uid: 147322 topic_id: 28718 reply_id: 115845[/import]
If you want to use bitmap fonts in a Corona App I’d recommend TextCandy from X-pressive for something like $50 (before discounts):
http://x-pressive.com/TextCandy_Corona/download.html
It comes with some pre-made fonts, but if you want a cheap and easy tool to generate your own you could try Glyph Designer from 71squared for $30:
http://glyphdesigner.71squared.com/
[import]uid: 9422 topic_id: 28718 reply_id: 115851[/import]
XenonBL has some great suggestions and i would recommend anything by x-pressive! [import]uid: 126161 topic_id: 28718 reply_id: 115855[/import]
how would that apply to a sprite sheet thats 1200 x 400? Do you think it would be better if it was much lower, maybe 600 x 300? [import]uid: 128294 topic_id: 28718 reply_id: 118083[/import]
@peach pellen
How would that code apply to replacing hud in the game?
[lua]
local hud = function()
eggText = display.newText( "Caught: " … eggCount, 0, 0, “Arial”, 45 )
eggText:setTextColor( 255, 255, 255, 255 )
eggText.xScale = 0.5; eggText.yScale = 0.5
eggText.x = (480 - (eggText.contentWidth * 0.5)) - 15
eggText.y = 305
gameGroup:insert( eggText )
livesText = display.newText( "Lives: " … gameLives, 0, 0, “Arial”, 45 )
livesText:setTextColor( 255, 255, 255, 255 ) --> white
livesText.xScale = 0.5; livesText.yScale = 0.5
livesText.x = (480 - (livesText.contentWidth * 0.5)) - 15
livesText.y = 15
gameGroup:insert( livesText )
scoreText = display.newText( "Score: " … gameScore, 0, 0, “Arial”, 45 )
scoreText:setTextColor( 255, 255, 255, 255 ) --> white
scoreText.xScale = 0.5; scoreText.yScale = 0.5
scoreText.x = (scoreText.contentWidth * 0.5) + 15
scoreText.y = 15
gameGroup:insert( scoreText )
local onPauseTouch = function( event )
if event.phase == “release” and pauseBtn.isActive then
audio.play( buttonSound )[/lua] [import]uid: 128294 topic_id: 28718 reply_id: 119558[/import]
You’d replace scoreText section with the section from the tutorial. If you watch it you will see is fairly simple [import]uid: 52491 topic_id: 28718 reply_id: 119626[/import]
@peach pellen
Though, how does that work livesText and and eggText for example? [import]uid: 128294 topic_id: 28718 reply_id: 119716[/import]
If using it more than once you’d copy and rename the file - that’s basic, only set up for one display. (Very easy to change, though.) [import]uid: 52491 topic_id: 28718 reply_id: 119837[/import]
@ peach pellen
I just don’t understand how the same code from your score example would apply to losing lives & how many times player caught the object. [import]uid: 128294 topic_id: 28718 reply_id: 119853[/import]
I’ve done this before with this class. You would start with copying the “score.lua” file to say:
eggText.lua
livesText.lua
scoreText.lua
then require with:
eggText = require("eggText")
livesText = require("livesText")
scoreText = require("scoreText") Starting to see the trick.
then init them:
eggText.init({x=(480 - (eggText.contentWidth \* 0.5)) - 15), y=305}) I think you see where this is going in relation to your code.
Looking at the score.lua, it would be quite easy for you to add a “prefix” variable even to handle your "Caught: ", "Lives: ", etc. as well as other specific needs.
Looking a little further it would be easy for you modify the original score.lua to instantiate multiple instances as well, but that one is for you.
[import]uid: 21331 topic_id: 28718 reply_id: 120016[/import]