ionic3实现双击返回按钮退出app,ionic实现返回按钮监听

版权声明:本文为博主原创文章,转载请注明出处!有时候也不是原创,手快就选了(我的文章随意转载复制,不在乎的哈!) https://blog.csdn.net/qq_31384551/article/details/81451672

监听类代码

import {Injectable} from '@angular/core';
import {App, IonicApp, Keyboard, NavController, Platform} from "ionic-angular";
import {AppService} from "../util/app.service";


/*
  Generated class for the HardwareBackButtonProvider provider.

  See https://angular.io/guide/dependency-injection for more info on providers
  and Angular DI.
*/
@Injectable()
export class HardwareBackButtonProvider {
  backButtonPressed: boolean = false;  //用于判断返回键是否触发
  private nav: NavController;

  constructor(public platform: Platform, public app: App, public appService: AppService, private keyboard: Keyboard) {

  }

  /**
   * 注册全局返回事件
   */
  registerBackButtonAction(ionicApp: IonicApp) {
    this.nav = this.app.getActiveNav();
    this.platform.registerBackButtonAction(() => {
      if (this.keyboard.isOpen()) {//如果键盘开启则隐藏键盘
        this.keyboard.close();
        return;
      }
      //如果想点击返回按钮隐藏toast或loading或Overlay就把下面加上
      // this.ionicApp._toastPortal.getActive() || this.ionicApp._loadingPortal.getActive() || this.ionicApp._overlayPortal.getActive()
      let activePortal = ionicApp._modalPortal.getActive() || ionicApp._loadingPortal.getActive() || ionicApp._overlayPortal.getActive();
      if (activePortal) {
        activePortal.dismiss().catch(() => {
        });
        activePortal.onDidDismiss(() => {
        });
        return;
      }
      return this.nav.canGoBack() ? this.nav.pop() : this.showExit()
    }, 1);
  }


  /**
   * 双击退出提示框
   */
  showExit() {
    if (this.backButtonPressed) { //当触发标志为true时,即2秒内双击返回按键则退出APP
      this.platform.exitApp();
    } else {
      this.appService.toast("再按一次返回退出自驾游应用")
      this.backButtonPressed = true;
      setTimeout(() => this.backButtonPressed = false, 2000);//2秒内没有再次点击返回则将触发标志标记为false
    }
  }
}

监听类注册到app.module.ts

import {HardwareBackButtonProvider} from "../providers/native/back-button.provider";
export const PROVIDERS = [
  HardwareBackButtonProvider
]

这样子就可以实现在APP首页提示点击两次返回按钮退出APP的提示,并且双击返回按钮退出APP

猜你喜欢

转载自blog.csdn.net/qq_31384551/article/details/81451672