产品需求:
1、安卓手机在app根目录页面点一次返回提示“再点一次退出应用”,点按第二次直接退出应用
2、在其余层级页面(非根目录页面),点按安卓硬件返回上一级
问题:
查询了很多资料,发现一般处理硬件都是在app.component.ts文件里面调用如下方法:
this.platform.registerBackButtonAction()
导致一个问题就是,无论是根目录页面还是其他非根目录的页面,这个处理都会起作用,即只满足需求1而不满足需求2
处理思路:
因此为了这两个需求都能满足,我们的处理方法就是先调用
this.app.getActiveNav().getActive().component
判断当前页面是否是根目录页面,在根据判断的结果做不同的处理。
需要注意的是有两种push页面的方式:
this.app.getRootNav().push()
this.navCtrl.push()
第一种是从根目录push页面,第二种是从分页面push页面,区别在于如果处理了硬件返回,一个是返回根目录,一个返回上一层级,否则会自己挖坑研究很久,我就是用了第一个方式push非根目录的页面,结果导致一直返回不了上一级,浪费了很久时间
还是在app.component.ts文件里面,先引入:
import { Platform, App, ToastController } from 'ionic-angular'
public platform: Platform,
private app: App,
public toastCtrl: ToastController
(1)首先,先写需求1的方法,这个还是比较简单的:
registerBackButton
exitApp () {
if (this.registerBackButton) {
this.platform.exitApp()
} else {
this.registerBackButton = true
this.toastCtrl.create({
message: '再按一次退出应用',
duration: 2000,
position: 'top',
cssClass: 'toast-black'
}).present();
setTimeout(() => this.registerBackButton = false, 2000);//2秒内没有再次点击返回则将触发标志标记为false
}
}
(2)其次,判断当前是否是根目录:
// 引入几个根目录页面
import { Page1} from '../page1路径'
import { Page2} from '../page2路径'
// 全局变量
checkPage
// 判断当前页面
goBackLogic() {
var currentCmp = this.app.getActiveNav().getActive().component
var isPage1= currentCmp === Page1
var isPage2= currentCmp === Page2
if (isPage1 || isPage2) {
this.checkPage = true
} else {
this.checkPage = false
}
}
(3)最后处理,调用安卓硬件处理会返回一个方法,因此定义:
private registerBackEvent: Function
this.registerBackEvent = this.platform.registerBackButtonAction(() => {
this.goBackLogic()
console.log('监听右键Boolean值:' + this.checkPage)
if (this.checkPage) {
//如果是根目则按照需求1处理
this.exitApp()
} else {
//非根目录返回上一级页面
this.app.goBack()
}
}, 10)
// 后面的数字10是必要参数,如果不写默认是0,数字越大优先级越高