Score and highscore alignement

Solar2D General Questions/Discussion
#21

Thanks Rob, understood!

One last question:
I cannot hide zero digits (alpha to 0)?

I do not like them, becuase it is not “space kind of game” :slight_smile:

Ivan

#22

No reason to hide them, if you don’t want leading zeros, don’t use the string.format() trick. But you will have a variable gap between the label and the score that changes as the score changes. 

Rob

#23

Cleanest solution would be to have seperate textfields for the different “parts” of you score.

You would have one text that only reads “Score:”, one for the current score e.g. “40”, one for the slash “/” and one for the highscore e.g. “140”. Now you just have to determine where to place these (depending on your highest possible values).

#24

Hi Torben,

I tried that also, and it is not so clean…

Because 0 and 99999 is quite different in space.

And whole text must to be shifted to the left when score is increased…

I will play around with that, I was hoping for smart solution…  :slight_smile:

#25

Can you draw us an example of what you want it to look like, both when the score is zero and when it is 99999?

#26

Nick, please see attached.

I am doing walkaround for drawed example.

High score will not be in the first row, it will be in the second row.

Drawed example is too much to handle when you have “0 / 0”…

#27

So basically you want the text to be right justified?

After you update the text, do this each time:

[lua]

scoreText.anchorX = 1

scoreText.x = screenRight - 5   – change this to whatever ‘gap’ you want between end of scoreText and side of screen

[/lua]

#28

Thanks Nick, amazing, that is what I needed.

The downside of this solution is that I have only one text object:

local scoreText = display.newText( ("Score: " .. score .. " / ", .. highScore), 0, 0, native.systemFont, 18 )

And you can have only one color/font/size for “Score”, “score” and “highScore”… ?

But when you have multiple text objects you get back right where you started (back to square one).

#29

I would create a display group to hold the text objects.

[lua]

local scoreGroup        – set up a variable to hold the score object

local g = display.newGroup()

local r = display.newRect(g, 0 , 0 , 160 , 40 )   – experiment with sizes

r.alpha = 0

g.box = r    – create an invisible rectangle big enough for all text to fit in

local t = display.newText(score, 0 , 0 , native.systemFont, 18 )

t:setFillColor( 0 , 0 , 0 )

g.scoreText = t         – create text object for score in black text

t.anchorX = 1

t.x = g.box.width/ 2 - 5        – position 5 pixels from right side of rectangle

local t = display.newText( “Score:”, 0 , 0 , native.systemFont, 18 )

t:setFillColor( 1 , 1 , 1 )

g.scoreTitle = t   – create text object for score in white text

t.anchorX = 1

t.x = g.scoreText.x - g.scoreText.width - 5      – position 5 pixels from left side of score

g.anchorX = 1

g.x = screenRight - 5

scoreGroup = g

[/lua]

Then to update:

[lua]

scoreGroup.scoreText = score

scoreGroup.scoreText.anchorX = 1

scoreGroup.scoreText.x = scoreGroup.box.width/ 2 - 5

scoreGroup.scoreTitle.anchorX = 1

scoreGroup.scoreTitle.x = scoreGroup.scoreText.x - scoreGroup.scoreText.width - 5

[/lua]

#30

Uuuu interesting, I will try that!

It shows how onscreen positioning can be very demanding sometimes.

Thanks Nick!

#31

Yes, it takes a while to get the hang of it. I do it this way, others might use containers or other methods - containers were introduced after I had already perfected my methods. so I don’t really use them.

With practice it becomes a lot easier. For example I laid out this entire screen in a morning:

ss_363add947497d00a03f26778e8f41838cd408

#32

You are a pro!  :smiley:

It looks trully amazing!

Is this a game or an app?

#33

Thanks! It’s a game, been out on Steam for a few months. Corona is pretty powerful!

#34

Congrats, looks amazing!!  :smiley:

I thought that Steam games must be for PC/Mac also?

And Corona does not support PC/Mac exports at this moment…

#35

You can build for PC and Mac on Corona, it’s been possible for about 18 months now.

https://coronalabs.com/blog/2015/07/22/mac-app-and-win32-app-open-beta/

#36

Thanks Nick!

#37

Nick,

Works amazing thank you!!

Just for further readers, two typos:

local t = display.newText(g, score, 0, 0, native.systemFont, 18 )  ---- g to belong to a group scoreGroup.scoreText.text = score ---- text field missing
#38

FWIW. You can build apps for:

Apple iOS

Apple tvOS (Apple TV)

Apple macOS (Apple Desktop)

Android (Google Play, Amazon, misc. other stores)

Android TV (including Amazon Fire TV)

Misc. Android game consoles like the old OUYA and now Razer, Gamestick.

Windows Phone 8 

Windows x86 Desktop including submitting to Steam.

Rob

#39

Thanks Rob!

#40

Nick, I have one little problem.

Score number is aligned with screenRight.
And Score (text) is aligned with score number.

Problem is as score number changes you see gentle Score text movement to the left/right/left… due to number width property change :slight_smile:

Did I messed up somewhere? :slight_smile:
Or should I just keep Score text aligned with screenLeft side?

Many thanks.
Ivan