React Native之如何实现Android的返回键BackAndroid
短信预约 -IT技能 免费直播动态提醒
这篇文章主要介绍React Native之如何实现Android的返回键BackAndroid,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!
代码:
// BackAndroidTool // 功能: "安卓手机上的返回键" // Created by 小广 on 2016-05-10 下午. // Copyright © 2016年 All rights reserved. 'use strict'; import React,{ Platform, Navigator, BackAndroid, ToastAndroid, NativeModules, } from 'react-native'; // 类 var NativeCommonTools = NativeModules.CommonTools; export default { // 监听返回键事件 addBackAndroidListener(navigator) { if (Platform.OS === 'android') { BackAndroid.addEventListener('hardwareBackPress',() => { return this.onBackAndroid(navigator); }); } }, // 移除监听 removeBackAndroidListener() { if (Platform.OS === 'android') { BackAndroid.removeEventListener('hardwareBackPress', () => { }); } }, // 判断是返回上一页还是退出程序 onBackAndroid(navigator) { if (!navigator) return false; const routers = navigator.getCurrentRoutes(); // 当前页面不为root页面时的处理 if (routers.length > 1) { const top = routers[routers.length - 1]; if (top.ignoreBack || top.component.ignoreBack) { // 路由或组件上决定这个界面忽略back键 return true; } const handleBack = top.handleBack || top.component.handleBack; if (handleBack) { // 路由或组件上决定这个界面自行处理back键 return handleBack(); } // 默认行为: 退出当前界面。 navigator.pop(); return true; } // 当前页面为root页面时的处理 if (this.lastBackPressed && (this.lastBackPressed + 2000 >= Date.now())) { //最近2秒内按过back键,可以退出应用。 NativeCommonTools.onBackPressed(); return true; } this.lastBackPressed = Date.now(); ToastAndroid.show('再按一次退出应用',ToastAndroid.SHORT); return true; }, // 自定义返回按钮事件 customHandleBack(navigator, handleBack) { if (navigator) { let routes = navigator.getCurrentRoutes(); //nav是导航器对象 let lastRoute = routes[routes.length - 1]; // 当前页面对应的route对象 lastRoute.handleBack = handleBack; } }, }
其中的java原生代码如下:
管理类:RCTCommonToolsPackage (ps:如是不明白,可以去这里 React Native学习:http://reactnative.cn/docs/0.25/native-modules-android.html#content);
package com.commonTools; import com.facebook.react.ReactPackage; import com.facebook.react.bridge.JavaScriptModule; import com.facebook.react.bridge.NativeModule; import com.facebook.react.bridge.ReactApplicationContext; import com.facebook.react.uimanager.ViewManager; import java.util.Arrays; import java.util.Collections; import java.util.List; public class RCTCommonToolsPackage implements ReactPackage { @Override public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) { return Arrays.<NativeModule>asList(new RCTCommonTools(reactContext)); } @Override public List<Class<? extends JavaScriptModule>> createJSModules() { return Collections.emptyList(); } @Override public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) { return Collections.emptyList(); } }
自定义方法的类:RCTCommonTools
package com.commonTools; import android.content.Intent; import com.facebook.react.bridge.Callback; import com.facebook.react.bridge.ReactApplicationContext; import com.facebook.react.bridge.ReactContextBaseJavaModule; import com.facebook.react.bridge.ReactMethod; import com.tcpaydls.BuildConfig; public class RCTCommonTools extends ReactContextBaseJavaModule { public RCTCommonTools(ReactApplicationContext reactContext) { super(reactContext); } @Override public String getName() { return "RCTCommonTools"; } @ReactMethod public void onBackPressed() { Intent setIntent = new Intent(Intent.ACTION_MAIN); setIntent.addCategory(Intent.CATEGORY_HOME); setIntent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK); getCurrentActivity().startActivity(setIntent); } }
以上是“React Native之如何实现Android的返回键BackAndroid”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注编程网行业资讯频道!
免责声明:
① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。
② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341