Softkeyboard in PhoneGap covers input elements

Question

I've seen this question a few times, though none of the answers seems to work for me. I suspect I have done something incredibly stupid, and have missed the obvious (+1 for peer programming?)

Developing for Android (SDK Version 8+) with PhoneGap (Cordova) 2.0.0. I have a full page form for user settings input, with equally spaced elements running down the page, with cancel and submit buttons at the very bottom. When a user touches the upper elements, the softkeyboard pops up, and there is no issue. However, if the user touches an element which would be under the soft keyboard (if it were showing), then it is covered by the keyboard when it pops up.

I have attempted various incantations and incarnations of android:windowSoftInputMode="adjustPan" in the manifest file (based on http://solutions.michaelbrooks.ca/2011/07/05/android-soft-keyboard-resizes-web-view/ and http://developer.android.com/guide/topics/manifest/activity-element.html#wsoft), but to no avail, elements will be hidden by the keyboard.

The relevent section of my manifest file looks like this

<application
    android:icon="@drawable/ic_launcher"
    android:label="@string/app_name"
    android:theme="@style/AppTheme" >
    <activity
        android:name=".title"
        android:label="@string/title" android:screenOrientation="portrait">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />

            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
        android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale"
        android:windowSoftInputMode="adjustPan"
    </activity>
</application>

and the viewport section of the index.html (which i've seen some posts about changing)

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">

any pointers would be greatly appreciated

cheers

Willis

you can check this post,It works fine - https://mcmap.net/q/1862815/-input-field-hidden-when-soft-keyboard-appears-in-phonegap – Toots

Answer 1

Instead of

android:windowSoftInputMode="adjustPan" 

try

android:windowSoftInputMode="adjustResize"

Gassaway

Answer 2

android:windowSoftInputMode="adjustResize"

It works fine on my phone (4.1)

Geerts

Answer 3

This has been a big issue for me too, on Android 2.x and early 4.x.

Correct me if I'm wrong, but I think that android:windowSoftInputMode is for native development and applies when an activity is started. Changing that setting hasn't seemed to affect my PhoneGap/Cordova projects.

When an edit field receives focus, I scroll the window into position explicitly:

onFocusEditField = function(comp, e, eopts) {
    if(Ext.os.is.Android) {
        var ost = comp.element.dom.offsetTop;
        this.getParent().getParent().getScrollable().getScroller().scrollTo(0, ost-50);
    }
};

Note: using Sencha Touch 2.x.

Radom