How to control android backbutton routes?

Question

The default in Onsen is that the app closes/exits when the device backbutton is pressed. Is there any way to control that in Onsen to also mimic the ons-navigator action/page history?

Thanks!

Answer 1

No need to handle backbutton event to prevent application being killed. Onsen-ui Added support to android back-button on ons-navigator and ons-sliding-menu from v1.1.1.

You can check here

Answer 2

You can controll it with "disableDeviceBackButtonHandler" after ons.ready event. After that add a event listener for back button and do anything you want.

ons.ready(function() {
  ons.disableDeviceBackButtonHandler();

  // Use Cordova handler
  window.document.addEventListener('backbutton', function() {
    // Handle backbutton event
  }, false);
});

Just check this article: https://onsen.io/guide/overview.html#HandlingBackButton

Answer 3

In case of PhoneGap/Cordova, backbutton event is fired when the backbutton is pressed. Therefore, you can set the eventhandler s.t.

document.addEventListener("backbutton", onBackKeyDown, false);

In eventhandler function, you can call popPage method of navigator by obtaining the navigator scope s.t.

function onBackKeyDown() {
    // Handle the back button
    alert("Backbutton is pressed!");
    var element = document.querySelector( ".navigator-container");
    var scope = angular.element( element ).scope();
    scope.popPage();
}

If you are using Monaca, the hybrid application framework based on Cordova, the backbutton event is not fired. Instead that you can use the .ui file in which the Backbutton event is defined s.t.

{
    "event" : {
        "onTapBackButton" : "onBackKeyDown();"
    }
}