Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Detecting android softkeyboard show/hide events

I am trying to detect showKeyboard and hidekeyboard events on phonegap. For that purpose, on deviceready event I placed following code:

  bindEvents: function() {
    document.addEventListener('deviceready', this.onDeviceReady, false);
},
// deviceready Event Handler
//
// The scope of 'this' is the event. In order to call the 'receivedEvent'
// function, we must explicity call 'app.receivedEvent(...);'
onDeviceReady: function() {
    document.addEventListener("menubutton",app.onMenuKeyPress,false);
    document.addEventListener("backbutton",navigateBack,false);
    document.addEventListener("hidekeyboard", onKeyboardHide, false);
    document.addEventListener("showkeyboard", onKeyboardShow, false);
},

Here backbuttonevent is being fired and working fine but hidekeyboard and showkeyboard events are never fired.

Also to detect it I tried to use window.onresize event, that worked in browser. Following is its code:

window.onresize = function(){
    var screenHeight = $(window).height();
    alert(screenHeight);
    var diff = screenInitialHeight - screenHeight;
    var newHeight = screenInitialHeight-diff;
    alert(newHeight);
    $('#mainpage').height(newHeight);
    $('#nav_container').height(newHeight);
}

But this code also didn't executed on show or hide keyboard. This function is only executing when first time app. is started. I saw at some places that for some people these events are working so I think there is some thing wrong from my side, probably in some config file etc. So following is androidmanifest.xml code:

    <?xml version='1.0' encoding='utf-8'?>
<manifest android:hardwareAccelerated="true" android:versionCode="1" android:versionName="1.0.0" android:windowSoftInputMode="adjustPan" package="com.phonegap.move_custom" xmlns:android="http://schemas.android.com/apk/res/android">
    <supports-screens android:anyDensity="true" android:largeScreens="true" android:normalScreens="true" android:resizeable="true" android:smallScreens="true" android:xlargeScreens="true" />
    <uses-permission android:name="android.permission.INTERNET" />
    <application android:debuggable="true" android:hardwareAccelerated="true" android:icon="@drawable/icon" android:label="@string/app_name" android:largeHeap="true">
        <activity android:configChanges="keyboardHidden|keyboard|screenSize|locale" android:label="@string/app_name" android:name="move_custom" android:screenOrientation="portrait" android:theme="@android:style/Theme.Black.NoTitleBar">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
    <uses-feature android:name="android.hardware.camera" android:required="false" />
    <uses-sdk android:minSdkVersion="10" android:targetSdkVersion="17" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.RECORD_AUDIO" />
    <uses-permission android:name="android.permission.RECORD_VIDEO" />
    <uses-permission android:name="android.permission.CAMERA" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <uses-feature android:name="android.hardware.camera" />
    <uses-feature android:name="android.hardware.camera.autofocus" />
</manifest>

Please let me know if anything need to be chagned. Also if these events are working in someone's app, then please share your app. so that I can try to check configuration and code that why it isn't working in my app. All good efforts will be appreciated. Seems like I am already near but missing something. So anything you can tell will probably be helpful.

    @Override
public void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);
    
    if (getResources().getConfiguration().orientation == 2) {
        super.setIntegerProperty("splashscreen", R.drawable.splash);
    }
    else {
        super.setIntegerProperty("splashscreen", R.drawable.splashportrait);
    }
    
    getWindow().clearFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);
    getWindow().addFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN);

    super.loadUrl(Config.getStartUrl(), 3000);
}
like image 448
Hafiz Avatar asked Nov 19 '13 21:11

Hafiz


People also ask

How do I detect if software keyboard is visible on Android device or not?

Android provides no direct way to determine if the keyboard is open, so we have to get a little creative. The View class has a handy method called getWindowVisibleDisplayFrame from which we can retrieve a rectangle which contains the portion of the view visible to the user.

How do I turn off soft keyboard on Android?

Hiding the Soft Keyboard Programmatically You can force Android to hide the virtual keyboard using the InputMethodManager, calling hideSoftInputFromWindow, passing in the token of the window containing your edit field. This will force the keyboard to be hidden in all situations.

What is windowSoftInputMode?

The Android Manifest Among the different default properties, you can see android:windowSoftInputMode . That's the property that we can change for the view behavior when the keyboard opens, which by default has a value of adjustResize .


1 Answers

Apparently showkeyboard / hidekeyboard events WILL NOT fire when you are running your app in a full-screen mode (eg. no status bar at the top) because the screen size doesn't change when the keyboard pops-up.
https://issues.apache.org/jira/browse/CB-392

If you do not want your app to run in fullscreen :

Try this first let's see if it narrows down your problem to the event firing or the function it tries to call when the event fires.

function onDeviceReady() {
    alert("Device Ready");
    document.addEventListener("showkeyboard", function(){ alert("Keyboard is ON");}, false);
    document.addEventListener("hidekeyboard", function(){ alert("Keyboard is OFF");}, false);
}

I have tested this on Android 4.2 and 4.3 worked fine on both.

Note:

To turn fullscreen off:
Remove NoTitleBar from your AndroidManifest.xml:

android:theme="@android:style/Theme.Black.NoTitleBar

And / or add these lines to the onCreate method in your MainActivity.java:

getWindow().clearFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);
getWindow().addFlags(WindowManager.LayoutParams.FLAG_FORCE_NOT_FULLSCREEN);
like image 59
benka Avatar answered Sep 28 '22 11:09

benka