Shulou(Shulou.com)06/01 Report--

This article mainly explains the "ionic how to monitor the android return key to achieve another exit function", the article explains the content is simple and clear, easy to learn and understand, the following please follow the editor's ideas slowly in-depth, together to study and learn "how ionic monitors the android return key to achieve another press exit function" bar!

App on the android platform often encounters the function of "pressing to exit app again" on the main page to avoid exiting the app enhanced experience optimization by pressing the return key.

1. This function requires us to use the registerBackButtonAction method provided by ionic (register the hardware back button action)

RegisterBackButtonAction (callback, priority, [actionId])

Parameter type description

Callback function triggers when the back button is clicked, if the monitor has the highest priority

Only the highest priority of the priority number will execute

ActionId (nullable) * the id specifies that this action defaults to a random and unique id

Priority of the back button:

Return to previous view = 100

Close side menu = 150

Close template modal = 200

Close the pull-up menu action sheet = 300

Close dialog box popup = 400

Close the load box loading = 500

Note: return: function a triggered function that will log out of backButtonAction.

If we do not want to register the return button to affect all pages, we will call the return function again.

For example, if a pull-up menu is already displayed, the back button should close the pull-up menu instead of returning to a page view or closing an open model.

So to achieve the function of "pressing to exit app again", we can set the priority priority to 101.

2. Code implementation

In js

Angular.module ("app") .run (["$rootScope", "$ionicPlatform", "$location", "$ionicHistory", function ($rootScope, $ionicPlatform, $location, $ionicHistory) {"use strict"; / / when the user presses the return key on the main page, give a prompt, and if you start the return key again within 2 seconds, exit app function showTipMsg () {window.plugins.toast.showShortCenter ("exit app once") / / toast is a plug-in cordova-plugin-x-toast for cordova. You can also use the pop-up window of ionic instead of $rootScope.exitApp = true; const delay = 2000; setTimeout (() = > {$rootScope.exitApp = false;}, delay) } / / determine whether the current route is the main page of project, mission,mine and message function isExitPage () {let path = $location.path (), state = _ .last (path.split ("/")), ary = ["project", "mission", "mine", "", "message"]; return _ .route (ary, state) } / / return event function registerBackButton (event) {event.preventDefault (); $cordovaKeyboard.isVisible () & & $cordovaKeyboard.close (); if (isExitPage ()) {$rootScope.exitApp & & ionic.Platform.exitApp ();! $rootScope.exitApp & & showTipMsg ();} else {$ionicHistory.goBack ();} return false } / / the ionic environment is ready for ionic.Platform.ready (() = > {try {const priority = 101; $ionicPlatform.is ("Android") & & $ionicPlatform.registerBackButtonAction (registerBackButton, priority);} catch (e) {console.warn ("Application is running in browser causes inspection failed.");}});}]) Thank you for your reading, the above is the content of "how ionic monitors the android return key to achieve another click on the exit function". After the study of this article, I believe you have a deeper understanding of how ionic monitors the android return key to achieve another exit function, and the specific use still needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.