How to Exit App when Back button is pressed in mobile app
Question
Application Type
Mobile

Hi,

In my Mobile App i have few pages that perform some operation and once completed, i route the action back to the Home page which is the Dashboard for the application. Now Once i land on the Homepage, if i press back button, this goes back to the last page which was doing some operation. 

I want to prevent such actions by disabling the back button action when i am in my Homepage. Or even close the App when i am in my Homepage. 

Is it possible to do this for both Android and IOS App?

Thanks

mvp_badge
MVP
Solution

Hi Learn It,


I think the back button only applies to Android, not to iOS, right?

I have used the Android back button key forge component to have a handler when a back button pressed in Android.

Then in the handler, you can use the destination to go to a given screen or to close the application with the following JavaScript:

if (navigator.app) {

    navigator.app.exitApp();

}


This is a client action I wrapped for closing the app:


And then on the handler on the mainpage, I close the app:



Hope it helps.


Kind Regards,
João

mvp_badge
MVP

Hi,

you can some JS code on click event.

navigator.app.exitApp();


use this in JavaScript widget its worked.


Hope this will help you.

Regards

Rahul.

Hi Rahul,

Should i use this js code in On Applicaiton Ready Event? 

Thanks

you can use this code in Back button based on your condition.


Hi,

You can also use the ExitOnBack forge component to exit the and also you can do as per Rahul's comment. 

Here is an example of what Rahul said , you can go through it , may be it help you,

https://www.outsystems.com/forums/discussion/35944/force-mobile-app-to-close/

https://www.outsystems.com/forge/component-overview/1805/exit-on-back

Regards,

Komal


Hi Komal,

I checked the question you mentioned. It is setting this JS code in On Application ready Event. I am not sure if i should be using it like that. Please advise.

thanks

You can use the same code in your back action or you can use the forge component as well,

Hi Komal,

I dont have any explicit button that does this back operation. I am talking about the native actions associated with the Android or IOS navigations. I dont know how i can access those properties. Hope you understand my question

mvp_badge
MVP
Solution

Hi Learn It,


I think the back button only applies to Android, not to iOS, right?

I have used the Android back button key forge component to have a handler when a back button pressed in Android.

Then in the handler, you can use the destination to go to a given screen or to close the application with the following JavaScript:

if (navigator.app) {

    navigator.app.exitApp();

}


This is a client action I wrapped for closing the app:


And then on the handler on the mainpage, I close the app:



Hope it helps.


Kind Regards,
João

mvp_badge
MVP

Hello Learn It,

Hope you're doing well.


If you want to disable your back button, you just need to use the following JavaScript code:

 

document.addEventListener("backbutton", function(){}, false);


If you want to fully disable this back button for your entire application, you should place it in your OnApplicationReady and OnApplicationResume events:


If you just want to disable for your Homepage, you need to use it in your OnReady event for that screen. And you should remove the Listener in OnDestroy event of the screen in this scenario as well:

document.removeEventListener("backbutton", function(){}, false);


This should apply only for Android devices, since iOS devices don't have a back button.


Hope that this helps you!


Kind regards,

Rui Barradas

Hi Rui,

I tried this solution, but now the Back button is disabled throughout the application. I have kept the removeEventListener action in OnDestroy as suggested, but still the action is impacting other screens.

Also, is there a way to close the application rather than disabling the back button?

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.