0
Not a bug

Text changing size in text boxes

Clint Sutton 6 years ago updated by Ezra Weinstein (Administrator) 6 years ago 7
Don't know if this has already been mentioned? But the text I add to a text box always changes size in different devices. It looks fine in the Interact screen, and Design. But when viewed in the player, it changes to different sizes and completely messes up the layout of the page. Sometimes there can be up to 3 different sizes in on text box.

This mite be being addressed in the next version of Builder.

Answer

Answer
Not a bug
This is actually not a *bug* per se, but the way that text wraps based on the font selection. Zooming in and out is done by applying mathematical adjustments to the size of things - so when the user is at "fit in window" view (79% generally), we are applying the 79% to the width, height and font size of the TextElement as it would be at 100%.

So for example, if you had a TextElement (when at 100%) with a width of 400 and a height of 200 and a text size of 24 point, when the user chose to 'fit in window', I'm setting the width to 316 (400 * 0.79 = 316), the height to 158 (200 * 0.79 = 158) and the text size to 19 point (24 * 0.79 = 18.96, which rounds up to 19). So it's possible that the text may wrap differently when at 19 point in a 316x158 box then when at 24 point in a 400x200 box.

I would suggest to always view your app at 100% prior to publishing or sharing to see how it's going to display in the Player or in a published App.  Another option is to to enter hard returns after each line to prevent text from wrapping so that it would appear to "wrap" the same regardless of zoom level.
Under review
I tried to recreate this problem by making three text elements with three different sizes but everything looked ok. Could you make a sample app for this, or could you tell us if you are using a specific font to and also the sizes of the text you have problems with. Thank you for the feedback.
Hi Alin,

What is your email I can share a sample page with you?

Clint
You can send the app at: alin@interactstudios.com
And you can share the app on: alin@interactbooks.com
I will recommend to send the app on a zip to so I can see it in builder to.
Thank you.
Hi Alin,
I reloaded a new player onto my iPad, but I'm having the same issues! Also, getting a white background instead of the blue one now!

Are you using the new Builder?  I am still using 3.3.1 build 335
The background problem will be fixed in the future release. To fix the white background go to the Page Properties and tap Background Style and reselect Solid Color.
This may be related: I'm using Windows 7 using the latest IB update. I designed a page that has a text box. The text shows as 2 rows when I work at "fit" to screen (79%). When I change the view to 100% the text has enlarged and now is on 3 rows with the bottom of the last row cut off because it runs outside the bottom boundary of the text box.
We were able to recreate this and we are working on a fix. Thank you for your feedback.
Started
Updated: We were able to recreate the error Mark found and we are working on a fix.
Answer
Not a bug
This is actually not a *bug* per se, but the way that text wraps based on the font selection. Zooming in and out is done by applying mathematical adjustments to the size of things - so when the user is at "fit in window" view (79% generally), we are applying the 79% to the width, height and font size of the TextElement as it would be at 100%.

So for example, if you had a TextElement (when at 100%) with a width of 400 and a height of 200 and a text size of 24 point, when the user chose to 'fit in window', I'm setting the width to 316 (400 * 0.79 = 316), the height to 158 (200 * 0.79 = 158) and the text size to 19 point (24 * 0.79 = 18.96, which rounds up to 19). So it's possible that the text may wrap differently when at 19 point in a 316x158 box then when at 24 point in a 400x200 box.

I would suggest to always view your app at 100% prior to publishing or sharing to see how it's going to display in the Player or in a published App.  Another option is to to enter hard returns after each line to prevent text from wrapping so that it would appear to "wrap" the same regardless of zoom level.
Thanks for the explanation and workaround suggestions. Have a good weekend!
Mark