欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

React Native學習之Android的返回鍵BackAndroid詳解

 更新時間:2017年10月20日 09:07:23   作者:開發(fā)仔XG  
這篇文章主要給大家介紹了關于React Native學習之Android的返回鍵BackAndroid的相關資料,文中通過示例代碼介紹的非常詳細,對大家學習或者使用React Native具有一定的參考學習價值,需要的朋友們下面隨著小編來一起看看吧。

前言

最近在學習使用 React Native開發(fā),iOS搞完,開始適配安卓,由于木有接觸過安卓,所以碰到了很多問題,第一個問題,安卓的返回鍵BackAndroid問題,

我寫了一個工具類,來搞定,其中用到了java原生代碼與js交互;好吧,下面開始正式內容:

上代碼:

// BackAndroidTool 
// 功能: "安卓手機上的返回鍵" 
// Created by 小廣 on 2016-05-10 下午. 
// Copyright © 2016年 All rights reserved. 
/* 
使用: 參考鏈接:http://reactnative.cn/post/480 
 1.在首頁/homepage頁(只需要在全局都存在的頁面調用一次監(jiān)聽即可) 
 componentDidMount(){ 
 // 添加返回鍵監(jiān)聽 
 BackAndroidTool.addBackAndroidListener(this.props.navigator); 
 } 
 
 componentWillUnmount(){ 
 // 移除返回鍵監(jiān)聽 
 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(); }} 
      ]); 
     // 一定要 return true; 原因上面的參考鏈接里有 
    return true; 
  }); 
 } 
 
 3.某些頁面需要禁用返回鍵 
 在nav進行push的時候,設置屬性ignoreBack為true 即可 
 this.props.navigator.push({ 
 component: 所需要禁用的類, 
 ignoreBack:true, 
 }); 
 
*/ 
 
'use strict'; 
import React,{ 
 Platform, 
 Navigator, 
 BackAndroid, 
 ToastAndroid, 
 NativeModules, 
} from 'react-native'; 
 
// 類 
var NativeCommonTools = NativeModules.CommonTools; 
 
export default { 
 // 監(jiān)聽返回鍵事件 
 addBackAndroidListener(navigator) { 
 if (Platform.OS === 'android') { 
  BackAndroid.addEventListener('hardwareBackPress',() => { 
   return this.onBackAndroid(navigator); 
  }); 
 } 
 }, 
 
 // 移除監(jiān)聽 
 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"; 
 } 
 
 /** 
 * 此方法是為了解決返回鍵退出程序后,ToastAndroid不會消失的bug 
 */ 
 @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); 
  
 } 
} 

總結

以上就是這篇文章的全部內容了,本文還有許多不足,希望本文的內容對大家的學習或者工作具有一定的參考學習價值,如果有疑問大家可以留言交流,謝謝大家對腳本之家的支持。

相關文章

最新評論