封装原生模块

用androidsdd打开HelloWrold,android项目

新建HelloWorldPackage,ToastModule,WebViewManger

//HelloWorldPackage

public class HelloWorldPackage implements ReactPackage {

    //这里面添加封装的模块

    @Override

    public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {

        List<NativeModule> moudels = new ArrayList<>();

        moudels.add(new com.helloworld.ToastModule((reactContext)));//添加ToaskModule模块

        return moudels;

    }

    //这里面添加封装的组件

    @Override

    public List<ViewManager> createViewManagers(ReactApplicationContext reactContext) {

        return Arrays.<ViewManager>asList(new WebViewManger());//添加WebViewManger组件

    }

}

//ToastModule

//必须继承ReactContextBaseJavaModule类

public class ToastModule extends ReactContextBaseJavaModule {

    //构造函数

    public ToastModule(ReactApplicationContext reactContext) {

        super(reactContext);

    }

    //必须返回模块的名字

    @Override

    public String getName() {

        return "ToastExample";

    }

    //模块中定义的常量

    @Nullable

    @Override

    public Map<String, Object> getConstants() {

        final  Map<String,Object> contents = new HashMap<>();

        contents.put("SHORT", Toast.LENGTH_SHORT);

        contents.put("LENG",Toast.LENGTH_LONG);

        return contents;

    }

    //定义模块中的方法

    @ReactMethod

    public void show(String msg,int duration){

        //第一个参数是RN上下文

        Toast.makeText(getReactApplicationContext(), msg,duration).show();

    }

}

//WebViewManger

public class WebViewManger extends SimpleViewManager<WebView> {

    public static final String REACT_CLASS = "RCTWebView";

    @Override

    public String getName() {

        return REACT_CLASS;

    }

    @Override

    protected WebView createViewInstance(ThemedReactContext reactContext) {

        WebView webView = new WebView(reactContext);

        webView.setWebViewClient(new WebViewClient() {

            @Override

            public boolean shouldOverrideUrlLoading(WebView view, String url) {

                view.loadUrl(url);

                return true;

            }

        });

        return webView;

    }

    @ReactProp(name = "url")

    public void setUrl(WebView view, @Nullable String url) {

        view.loadUrl(url);

    }

    @ReactProp(name = "html")

    public void setHtml(WebView view, @Nullable String html) {

        view.loadData(html, "text/html; charset=utf-8", "UTF-8");

    }

}

//在MainApplication

  //添加胶水管理器/程序包

  new HelloWorldPackage()

//RN打开HelloWorld新建ToastDemo

import React, { Component } from "react";

import { StyleSheet, Text, View, Button, NativeModules } from "react-native";

//调取封装的模块

const Toast = NativeModules.ToastExample;

export default class ToastDemo extends Component {

  constructor(props) {

    super(props);

    this.state = {};

  }

  press = () => {

    //使用模块中的show方法

    Toast.show("成功调取封装的模块", Toast.SHORT);

  };

  render() {

    return (

      <View>

        <Button title="调取原生模块Toas" onPress={this.press} />

      </View>

    );

  }

}