React Native学习之Android的返回键BackAndroid详解
前言
最近在学习使用ReactNative开发,iOS搞完,开始适配安卓,由于木有接触过安卓,所以碰到了很多问题,第一个问题,安卓的返回键BackAndroid问题,
我写了一个工具类,来搞定,其中用到了java原生代码与js交互;好吧，下面开始正式内容：
上代码:
//BackAndroidTool
//功能:"安卓手机上的返回键"
//Createdby小广on2016-05-10下午.
//Copyright©2016年Allrightsreserved.
/*
使用:参考链接:http://reactnative.cn/post/480
1.在首页/homepage页(只需要在全局都存在的页面调用一次监听即可)
componentDidMount(){
//添加返回键监听
BackAndroidTool.addBackAndroidListener(this.props.navigator);
}
componentWillUnmount(){
//移除返回键监听
BackAndroidTool.removeBackAndroidListener();
}
说明：BackAndroid在iOS平台下是一个空实现，
所以理论上不做这个Platform.OS==='android'判断也是安全的。
2.某些类自定义返回键操作(即点击返回键弹出一个alert之类的操作)
在所需类的初始化方法里调用BackAndroidTool.customHandleBack
栗子:
constructor(props){
super(props);
BackAndroidTool.customHandleBack(this.props.navigator,()=>{
Alert.alert('提示','您还未保存记录,确定要返回么?',
[{text:'取消',onPress:()=>{}},
{text:'确定',onPress:()=>{this.props.navigator.pop();}}
]);
//一定要returntrue;原因上面的参考链接里有
returntrue;
});
}
3.某些页面需要禁用返回键
在nav进行push的时候,设置属性ignoreBack为true即可
this.props.navigator.push({
component:所需要禁用的类,
ignoreBack:true,
});
*/
'usestrict';
importReact,{
Platform,
Navigator,
BackAndroid,
ToastAndroid,
NativeModules,
}from'react-native';
//类
varNativeCommonTools=NativeModules.CommonTools;
exportdefault{
//监听返回键事件
addBackAndroidListener(navigator){
if(Platform.OS==='android'){
BackAndroid.addEventListener('hardwareBackPress',()=>{
returnthis.onBackAndroid(navigator);
});
}
},
//移除监听
removeBackAndroidListener(){
if(Platform.OS==='android'){
BackAndroid.removeEventListener('hardwareBackPress',()=>{
});
}
},
//判断是返回上一页还是退出程序
onBackAndroid(navigator){
if(!navigator)returnfalse;
constrouters=navigator.getCurrentRoutes();
//当前页面不为root页面时的处理
if(routers.length>1){
consttop=routers[routers.length-1];
if(top.ignoreBack||top.component.ignoreBack){
//路由或组件上决定这个界面忽略back键
returntrue;
}
consthandleBack=top.handleBack||top.component.handleBack;
if(handleBack){
//路由或组件上决定这个界面自行处理back键
returnhandleBack();
}
//默认行为：退出当前界面。
navigator.pop();
returntrue;
}
//当前页面为root页面时的处理
if(this.lastBackPressed&&(this.lastBackPressed+2000>=Date.now())){
//最近2秒内按过back键，可以退出应用。
NativeCommonTools.onBackPressed();
returntrue;
}
this.lastBackPressed=Date.now();
ToastAndroid.show('再按一次退出应用',ToastAndroid.SHORT);
returntrue;
},
//自定义返回按钮事件
customHandleBack(navigator,handleBack){
if(navigator){
letroutes=navigator.getCurrentRoutes();//nav是导航器对象
letlastRoute=routes[routes.length-1];//当前页面对应的route对象
lastRoute.handleBack=handleBack;
}
},
}
其中的java原生代码如下:
管理类:RCTCommonToolsPackage(ps:如是不明白,可以去这里ReactNative学习:http://reactnative.cn/docs/0.25/native-modules-android.html#content);
packagecom.commonTools;
importcom.facebook.react.ReactPackage;
importcom.facebook.react.bridge.JavaScriptModule;
importcom.facebook.react.bridge.NativeModule;
importcom.facebook.react.bridge.ReactApplicationContext;
importcom.facebook.react.uimanager.ViewManager;
importjava.util.Arrays;
importjava.util.Collections;
importjava.util.List;
publicclassRCTCommonToolsPackageimplementsReactPackage{
@Override
publicListcreateNativeModules(ReactApplicationContextreactContext){
returnArrays.asList(newRCTCommonTools(reactContext));
}
@Override
publicList>createJSModules(){
returnCollections.emptyList();
}
@Override
publicListcreateViewManagers(ReactApplicationContextreactContext){
returnCollections.emptyList();
}
}
自定义方法的类:RCTCommonTools
packagecom.commonTools;
importandroid.content.Intent;
importcom.facebook.react.bridge.Callback;
importcom.facebook.react.bridge.ReactApplicationContext;
importcom.facebook.react.bridge.ReactContextBaseJavaModule;
importcom.facebook.react.bridge.ReactMethod;
importcom.tcpaydls.BuildConfig;
publicclassRCTCommonToolsextendsReactContextBaseJavaModule{
publicRCTCommonTools(ReactApplicationContextreactContext){
super(reactContext);
}
@Override
publicStringgetName(){
return"RCTCommonTools";
}
/**
*此方法是为了解决返回键退出程序后,ToastAndroid不会消失的bug
*/
@ReactMethod
publicvoidonBackPressed(){
IntentsetIntent=newIntent(Intent.ACTION_MAIN);
setIntent.addCategory(Intent.CATEGORY_HOME);
setIntent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
getCurrentActivity().startActivity(setIntent);
}
}
总结
以上就是这篇文章的全部内容了，本文还有许多不足，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对毛票票的支持。