Disabling Android zoom on INPUT element when focused

[jogo]

Hello Guys,

just a small tip how to disable zoom on Android devices for input elements. If you have an INPUT element in your app, Android will zoom page in when the element gets focus. At least on my HTC Desire S phone, running Android 2.3.5. I can see the same behavior also in GWT Mobile UI Kitchensink Demo App. When I go to Widgets -> TextBox and select any of these text boxes, the page zooms in, everything gets bigger and the whole app is misplaced then.

This did the trick for me:

In the MainActivity.java set the following features for your WebSettings object:

settings.setSupportZoom(true);

settings.setDefaultZoom(WebSettings.ZoomDensity.FAR);

As suggested here:

http://stackoverflow.com/questions/3702805/is-there-a-way-to-disable-the-zoom-feature-on-input-fields-in-webview

Plus another weird behavior on Android (not tested yet on iOS) device, in Safari all works fine. I have simple app layout:

HeaderPanel

ScrollPanel

CustomListPanel

CustomListItem1

...

CustomListItemN

FooterPanel

Each custom list item, when added to the CustomListPanel creates an INPUT element to let user set number of pieces per item. All works fine if number of items fits within the visible scroll area. I can set value for each INPUT element, even though I can't see the input field sometimes and is hidden behind the soft keyboard. But at least the soft keyboard shows up.

But as soon as there is more items and I have to scroll down to see the last one, I can still set values for all INPUT elements except the last one. The last INPUT element never gets focus.... Plus sometimes two cursors show up, or are misplaced (I'm editing item #7 and the cursor is flying somewhere over item #4)  :o)

I am going to play with it a bit more, but if you have any idea for workaround, or you ran into similar problem, let me know.

Happy coding with GWT Mobile!

[Zhihua (Dennis) Jiang]

Jogo, thanks for the tip. I don't remember if i have shared the same tip before, but I actually use the same trick for the ui kitchensink demo app. It works very well on my old 2.3 phone. I am quite wondering why it does not work on yours. For your reference, below is the code I use. Note I do not have the setSupportZoom() call. Maybe that is what causes it to not work on your phone. Just a guess.

        // This is to prevent zoom from changing when keyboard is shown.

        appView.getSettings().setDefaultZoom(ZoomDensity.FAR);

[jogo]

Hi Dennis,

hmm, it seems like HTC-specific issue.