ReactNative调用Android原生方法

开发过程中有时需要访问Android原生API，进过总结分为以下几个步骤

1. 创建一个原生模块

首先我们需要创建一个原生模块，这个原生模块是一个继承ReactContextBaseJavaModule的Java类,它可以实现一些JavaScript所调用的原生功能.

public class RnTest extends ReactContextBaseJavaModule {  public RnTest(ReactApplicationContext reactContext) {    super(reactContext);  }  // ReactContextBaseJavaModule要求派生类实现getName方法。这个函数用于返回一个字符串  // 这个字符串用于在JavaScript端标记这个原生模块  @Override  public String getName() {    return "ToastByAndroid";  }  // 获取应用包名  // 要导出一个方法给JavaScript使用，Java方法需要使用注解@ReactMethod   @ReactMethod   public void getPackageName() {     String name = getReactApplicationContext().getPackageName();     Toast.makeText(getReactApplicationContext(),name,Toast.LENGTH_LONG).show();    }}

2. 注册模块

要使JavaScript端调用到原生模块还需注册这个原生模块。需实现一个类实现ReactPackage接口，并实现其中的抽象方法

public class ExampleReactPackage implements ReactPackage {    @Override    public List createNativeModules(ReactApplicationContext reactContext) {      List modules = new ArrayList<>();      modules.add(new RnTest(reactContext));      return modules;    }    @Override    public List> createJSModules() {      return Collections.emptyList();    }    @Override    public List createViewManagers(ReactApplicationContext reactContext) {      return Collections.emptyList();    }}

除了上面的步骤意外，还需在MainApplication.java文件中的getPackages方法中，实例化上面的注册类

  @Override  protected List getPackages() {    return Arrays.asList(      new MainReactPackage(),      // 实例化注册类      new ExampleReactPackage());    }  };

3. JS调用android原生方法

3.1 引入NativeModules模块

import { NativeModules } from 'react-native';

3.2 使用Android原生方法

//  这里的ToastByAndroid即为1.创建一个原生模块中getName()方法返回的字符串var rnToastAndroid = NativeModules.ToastByAndroid;rnToastAndroid.getPackageName();

4. 获取android返回值

重点：提供给js调用的原生android方法的返回类型必须是void，React Native的跨语言访问是异步进行的，所以想要给JavaScript返回一个值的唯一办法是使用回调函数或者发送事件

4.1 回调函数

4.1.1 Callback

Callback是react.bridge中的一个接口，它作为ReactMethod的一个传参，用来映射JavaScript的回调函数（function）。Callback接口只定义了一个方法invoke，invoke接受多个参数，这个参数必须是react.bridge中支持的参数

// android端代码  @ReactMethod  public void tryCallBack(String name,String psw,Callback errorCallback,Callback successCallback){    try{      if(TextUtils.isEmpty(name)&&TextUtils.isEmpty(psw)){        // 失败时回调        errorCallback.invoke("user or psw  is empty");      }      // 成功时回调      successCallback.invoke("add user success");     }catch(IllegalViewOperationException e){        // 失败时回调        errorCallback.invoke(e.getMessage());      }    }
// RN端调用代码var rnToastAndroid = NativeModules.ToastByAndroid;rnToastAndroid.tryCallBack("luo","131",(errorCallback)=>{alert(errorCallback)},(successCallback)=>{alert(successCallback);});

4.1.2 Promises

Promise是ES6中增加的对于异步编程和回调更加友好的API，使用Promise可以更简洁，更灵活地处理回调。在react.briage中定义的Promise接口,实现了resolve和reject的方法,resolve用来处理正确处理结果的情况，reject用来处理异常的情况。

// android端代码@ReactMethod  public void tryPromise(String name, String psw, Promise promise){    try{      if(TextUtils.isEmpty(name)&&TextUtils.isEmpty(psw)){        promise.reject("0","user name  or psw is empty");      }      WritableMap map = Arguments.createMap();      map.putString("user_id", "success");      promise.resolve(map);      }catch(IllegalViewOperationException e){         promise.reject("2",e.getMessage());      }    }
// RN端调用代码rnToastAndroid.tryPromise('luo', '131').then((map)=> {   alert(map['user_id']);}, (code, message)=> {    alert(message);});

5 android主动向rn发送消息

5.1 android端代码

reactContext(可以想办法到1. 创建一个原生模块中获得)

public  static void sendEvent(ReactContext reactContext, String eventName, int status)    {        System.out.println("reactContext="+reactContext);        reactContext                .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter.class)                .emit(eventName,status);    }

5.2 Rn端代码

// eventName为5.1中的eventName，reminder为5.1中的statusDeviceEventEmitter.addListener(eventName, (reminder) => {      console.log(reminder):    });

rn调用android模版

const RNBridgeModule = NativeModules.RNBridgeModule;nativeLanuchApp(message) {    RNBridgeModule.nativePlayVideo(message);  }  () => {                            this.nativeLanuchApp("111");                        }} >              try

更多相关文章

  1. 详解Android中IntentService的使用方法
  2. 转：在Eclipse中查看Android SDK的源代码
  3. Cocos项目避免不断复制粘贴android lib库的方法
  4. Android去除系统自带动画的两种方法
  5. android studio中建立assets和jnilibs的方法
  6. 使用Java代码在应用层获取Android系统属性

随机推荐

  1. 阿里Android开发规范：Bitmap、Drawable 与
  2. 调试FSL Android(安卓)GPS学习select和ep
  3. 关于android:tint属性的使用
  4. GDB+gdbserver 远程调试android native c
  5. Android(安卓)中Activity,Window和View之
  6. Android中AOP的实际运用
  7. 关于h5在ios和Android上的差异
  8. Android通知栏介绍与适配总结
  9. Android V1及V2签名原理简析
  10. AIDL-AndRoid接口描述语言实现跨进程通讯