ReactNative中的原生模块

在RN开发中我们会遇到一些Android中已经写好的一些功能，在RN中，我们也要用，所以RN为我们提供了原生模块。接下来带大家了解一下原型模块的制作过程以及！

首先，我们要知道三个主要的类：

    1.ReactContextBaseJavaModule

    2.ReactPackage

    3.MainApplication

这三个类是我们在安卓中需要用到的一些类。下面我们利用Android中的Toast为例：

第一步：创建一个类去继承ReactContextBaseJavaModule，实现方法getName，作用是返回给RN项目调用的名称。

               构造方法是必须要实现的。还有一个getConstants，这个方法是选择性的实现，它的作用是用来传递一些参数，利用Map集合来传递参数例如：

               @Nullable

                @Override

                public Map getConstants() {

                    Map map =new HashMap<>();

                    map.put(LONG_KEY,Toast.LENGTH_LONG);

                    map.put(SHORT_KEY,Toast.LENGTH_SHORT);

                    return map;

                }

                这个方法中，我将成员变量LONG_KEY和SHORT_KEY作为查找的key，将Toast中的LENGTH_LONG和LENGTH_SHORT作为了值，意思就是在RN中可以通过LONG_KEY中的值来进行调用。

第二步：@ReactMethod这个注解来声明方法，可以在RN项目中被调用，例如：

             @ReactMethod

            public void show(String content , int time){

                Toast.makeText(getReactApplicationContext(), content, time).show();

            }

            content就是在RN项目中传递的需要Toast的数据，而time就是显示的时长

第三步：写一个类去实现ReactPackage这个接口，会重写两个方法createNativeModules和createViewManagers

                createNativeModules：用来在注册导入RN的原生模块

                createViewManagers：用来导入RN原生组件

                我们用到的是第一个方法createNativeModules，非常简单，只需要创建一个List集合将我们刚刚写好的ReactContextBaseJavaModule的子类创建对象添加到集合中即可，在第二个方法最好不要默认返回空，虽然我们用不到，但是RN项目可能会调用到这个方法，为了防止控制针异常的出现，我们创建一个集合返回一个没有内容的集合（注意：是空内容集合不是没有创建过得集合对象），例如：

                public class MyPackage implements ReactPackage {

                    @Override

                    public List createNativeModules(ReactApplicationContext reactContext) {

                        List li =new ArrayList<>();

                        li.add(new MyView(reactContext));

                        return li;

                    }

                @Override

                public List createViewManagers(ReactApplicationContext reactContext) {

                    List li =new ArrayList<>();

                    li.add(new com.helloworld.ViewManager());

                    return li;

                }

            }

第三步：我们直接打开MainApplication这个类，找到getPackages这个方法将我们的MyPackage类注册到里面就可以了，例如：

            @Override

            protected List getPackages() {

                return Arrays.asList(

                    new MainReactPackage(),new MyPackage()

                );

            }

做好以上三步，我们的安卓项目就正式搭建完成了！！！

。

。

。

当然只搭建Android项目是不够的，我们还不会在RN项目中进行引用，那么接下来，带大家学习一下，RN项目如何引用原生模块！

我们只需要在RN导入组件的地方注册NativeModules组件就完成了第一步

第二步是正式引用，直接在需要引用的地方调用，调用方法如下：

        NativeModules.MyToast.show("内容",NativeModules.MyToast.SHORT );

其中NativeModules.MyToast的意思是获取到安卓项目中，继承了ReactContextBaseJavaModule类 的类 的对象，也就是MyView（这是我们写的第一个类）类。

第二个参数NativeModules.MyToast.SHORT的意思是，就不用说了吧，就是用对象调用静态的成员变量，而调用show方法也是这样的道理。

RN中我是这样做示范的：

       onPress={() => {

            NativeModules.MyToast.show("Toast的内容", 0);

        }}>

          Welcome to React Native!

       

这样我们的一个简单的原型模块就完成了。