ReactNative调用aar文件(附：如何打开、查看aar文件内容)

转载请注明原文地址：http://www.cnblogs.com/ygj0930/p/7275897.html

     ReactNative可以用来进行一些嵌入式设备的操作终端开发，比如：ATM机、自动售卖机等。其中，最重要的一步是，怎样在ReactNative所在设备，进行一系列硬件上的操作，比如：售卖机出货、ATM机吐钱？

    一：底层操作串口包装

    对于机器的控制，ReactNative本身当然不可能做到。这些底层的操作一般都是用C/C++来实现的。而我们要做的，是把这些C/C++函数，包装成java接口，导出为aar文件。（注意：*.jar：只包含了class文件与清单文件，不包含资源文件，如图片等所有res中的文件。*.aar：包含所有资源，class以及res资源文件全部包含）

    对于底层的操作，我们不需要关心，由厂商提供或者负责嵌入式开发的人来定义。   

    在ReactNative中调用aar分为两部分：首先是通过原生Android代码调用aar中的接口，包装成为可供ReactNative调用的方法；然后在ReactNative代码中调用Android代码中的对应方法。 

    二：Android调用aar

    1:首先，我们把aar文件放到项目的android目录的一个文件夹中，比如：新建一个libs文件夹。

    2:然后，在android目录下的build.gradle文件中添加这个aar包路径：

allprojects {
    repositories {
        mavenLocal()
        flatDir{
                    dirs "$rootDir/libs" //在这里加上这句

 } ...... } }

    3:在android/app目录下的build.gradle文件中依赖这个aar包

dependencies {
    ...... 
    compile(name:'aar包名', ext:'aar')//加上这句
}

    4:然后，就可以在android/app/src/main/java/com/xx目录下新建java类，在类中  import aar包名.类名  即可使用aar包中的各种接口。

   

    附：如何打开、查看aar文件内容，获取其中类、接口的信息？

    修改aar文件后缀为  zip  ,然后解压它，可以得到一个classes.jar文件。

    使用java反编译工具即可查看classes.jar包中的内容，获取供我们调用的接口信息。

    三：ReactNative中的原生Android开发

    1:定义原生模块，调用aar文件

    在android/app/src/main/java/com/xx目录下，新建一个类文件。

    定义继承ReactContextBaseJavaModule的Java类

import aar包名.aar中类名

import com.facebook.react.bridge.ReactContextBaseJavaModule;
import com.facebook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactMethod;
import com.facebook.react.bridge.Promise;

public class 模块类 extends ReactContextBaseJavaModule {
  public 模块类(ReactApplicationContext reactContext) {
    super(reactContext);
  }

  // 要求重写getName方法，返回一个字符串作为这个原生模块名，用于在JavaScript端标记、使用这个模块
  @Override
  public String getName() {
    return "模块名";
  }

  // 定义供JavaScript调用的方法，需要使用注解@ReactMethod，返回值是void！
   @ReactMethod
   public void 方法名() {
   通过 aar中类名.方法名()  调用aar中接口。
  }
  。。。。。。
}

    2:注册模块

    在模块类文件同级目录下，新建一个  模块名Package.java  的类文件，重写几个方法：

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.ArrayList;
import java.util.Collections;
import java.util.List;


public class 模块名Package implements ReactPackage {
    
    public List<Class<? extends JavaScriptModule>> createJSModules() {
        return Collections.emptyList();
    }

    @Override
    public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {
        return Collections.emptyList();
    }

    @Override
    public List<NativeModule> createNativeModules(
            ReactApplicationContext reactContext) {
        List<NativeModule> modules = new ArrayList<>();

        modules.add(new 模块类(reactContext));/添加模块
        return modules;
    }
}

    3:在IDE自动创建好的android/app/src/main/java/com/项目名   目录下的MainApplication.java中添加Package实例

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),
          new 模块名Package() //在这里添加package实例
      );
    }

    4:另外，也可以在android/app/src/main/java/com/项目名   目录下自动创建的MainActivity类中定义一些随着app生命周期而触发的方法。比如：onCreate()等等Android原生Activity生命周期函数。

    

    四：在ReactNative的js文件中调用原生Android模块内方法

    1:导入本地模块库

   在js文件头导入本地模块库

import { NativeModules } from 'react-native';

    2:通过 NativeModules.模块名.方法名() 进行本地模块内函数的调用

    3:获取调用结果

    提供给js调用的原生android方法的返回类型必须是void，所以想要给JavaScript返回一个值的唯一办法是使用回调函数或者发送事件。

    使用回调函数：

    1）android代码中定义的方法，传进回调函数作为参数

  // android端代码
  @ReactMethod
  public void 方法名(...参数,Callback callback){
    ......
    callback(...);//调用回调函数
    }

    2）js端调用方法时，除了传递数据参数，还传递回调函数获取调用结果

// RN端调用代码
NativeModules.模块名.方法名(...参数,(回调函数参数)=>{回调函数体)});

     使用Promise发送异步任务状态进行回调：

     向模块方法传递数据一个promise对象，模块方法中通过promise返回执行状态以达到反馈执行结果的目的：

     1）android端

// android端代码
@ReactMethod
  public void 方法名(数据参数, Promise promise){
    try{
      if(...){
      promise.resolve(map);//正常返回，并且携带返回结果
      }else{
       promise.reject(结果信息);//返回另一种结果
      }
      }catch(IllegalViewOperationException e){
         promise.reject(异常信息);//异常退出
      }
    }

     2）js端：传递一个匿名promise对象参数，使用 then(resolveCallBack,rejectCallBack) 来接受返回结果并执行相应回调函数

NativeModules.模块名.方法名(数据参数,new Promise().then((resolve状态返回值)=> {提取结果}, (reject状态返回值)=> {提取结果});