How to disable the physical back button on Android devices?

You must Login before you can answer or comment on any questions.

I have a very simple mobile app that simply loads an HTML website in webview. Here is the code of my app.js:

Titanium.UI.setBackgroundColor('#000');
var webview = Titanium.UI.createWebView({url:'home.html'});
var thewindow = Titanium.UI.createWindow({
    fullscreen:true,
    modal:true,
    tabBarHidden:true,
    navBarHidden:true
});
thewindow.add(webview);
thewindow.open();
Everything is self-contained within the app so I have no need for the physical back button (or the physical menu/options button).

The problem I'm having is that whenever I click the physical back button, the screen just goes to black and I have to force quit and then re-open the app to get back into it.

Is there a way to completely disable the physical back button?

— asked 3 years ago by Ben Voth
0 Comments

4 Answers

Accepted Answer

Ben,

I have a similar app and I solved it by adding the following code. I modified the code to match your variable names:

// make sure Android doesn't close on the back button
thewindow.addEventListener('android:back',function(e) {
    if (webview.canGoBack()) {
        webview.goBack();
    } else {
       a.show(); // show the leaving dialog
    }
    return false;
});
By the way, the a.show() code above allows me to prompt the user if they want to leave or not. It shows up on the last back button press. That code follows:
var a = Ti.UI.createAlertDialog();
 
a.message = 'Exit Your App Name Here?';
a.buttonNames = ['Yes','No', 'Logout'];
a.cancel = 1;
 
a.addEventListener('click', function(e)
{
    if (e.index == 2) {
        // I do some logout cleanup stuff here
        main.close();
    }
    if (e.index == 0) {
        main.close();
    }
 
});
 
thewindow.add(a);
Hope this helps.

— answered 3 years ago by Ken Hamlin
answer permalink
1 Comment
  • Sorry, but I skipped an edit for your variable names. The main.close() should be thewindow.close() in your app.

    — commented 3 years ago by Ken Hamlin

Excellent, thank you Ken. This was very helpful.

Just a note: Using all the code you provided, it didn't quite work the way I needed it to. It worked as expected on the landing page ('home.html') but then if I click onto a different HTML page and try to use the 'Back' button there, it would still act odd (load a blank page, click 'Back' again and I get the pop-up box where I can quit but if I choose not to it still stays on this blank page). So what I did was just use this snippet from your code:

thewindow.addEventListener('android:back',function(e) {
  // do nothing
});
And that effectively disables the 'Back' button functionality.

Again, thank you for the quick reply Ken.

— answered 3 years ago by Ben Voth
answer permalink
1 Comment
  • No problem. By the way, if you add your window to a tab group (even if it's just the one tab) you might get better functionality. I do the following:

    var tabGroup    = Titanium.UI.createTabGroup();
     
    // this parameters for the tab can be whatever your look and feel require
    var mainTab = Titanium.UI.createTab({
        // below shows an icon
        icon:'images/tabheader.png',
        // alternatively, you could just have a title
        //title:'My Webpage',
        backgroundFocusedColor:'#929190',
        backgroundSelectedColor:'#929190',
        backgroundColor:'#929190'
    });
     
    mainTab.window = thewindow;
    tabGroup.addTab(mainTab);
    tabGroup.open();
    and the back button works as you would expect without the blank background. It also keeps you from having to build a back function into webpages.

    Just a thought. Either way, glad to help.

    — commented 3 years ago by Ken Hamlin

There isn't a way to disable the physical buttons on the phone, they are part of the design and you have to build with them in mind. In your case, you need a screen that becomes the 'homescreen' that has the ability to relaunch or restart your app.

Thank you for your reply.

Do you have any suggestions on how to do this? Or do you have a link to a tutorial on how to do this?

Your Answer

Think you can help? Login to answer this question!