Preventing Android’s hardware back button closing an app

Published / Publicado : 2012-10-11 02:09:46 | By: Agustín Amenabar L.

The ideal would be to have it working along the in-app back button, but sometimes one has time (or budget) only for a quick hack, in my case a confirmation for closing the app before exiting is exactly what was needed.

Sencha Touch 2 has no way of closing the app, so to close the app we must rely on Phonegap, so here is the code… Plainly ripped off and hacked small from Michael Ritchie and The Cordova Docs

Sencha way

launch: function(){
	/* regular launch stuff */

    if (Ext.os.is('Android')) {
        document.addEventListener("backbutton", Ext.bind(onBackKeyDown, this), false);  // add back button listener

        function onBackKeyDown(eve) {
            eve.preventDefault();
            Ext.Msg.confirm("Exit", "¿Seguro que quieres cerrar el app?",  function ( answer ) { 
                if ( answer == 'yes') { 
                    navigator.app.exitApp();
                } else { 
                    //do nothing
                } 
            });
        }
    }
},

In a Sencha Touch 2 app I’d place it in the app.js file, but might as well go inside a controller if you know the ropes.

Only Phonegap

A Cordova-only implementation would be something like this, the notification syntax is nice on Cordova ( look at the docs here ):

function onDeviceReady() {
    if(device.platform == "Android"){
        document.addEventListener("backbutton", onBackKeyDown, false);
    }
}

function onBackKeyDown() {// Handle the back button
    navigator.notification.confirm(
            'Are you certain you want to close the app?',  // message
            function( index ){
                if( index == 1 ){//look at the docs for this part
                    navigator.app.exitApp();
                }
            },              // callback to invoke with index of button pressed
            'Exit',            // title
            'Yes,No'          // buttonLabels
        );
}

document.addEventListener("deviceready", onDeviceReady, false);

From their docs I’m not overly confident on Phonegap knowing always if a device is an Android, but it would certainly work for the ones that unequivocally are.

And that’s all folks, easy peasy.