Basically there is a lack of scaling problem. If its okay with you, I’m going to email you two samples. Lets see if it solves the problems or not. This isn’t production ready code. I need to know if your nexus 4 has issues with it.
Rob
Out of curiosity, were the extent of the issues discussed in this thread eventually addressed via build 2520?
Just curious if these are still relevant/outstanding matters or if it’s a closed topic.
Thank you!
We believe we have these addressed.
Rob
Out of curiosity, were the extent of the issues discussed in this thread eventually addressed via build 2520?
Just curious if these are still relevant/outstanding matters or if it’s a closed topic.
Thank you!
We believe we have these addressed.
Rob
I’m sorry but this problem still exist, at least on a Samsung S3 (Android 4.3) with Corona 2015.2646.
Since positioning is important in my app, I cannot let the text field height vary depending on the device format as has been suggested in this thread. Also, using the formula posted for dynamically setting the font size won’t do because the font becomes so small you can’t read it on an S3…
It has been a while since this thread was alive, is there a solution that I’m missing?
If you use Corona’s content scaling feature such as letterbox and *hardcode* the height of the TextField, then you’ll find that the TexField will be taller on low resolution screens and shorter on higher resolution screens. This is to be expected. Content scaling is best used for your actual content/graphics with display objects. This is how a game would normally do it.
Now, if you want your TextField height and font size to be the same native size as all other native apps on the same device, then you’ll need to set the height of the TextField based on the system’s default font size like this…
-- Create the text field. The height set here doesn't matter. local myTextField = native.newTextField ( display.contentCenterX, display.contentCenterY, display.contentWidth \* 0.8, 40 ) -- Setting "size" to nil or zero makes it use the system default font size. myTextField.size = nil -- This resizes the height of the text field to best-fit the new font size. myTextField:resizeHeightToFitFont()
The above will make the text field and its font size match all other native apps. Just note that the height of the field will vary wildly between different devices (depending on resolution and default font size). So, you’ll need to dynamically layout your app to accommodate.
Thanks Joshua!
I understand that I have to choose from either having too small fonts or not having full control over the text field height. I also assume that since it is a native object, it might be difficult to treat as a Corona bug.
If you use Corona’s content scaling and hard code the height, then odds are you risk making the text field either too tall or too small depending on your “config.lua” file’s content width and height. For example, if you set up your content width and height to 320x480 (original iPhone resolution), hard code the text field height, and then run it on an iPad… you’ll discover that the text field’s are ridiculously huge. You can see this with our sample app “Interface/NativeKeyboard”. But this can’t be helped if you hard code it in this fashion. It’s not technically a bug. More of a design issue with using a single content scale for all device resolutions and DPIs.
Note that this problem was solved a long time ago by HTML, Java AWT/Swing, .NET WPF/XAML, and Android. These UI frameworks layout the UI dynamically based on the system’s default font size, because this is really the only way to solve the problem when working with screens of various resolutions/DPIs. Plus, viewing distance is a factor as well, which means it’s up to the end-user to set the system’s default font size to a height that’s readable at the distance they’re viewing it at (this is typical on a PC). That’s why these UI frameworks lay things out based on default font size. This is something that works best for UI or business style apps… but for games you typically set things up with a global content scale like what Corona does.
Mixing the 2 is where things get interesting because the global content scale style system runs counter-intuitive with the other where you want to size things based on the default font size. In Corona, the global content scale always wins so-to-speak. So, if you receive a “resize” event where the aspect ratio changes (can happen on Android tablets when rotating from portrait to landscape), then the content scale will change as well and the size of your text fields and fonts will change with it. They’ll either scale up or down, when you really don’t want them to change at all (you want to maintain the default font size). So, you would have to re-apply the default font size to the text objects and text fields, and for the text fields, call the resizeHeightToFitFont() function again. It’s may seem kind of tedious to do, but it can’t really be helped. Corona is making sure that the content coordinates of all objects are the same as before after the change scale has changed. That’s what its global content scaling feature is supposed to do. And it’s exactly how you want it to work with a game’s content. But not necessarily for all UI. Except for maybe with WebViews and VideoViews. But hey, at least we do offer a resizeHeightToFitFont() convenience function. That way you don’t have to do the math yourself (involves convert Corona content coordinates to the platform’s native coordinates).
Joshua, thank you for your answer!
My config.lua looks like this:
local aspectRatio = display.pixelHeight / display.pixelWidth application = { content = { width = aspectRatio \> 1.5 and 320 or math.floor(480 / aspectRatio), height = aspectRatio \< 1.5 and 480 or math.floor(320 \* aspectRatio), scale = "letterBox", fps = 60, imageSuffix = { ["@2x"] = 1.5, ["@4x"] = 3.0, }, }, showRuntimeErrors = false, }
and my text field definition like this:
local field = native.newTextField(100, 200, 180, 30) field.font = native.newFont(native.systemFont) field.align = "left" field.hasBackground = true field.isSecure = false field.size = 12 field.inputType = "default"
Also, only landscape view is allowed. Still, the text field is proportionally of the same size on an iPhone and on an iPad. Have I misunderstood anything?
When you create a TextField, Corona will best-fit the font to fit the height of the field. Corona will automatically compensate for the field’s height, borders, margins, and the font’s line spacing. So, I recommend that you do *not* change the “size” property after creating a TextField unless you plan on calling resizeHeightToFitFont() afterwards. Otherwise you risk making the font size too small, or worse, too large and the text ends up getting clipped by the field’s margins/borders.
So, first try commenting out the line of code where you are setting the “size” property. If you do this, you’ll find that the font fits perfectly within the height of the field. That’s what you want, right?
That’s just the problem: if I remove the size setting from the code above, the font becomes huge and only the lower half of it is visible (tested on a Samsung S3 with Android 4.3).
Perhaps you are resizing the height of your TextField somewhere else in your code then? Because the auto-sizing of the font definitely works. Try doubling the height of your TextField upon creation.
Also, the margins on an Android TextField is much much larger than it is on iOS. This can’t be changed programmatically natively. That’s just how Google’s made the UI theme. If your TextField height is shorter than normal (ie: shorter than what you are seeing in other Android apps), then that’s a problem too. Your TextField will need to be taller.
And again, the ***best*** solution is to size the height of the field based on the default system font size. This will work on all platforms and display resolutions/DPIs. How you’re trying to size it now is not full proof.
I’m sorry but this problem still exist, at least on a Samsung S3 (Android 4.3) with Corona 2015.2646.
Since positioning is important in my app, I cannot let the text field height vary depending on the device format as has been suggested in this thread. Also, using the formula posted for dynamically setting the font size won’t do because the font becomes so small you can’t read it on an S3…
It has been a while since this thread was alive, is there a solution that I’m missing?
If you use Corona’s content scaling feature such as letterbox and *hardcode* the height of the TextField, then you’ll find that the TexField will be taller on low resolution screens and shorter on higher resolution screens. This is to be expected. Content scaling is best used for your actual content/graphics with display objects. This is how a game would normally do it.
Now, if you want your TextField height and font size to be the same native size as all other native apps on the same device, then you’ll need to set the height of the TextField based on the system’s default font size like this…
-- Create the text field. The height set here doesn't matter. local myTextField = native.newTextField ( display.contentCenterX, display.contentCenterY, display.contentWidth \* 0.8, 40 ) -- Setting "size" to nil or zero makes it use the system default font size. myTextField.size = nil -- This resizes the height of the text field to best-fit the new font size. myTextField:resizeHeightToFitFont()
The above will make the text field and its font size match all other native apps. Just note that the height of the field will vary wildly between different devices (depending on resolution and default font size). So, you’ll need to dynamically layout your app to accommodate.
Thanks Joshua!
I understand that I have to choose from either having too small fonts or not having full control over the text field height. I also assume that since it is a native object, it might be difficult to treat as a Corona bug.
If you use Corona’s content scaling and hard code the height, then odds are you risk making the text field either too tall or too small depending on your “config.lua” file’s content width and height. For example, if you set up your content width and height to 320x480 (original iPhone resolution), hard code the text field height, and then run it on an iPad… you’ll discover that the text field’s are ridiculously huge. You can see this with our sample app “Interface/NativeKeyboard”. But this can’t be helped if you hard code it in this fashion. It’s not technically a bug. More of a design issue with using a single content scale for all device resolutions and DPIs.
Note that this problem was solved a long time ago by HTML, Java AWT/Swing, .NET WPF/XAML, and Android. These UI frameworks layout the UI dynamically based on the system’s default font size, because this is really the only way to solve the problem when working with screens of various resolutions/DPIs. Plus, viewing distance is a factor as well, which means it’s up to the end-user to set the system’s default font size to a height that’s readable at the distance they’re viewing it at (this is typical on a PC). That’s why these UI frameworks lay things out based on default font size. This is something that works best for UI or business style apps… but for games you typically set things up with a global content scale like what Corona does.
Mixing the 2 is where things get interesting because the global content scale style system runs counter-intuitive with the other where you want to size things based on the default font size. In Corona, the global content scale always wins so-to-speak. So, if you receive a “resize” event where the aspect ratio changes (can happen on Android tablets when rotating from portrait to landscape), then the content scale will change as well and the size of your text fields and fonts will change with it. They’ll either scale up or down, when you really don’t want them to change at all (you want to maintain the default font size). So, you would have to re-apply the default font size to the text objects and text fields, and for the text fields, call the resizeHeightToFitFont() function again. It’s may seem kind of tedious to do, but it can’t really be helped. Corona is making sure that the content coordinates of all objects are the same as before after the change scale has changed. That’s what its global content scaling feature is supposed to do. And it’s exactly how you want it to work with a game’s content. But not necessarily for all UI. Except for maybe with WebViews and VideoViews. But hey, at least we do offer a resizeHeightToFitFont() convenience function. That way you don’t have to do the math yourself (involves convert Corona content coordinates to the platform’s native coordinates).
Joshua, thank you for your answer!
My config.lua looks like this:
local aspectRatio = display.pixelHeight / display.pixelWidth application = { content = { width = aspectRatio \> 1.5 and 320 or math.floor(480 / aspectRatio), height = aspectRatio \< 1.5 and 480 or math.floor(320 \* aspectRatio), scale = "letterBox", fps = 60, imageSuffix = { ["@2x"] = 1.5, ["@4x"] = 3.0, }, }, showRuntimeErrors = false, }
and my text field definition like this:
local field = native.newTextField(100, 200, 180, 30) field.font = native.newFont(native.systemFont) field.align = "left" field.hasBackground = true field.isSecure = false field.size = 12 field.inputType = "default"
Also, only landscape view is allowed. Still, the text field is proportionally of the same size on an iPhone and on an iPad. Have I misunderstood anything?
When you create a TextField, Corona will best-fit the font to fit the height of the field. Corona will automatically compensate for the field’s height, borders, margins, and the font’s line spacing. So, I recommend that you do *not* change the “size” property after creating a TextField unless you plan on calling resizeHeightToFitFont() afterwards. Otherwise you risk making the font size too small, or worse, too large and the text ends up getting clipped by the field’s margins/borders.
So, first try commenting out the line of code where you are setting the “size” property. If you do this, you’ll find that the font fits perfectly within the height of the field. That’s what you want, right?
That’s just the problem: if I remove the size setting from the code above, the font becomes huge and only the lower half of it is visible (tested on a Samsung S3 with Android 4.3).