ionic实现双击返回键退出功能

实现这个功能需要四个步骤：

步骤一:

说明：因为需要和手机的硬件（返回按钮）打交道，而ionic本身是不具备该功能的，但是有一个东西可以：ng-cordova插件，这个插件是phoneGap为了能让ionic操作硬件而为ionic量身打造的一款插件，只要安装上这个插件，我们的ionic应用就具备了拍照，浏览图库，监听返回按钮等等功能。

操作：按照这个网址http://ngcordova.com/docs/install/上面说的安装好ng-cordova插件

步骤二：

说明：上述的ng-cordova这个插件有点像Java语言中接口的意思，具体需要实现什么功能我们还要为他安装它的实现类（它的插件），现在我们要提示用户“再按一次退出系统”的一个提示框，这个提示框的插件叫做cordova-toast(或叫cordovaToast或叫$cordovaToast)。

操作：在DOS窗口中进入你当前Ionic应用的目录，输入命令：cordova plugin add https://github.com/EddyVerbruggen/Toast-PhoneGap-Plugin.git

步骤三：

说明：插件安装完成之后我们还需加入（注入）依赖之后才能使用

操作：在如步骤四的代码中加入$cordovaToast，同时借助于ionic自身的$ionicPlatform,$location,$rootScope,$ionicHistory

步骤四：代码实现

angular.module('lqApp', ['ionic','ngCordova'])

    .run(['$ionicPlatform','$location','$rootScope','$ionicHistory','$cordovaToast',

        function ($ionicPlatform,$location,$rootScope,$ionicHistory,$cordovaToast) {

            $ionicPlatform.ready(function () {

                // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard

                // for form inputs)

                if (window.cordova && window.cordova.plugins.Keyboard) {

                    cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);

                }

                if (window.StatusBar) {

                    // org.apache.cordova.statusbar required

                    StatusBar.styleDefault();

                }

            });

            /********************双击退出start********************/

            $ionicPlatform.registerBackButtonAction(function (e) {

                //判断处于哪个页面时双击退出

                if ($location.path() == '/login' || $location.path() == '/tab/main' ) {

                    if ($rootScope.backButtonPressedOnceToExit) {

                        ionic.Platform.exitApp();

                    } else {

                        $rootScope.backButtonPressedOnceToExit = true;

                        $cordovaToast.showShortBottom('再按一次退出系统');

                        setTimeout(function () {

                            $rootScope.backButtonPressedOnceToExit = false;

                        }, 2000);

                    }

                }

                else if ($ionicHistory.backView()) {

                    $ionicHistory.goBack();

                } else {

                    $rootScope.backButtonPressedOnceToExit = true;

                    $cordovaToast.showShortTop('再按一次退出系统')

                        .then(function(success) {

                            // success

                            alert("'success");

                        }, function (error) {

                            // error

                            alert("error");

                        });

                    setTimeout(function () {

                        $rootScope.backButtonPressedOnceToExit = false;

                    }, 2000);

                }

                e.preventDefault();

                return false;

            }, 101);

            /********************双击退出end********************/

 }]);

巴特西

ionic实现双击返回键退出功能

最新文章

热门文章