Alignment problem for rotated text

Solar2D General Questions/Discussion
#1

I am trying to create a two player game where two players can play head to head on a tablet.

I am having trouble with aligning text for rotated text. As the number of characters is reduced, the positioning changes incorrectly (or incorrectly as to what I want to happen). Basically, I want the text to always be 20px from the edge of the screen.

So this is the code I am using:

prizeAmountPlayer2 = 10000  
  
function test()  
 prizeValuePlayer2 = display.newText( prizeAmountPlayer2, 0, 0, native.systemFont, 30 )  
 prizeValuePlayer2:setReferencePoint( display.TopLeftReferencePoint )  
 prizeValuePlayer2:setTextColor( 255, 255, 0 )  
  
 prizeValuePlayer2.x = prizeValuePlayer2.contentWidth + 20  
 prizeValuePlayer2.y = 486  
  
 prizeValuePlayer2:rotate(180)   
  
 local timerSeconds = 20  
  
 local function updatePrize( event )  
 timerSeconds = timerSeconds - 1  
  
 if timerSeconds ~= 0 then  
 prizeAmountPlayer2 = prizeAmountPlayer2 - 500  
 prizeValuePlayer2.text = prizeAmountPlayer2  
 prizeValuePlayer2:setReferencePoint( display.TopLeftReferencePoint )  
 prizeValuePlayer2.x = prizeValuePlayer2.contentWidth + 20  
 elseif timerSeconds == 0 then   
 timer.cancel( questionTimer )   
 end  
 end  
  
 questionTimer = timer.performWithDelay(1000, updatePrize, 0)  
end  
  
test()

When it starts, the 10000 score is correctly placed, then when it hits 9500, it is aligned directly against the edge of the screen. When it hits 500, the last 0 is off the screen.

So I tried changing the first instance of this:

prizeValuePlayer2.x = prizeValuePlayer2.contentWidth + 20

to:

prizeValuePlayer2.x = 200

And removed these lines:

prizeValuePlayer2:setReferencePoint( display.TopLeftReferencePoint )  
prizeValuePlayer2.x = prizeValuePlayer2.contentWidth + 20

from the updatePrize function, to keep it from trying to position relative to the edge and instead just at a set point.

But even still, the text still keeps shifting.

Any thoughts on how to keep that rotated text to stay 20px from the edge of the screen? [import]uid: 17827 topic_id: 21436 reply_id: 321436[/import]

#2

This is a workaround but use an if statement to check if the prize value is <10000 and >999 then change the +20 in line 22 to +40, or if <= 999 then +60.

That should help I believe. (Although as I said it’s a work around.)

Peach :slight_smile: [import]uid: 52491 topic_id: 21436 reply_id: 84892[/import]

#3

Thanks, Peach. I will try that tomorrow.

Is this a bug that I should log?

I thought I was getting confused on how text gets positioned. [import]uid: 17827 topic_id: 21436 reply_id: 84895[/import]

#4

I’ve had a bit more of a play with it and it does seem there are some issues when text is rotated that could benefit from some attention - if you wouldn’t mind filing I think that’s a good idea.

Peach [import]uid: 52491 topic_id: 21436 reply_id: 84911[/import]

#5

I went ahead and logged it (via the “Report a Bug” link).

It is bug #12060.

[import]uid: 17827 topic_id: 21436 reply_id: 85106[/import]

#6

Thanks for that, it should be a big help in getting it addressed :slight_smile: [import]uid: 52491 topic_id: 21436 reply_id: 85119[/import]

#7

Peach,
I noticed today that the bug was closed. I just downloaded the latest daily build and the problem is still happening.

Is there a reason for that? [import]uid: 17827 topic_id: 21436 reply_id: 88040[/import]

#8

There was a workaround suggested; leaving the reference point as center, which works.

I’m unsure why it was closed, there are a few reasons it could have been but I’m not certain - likely it is not high priority because of the workaround, which does work perfectly. (I was one of the people to test it with your code.)

Peach :slight_smile: [import]uid: 52491 topic_id: 21436 reply_id: 88055[/import]

#9

For those who also want to know about the workaround, here it is:

[lua]display.setStatusBar (display.HiddenStatusBar)

prizeVal2 = 10500
prize2 = display.newText(tostring(prizeVal2), 0, 0, native.systemFont, 30)
prize2:setTextColor(255, 255, 0)
prize2.y = display.contentHeight / 2
prize2.rotation = 180

local function test2()
prizeVal2 = prizeVal2 - 500
prize2.text = tostring(prizeVal2)
prize2.x = (prize2.contentWidth / 2) + 20
end

test2()

timer.performWithDelay(1000,test2,20)[/lua] [import]uid: 17827 topic_id: 21436 reply_id: 88153[/import]

#10

Thanks, Peach.

I did try the workaround you sent and it does seem to work fine. Thanks for sending that along.

It is disappointing that the bug was just closed, though, without the workaround being added to it. And while there is a workaround, it seems like a bad idea to just close the bug without documenting it. I find it odd that I am the first person to have ever encountered it. [import]uid: 17827 topic_id: 21436 reply_id: 88151[/import]