native.newTextField on android not aligning correctly?

Getting Started Newbie Questions
#1

I’m trying to use the native textfield on androind and for some reason the text is always cut off. I’ve tried lowering the size of the text and increasing the height of the text field and still does the same thing. It almost seems like the anchorY is set to .5 instead of 0. Here is an image of what it’s doing:

aTbHVdC.png

Here is the code that I’m using
 

usernameTextField = native.newTextField(150, 150, 300, 60) usernameTextField.text = "Dave" usernameTextField.anchorX = 0 usernameTextField.x = thumbnailBg.x + (thumbnailBg.width/2) + 10 usernameTextField.y = thumbnailBg.y + (usernameTextField.height/2) + 10 usernameTextField:addEventListener("userInput", textListener) sceneGroup:insert(usernameTextField)
#2

I think I remember reading that by default, all display objects have anchorX = .5, and anchorY = .5. From your code it looks like you set the anchorX to zero but leave the anchorY untouched. Have you tried setting anchorY to 0 as well?

For future reference, if you want to override the default anchor values you can throw this into your main.lua

display.setDefault( "anchorX", 0 ) display.setDefault( "anchorY", 0 )
#3

Yeah by default objects are .5 for anchorX and anchorY. I haven’t tried setting the anchorY to 0 because I figured the anchorY would be for the textfield object itself not the text inside the object. I will give it a shot though.

Edit: Okay tried to set the anchorY to 0 and it did only affect the textfield object not the text inside it. I ran it on the device anyways just to see and it’s still doing the same thing.

#4

Hi @dmglakewood,

Did you try setting up the text field as indicated under “Android Sizing” in this guide?

http://docs.coronalabs.com/daily/api/library/native/newTextField.html

Brent

#5

Not really sure how I missed that but I’m trying it now. What I’m seeing though is that I need to keep the font size really small like less then 50% the height of the text field in order for the text not to get cut off. If I make the text any larger then it is right now it starts to get cut off on android

tEFFvmS.png

#6

I think I remember reading that by default, all display objects have anchorX = .5, and anchorY = .5. From your code it looks like you set the anchorX to zero but leave the anchorY untouched. Have you tried setting anchorY to 0 as well?

For future reference, if you want to override the default anchor values you can throw this into your main.lua

display.setDefault( "anchorX", 0 ) display.setDefault( "anchorY", 0 )
#7

Yeah by default objects are .5 for anchorX and anchorY. I haven’t tried setting the anchorY to 0 because I figured the anchorY would be for the textfield object itself not the text inside the object. I will give it a shot though.

Edit: Okay tried to set the anchorY to 0 and it did only affect the textfield object not the text inside it. I ran it on the device anyways just to see and it’s still doing the same thing.

#8

Hi @dmglakewood,

Did you try setting up the text field as indicated under “Android Sizing” in this guide?

http://docs.coronalabs.com/daily/api/library/native/newTextField.html

Brent

#9

Not really sure how I missed that but I’m trying it now. What I’m seeing though is that I need to keep the font size really small like less then 50% the height of the text field in order for the text not to get cut off. If I make the text any larger then it is right now it starts to get cut off on android

tEFFvmS.png

#10

Hi,

I have exactly the same issue with native.newTextField on an android device - has your problem been fixed and if so how was it fixed?

Thanks

#11

Please look at the sample app in SampleCode/Interaface/NativeKeyboard

Notice how that there is code to adjust for this:

local inputFontSize = 18 local inputFontHeight = 30 tHeight = 30 if isAndroid then         -- Android text fields have more chrome. It's either make them bigger, or make the font smaller.         -- We'll do both         inputFontSize = 14         inputFontHeight = 42         tHeight = 40 end
#12

I found that this only works in some devices. It seems as though every device handles the textfield differently. I have yet to make it look good on multiple devices. 

#13

Right, different versions of Android have different amounts of chrome.  Different makers could change it even more.

Rob

#14

What do you mean by chrome? The issue I’ve noticed is spacing related. I can get the margin and padding correct on one device but then on the next device the text is half showing. For example the image I posted above looks decent but this is the same code on a different device 

pljWoq8.png?1

#15

Chrome refers to the artwork around the actual typing area in this case.  For you’re browser, “Chrome” refers to the space taken up by the scroll bars, the nav bar, the book mark bars, the tab bar, etc.  Anything that’s not part of the actual viewport is it’s “chrome”.  Some browsers for instance have a border around the viewing area.

In this case, Android has various designs around the actual usable space.  Look at these examples:
 

http://i.stack.imgur.com/OZkWA.png

https://appygram-images.storage.googleapis.com/images/products/five-guys-feedback-android.png

http://developer.android.com/design/media/text_input_typesandtypedown.png

http://www.kamalan.com/download/android_documents/developer.android.com/design/media/text_input_typesandtypedown.png

http://webhole.net/wp-content/uploads/2011/09/all_fields_are_required_toast.png

You can see that Android text fields decorations are all over the place.

Rob

#16

Hi,

I have exactly the same issue with native.newTextField on an android device - has your problem been fixed and if so how was it fixed?

Thanks

#17

Please look at the sample app in SampleCode/Interaface/NativeKeyboard

Notice how that there is code to adjust for this:

local inputFontSize = 18 local inputFontHeight = 30 tHeight = 30 if isAndroid then         -- Android text fields have more chrome. It's either make them bigger, or make the font smaller.         -- We'll do both         inputFontSize = 14         inputFontHeight = 42         tHeight = 40 end
#18

I found that this only works in some devices. It seems as though every device handles the textfield differently. I have yet to make it look good on multiple devices. 

#19

Right, different versions of Android have different amounts of chrome.  Different makers could change it even more.

Rob

#20

What do you mean by chrome? The issue I’ve noticed is spacing related. I can get the margin and padding correct on one device but then on the next device the text is half showing. For example the image I posted above looks decent but this is the same code on a different device 

pljWoq8.png?1