native.newTextBox text wrapping

Hello! native.newTextBox wraps its text contents automatically on ios and android, but on macOS build, the text just goes to the right indefinitely, adding a scroll bar on the bottom. Is there an easy way to achieve automatic wrapping on desktop build?

Well, I found my own problem - I am working with Japanese language, and often it does not have  spaces between the characters. That is why the native text box wouldn’t wrap the text to it’s size…

Actually, the functionality of the native textBox is a bit strange. Event when inserting text in English, it does wrap it, but at a point about 2 times it’s given width in  native.newTextBox function…  :huh:

Now I’ve tried the sample code that comes with Corona, on native display objects, and it has the same behavior - on simulator, as well as when build for macos -  it does auto wrap the text, but only after the text entered goes far beyond the right border of the text box,  about twice its width, as far as I can tell… I guess my question is is this normal and is there a way to auto wrap the text based on boxes width?

We pretty much offer you the textField a textBox objects as provided by the platform you’re building for. I would think that the simulator running on a mac should have the same behavior as a compiled mac app.

Rob

I couldn’t get text wrapping to work on macos in native.newTextBox() either. It just doesn’t work as advertised.

A viable alternative is to use native.showWebPopup() instead. You have to save the text to a local file before displaying it (unless there is a way to load a string as the source instead of a file??) which may create issues, but it does not require any other html unless you want it. And you can add all sorts of features and capability with just a small amount of html and/or javascript. 

Here’s a really quick example:

-- main.lua a = "This is a \<b\>test.\</b\> " --a little html thrown in, just to illustrate. --make a nice long string to test text wrapping: longa = "" for i=1,50 do longa = longa..i..a end local xfile = "longa.htm" local filePath = system.pathForFile(xfile, system.DocumentsDirectory) if filePath then local file, errorString = io.open(filePath, "w") if file then file:write(longa) file:close() end end local options = { baseUrl = system.DocumentsDirectory, } native.showWebPopup(50, 100, 220, 300, "longa.htm", options)

Frank Reed
ReedNavigation.com/aboutfer/

@Rob - thanks. I actually tried the same thing on a second, non-retina monitor and funny thing - the text box would wrap the text more or less fine, just at the right border of the box, as it happens on iOS. I would guess that on Mac’s retina display the box becomes twice as wide internally, so it wouldn’t wrap correctly.  It would be interesting to see what’s the behavior on Windows for example…
@Frank - Thanks, thats a very neat idea! However the reason for choosing native.newTextBox() instead of anything else is on one hand to be able to display text, as well as give the user means to edit it easily and on the other - loading text and changing it rapidly is much faster in a native object than for example with display.newText… And the native textBox works well, just looks funny with the wrapping issue…

Can you put together a small app that demos the problem? If so, you can file a bug report using the link at the top of the page.

The demo project should be complete. That is main.lua, config.lua, build.settings and any other code/assets necessary in a .zip file so that our engineers can build, run and see the problem in action.

Thanks

Rob

Thanks,

Just filed a bug report. 

Thank you

Yanko

To get around the bug, spawn the textBox with half the width you desire, and then reset to your desired width on the next line. Works for me.

-- make text box with a width of 200 and which wraps at the right point local myTextBox = native.newTextBox( 0, 0, 200/2, 50 ) -- spawn with width of 100 to fix wrap bug myTextBox.width = 200 -- set width back to 200

Cheers,

Joe.

Thanks, Joe! 

It works for me as well, you are a lifesaver! 

Cheers!

Yanko

Well, I found my own problem - I am working with Japanese language, and often it does not have  spaces between the characters. That is why the native text box wouldn’t wrap the text to it’s size…

Actually, the functionality of the native textBox is a bit strange. Event when inserting text in English, it does wrap it, but at a point about 2 times it’s given width in  native.newTextBox function…  :huh:

Now I’ve tried the sample code that comes with Corona, on native display objects, and it has the same behavior - on simulator, as well as when build for macos -  it does auto wrap the text, but only after the text entered goes far beyond the right border of the text box,  about twice its width, as far as I can tell… I guess my question is is this normal and is there a way to auto wrap the text based on boxes width?

We pretty much offer you the textField a textBox objects as provided by the platform you’re building for. I would think that the simulator running on a mac should have the same behavior as a compiled mac app.

Rob

I couldn’t get text wrapping to work on macos in native.newTextBox() either. It just doesn’t work as advertised.

A viable alternative is to use native.showWebPopup() instead. You have to save the text to a local file before displaying it (unless there is a way to load a string as the source instead of a file??) which may create issues, but it does not require any other html unless you want it. And you can add all sorts of features and capability with just a small amount of html and/or javascript. 

Here’s a really quick example:

-- main.lua a = "This is a \<b\>test.\</b\> " --a little html thrown in, just to illustrate. --make a nice long string to test text wrapping: longa = "" for i=1,50 do longa = longa..i..a end local xfile = "longa.htm" local filePath = system.pathForFile(xfile, system.DocumentsDirectory) if filePath then local file, errorString = io.open(filePath, "w") if file then file:write(longa) file:close() end end local options = { baseUrl = system.DocumentsDirectory, } native.showWebPopup(50, 100, 220, 300, "longa.htm", options)

Frank Reed
ReedNavigation.com/aboutfer/

@Rob - thanks. I actually tried the same thing on a second, non-retina monitor and funny thing - the text box would wrap the text more or less fine, just at the right border of the box, as it happens on iOS. I would guess that on Mac’s retina display the box becomes twice as wide internally, so it wouldn’t wrap correctly.  It would be interesting to see what’s the behavior on Windows for example…
@Frank - Thanks, thats a very neat idea! However the reason for choosing native.newTextBox() instead of anything else is on one hand to be able to display text, as well as give the user means to edit it easily and on the other - loading text and changing it rapidly is much faster in a native object than for example with display.newText… And the native textBox works well, just looks funny with the wrapping issue…

Can you put together a small app that demos the problem? If so, you can file a bug report using the link at the top of the page.

The demo project should be complete. That is main.lua, config.lua, build.settings and any other code/assets necessary in a .zip file so that our engineers can build, run and see the problem in action.

Thanks

Rob

Thanks,

Just filed a bug report. 

Thank you

Yanko

To get around the bug, spawn the textBox with half the width you desire, and then reset to your desired width on the next line. Works for me.

-- make text box with a width of 200 and which wraps at the right point local myTextBox = native.newTextBox( 0, 0, 200/2, 50 ) -- spawn with width of 100 to fix wrap bug myTextBox.width = 200 -- set width back to 200

Cheers,

Joe.