Sunday, April 21, 2013

[android help] PhoneGap / Sencha Touch: WebView render issue on hide SoftKeyboard


A few months back, I spent a ton of time trying to figure this issue out. Tried out a bunch of stuff, sifted through Google/StackOverflow.


Ultimately I wasn't able to do exactly what I was looking for; it doesn't look like we have enough (easy) control over the keyboard from Sencha Touch/PhoneGap for a lot of things (on top of the keyboard position, we also have basically 0 control over what the "return/go/ok" button actually does, which varies between Android versions, especially when it's a number field.) However:


Mitigation 1: windowSoftInputMode="stateUnspecified|adjustResize" will cause the keyboard to cover the input, but once the user starts typing, the screen will adjust to show the input right above the keyboard, and things will revert as desired upon input blur. This is at least the case for my Samsung Galaxy S2 (2.6), Samsung Galaxy S3 (4.2), and Kyocera Rise (4.0).


Mitigation 2: One solution I implemented was, on input focus, changing the position of the inputs to guarantee that they'll be above the keyboard. Upon input blur, the input will change to its original location. This is not ideal because you'll often see the inputs move to the new location before the keyboard covers it up, so it looks pretty janky.


Mitigation 3: For number fields, I used a modified version of https://market.sencha.com/extensions/numpad that created a virtual keyboard and set it to "showBy()" the required input. That ensured that the keyboard never covered up the input and the app didn't have to deal with any re-positioning of the screen (screenshot below).


Problem with mitigation 3: The problem here is that it is only for number fields, and I was not able to find any standard keyboard plugins for Sencha Touch (my app is number focused so that limitation was acceptable.) That said, I'm sure you could spend a few days using the numpad plugin as a core to build a virtual keyboard that could work in a similar way.


Sorry for the lack of a perfect solution. I hope this is helpful!


enter image description here



.

stackoverflow.comm

No comments:

Post a Comment

Google Voice on T-Mobile? [General]

Google Voice on T-Mobile? So I recently switched from a GNex on Verizon to a Moto X DE on T-Mobile. I had always used Google Voice for my v...