Trailing space in display.newText

Hi -

Here’s a subtle little question, very low-priority…

I’m rendering messages in my app with a timestamp in the bottom right hand corner against each message, and I don’t want the message text to overlap it.

Obviously the timestamp could go on its own line but it seems a shame to waste the vertical space.

I can get it to not overlap that bottom right corner if I add some trailing whitespace to the text - but it looks like display.newText trims the whitespace:

i.e.

   display.newText( ‘Hello’…’        ’ )    renders ‘Hello’

whereas

   display.newText( ‘Hello’…’        a’ )   renders ‘Hello      a’

Is there any way to make it render the spaces in the first example?

Tom

Padding won’t get your the effect you’re looking for.

It sounds like you want the text to align to the left edge.

Simply set the text object’s anchorX to 0.  

Then, it will grow left-to-right and not change positions relative to the “Hello” part of your text.

-- Try this to see what I mean -- local label = display.newText( "", 100, 100 ) label.anchorX = 0 label.x = 100 label.text = "Hello" timer.performWithDelay( 1000, function() label.text = "Hello a"

Hi roaminggamer

Thanks very much for taking the time to reply.  

I think I’m anchoring the text correctly, let me try to explain myself better with a picture (below):

On the fourth comment the text overlaps the ‘like’ button.  I appreciate that I could stop this by always putting the ‘like’ button on its own line, but that seems a waste of vertical space.  So I was thinking I’d just append a few spaces to the end of the text string, so when the text ends up landing near the right hand edge, the extra spaces will push it onto the next line creating more vertical space so it doesn’t overlap the like.

Which would work fine, except that display.newText() seems to trim the whitespace.  I was wondering if there was any clever (hacky!) way to make it render the whitespace…

Tom

tombola.png

So is each line of your message text a separate newText object?

If so you must be splitting up the text into lines based on the width of the box and the number of characters remaining in the message. If the text is too long it goes back to find the nearest space and carries the text after that into the next line.

If the text remaining wouldn’t overlap the edge of the box it must be the final line, so you can then check the length of that text is not longer than the width of the box, minus the width of the like icon, minus a few extra pixels. If it is, go back to the nearest space and carry the text over as before.

Thanks Nick.  It’s just one multi-line text field in a bounding rectangle.  I guess I could do it by splitting it into an object per line as you describe… just wondering if there was a quicker way by appending spaces to the end; I’m not sure why display.newText trims the whitespace.  But no matter… thank you for your reply

Tom

Ah I see - I’ve never used the built-in multi-line text. I don’t think it was around when I started using Corona and so I use an old library called wrapper.

I’m guessing the white space is ignored in multi-line text boxes as it’s only looking for non-space characters when deciding whether to wrap the text.

As a work-around, I wonder if you could find a non alpha-numeric character in your font that wouldn’t be classified as a space by the function, but renders as one, and append a load of those to the end.

That’s exactly what I was thinking.  I wonder if there’s an invisible Unicode character… :slight_smile:  Terribly hacky, but will give it a go!

Padding won’t get your the effect you’re looking for.

It sounds like you want the text to align to the left edge.

Simply set the text object’s anchorX to 0.  

Then, it will grow left-to-right and not change positions relative to the “Hello” part of your text.

-- Try this to see what I mean -- local label = display.newText( "", 100, 100 ) label.anchorX = 0 label.x = 100 label.text = "Hello" timer.performWithDelay( 1000, function() label.text = "Hello a"

Hi roaminggamer

Thanks very much for taking the time to reply.  

I think I’m anchoring the text correctly, let me try to explain myself better with a picture (below):

On the fourth comment the text overlaps the ‘like’ button.  I appreciate that I could stop this by always putting the ‘like’ button on its own line, but that seems a waste of vertical space.  So I was thinking I’d just append a few spaces to the end of the text string, so when the text ends up landing near the right hand edge, the extra spaces will push it onto the next line creating more vertical space so it doesn’t overlap the like.

Which would work fine, except that display.newText() seems to trim the whitespace.  I was wondering if there was any clever (hacky!) way to make it render the whitespace…

Tom

tombola.png

So is each line of your message text a separate newText object?

If so you must be splitting up the text into lines based on the width of the box and the number of characters remaining in the message. If the text is too long it goes back to find the nearest space and carries the text after that into the next line.

If the text remaining wouldn’t overlap the edge of the box it must be the final line, so you can then check the length of that text is not longer than the width of the box, minus the width of the like icon, minus a few extra pixels. If it is, go back to the nearest space and carry the text over as before.

Thanks Nick.  It’s just one multi-line text field in a bounding rectangle.  I guess I could do it by splitting it into an object per line as you describe… just wondering if there was a quicker way by appending spaces to the end; I’m not sure why display.newText trims the whitespace.  But no matter… thank you for your reply

Tom

Ah I see - I’ve never used the built-in multi-line text. I don’t think it was around when I started using Corona and so I use an old library called wrapper.

I’m guessing the white space is ignored in multi-line text boxes as it’s only looking for non-space characters when deciding whether to wrap the text.

As a work-around, I wonder if you could find a non alpha-numeric character in your font that wouldn’t be classified as a space by the function, but renders as one, and append a load of those to the end.

That’s exactly what I was thinking.  I wonder if there’s an invisible Unicode character… :slight_smile:  Terribly hacky, but will give it a go!