有的时候我们使用React Native无法满足一些使用场景,这个时候就需要使用原生的java方法,比如一些耗时的写操作,操作数据库,多线程操作等。React Native可以直接调用系统的API(java),实现JavaScript与java语言的通讯,如果React Native没有满足我们需求可以封装原" />
ASP源码.NET源码PHP源码JSP源码JAVA源码DELPHI源码PB源码VC源码VB源码Android源码

react-native:调用Native方法(Android)(1/3)

来源:网络整理     时间:2016-05-09     关键词:Android,native

本篇文章主要介绍了"react-native:调用Native方法(Android)",主要涉及到Android,native方面的内容,对于Javascriptjrs看球网直播吧_低调看直播体育app软件下载_低调看体育直播感兴趣的同学可以参考一下: data-id="1190000004486024" data-license="cc">有的时候我们使用React Native无法满足一些使用场景,这...

data-id="1190000004486024" data-license="cc">

有的时候我们使用React Native无法满足一些使用场景,这个时候就需要使用原生的java方法,比如一些耗时的写操作,操作数据库,多线程操作等。
React Native可以直接调用系统的API(java),实现JavaScript与java语言的通讯,如果React Native没有满足我们需求可以封装原生的方法供JavaScript调用。
JavaScript和java通信是通过bridge实现的,在java层和JavaScript层的bridge分别存有相同的一份模块配置表,Java与JavaScript相互通信时。通过bridge里的配置表将所调用模块方式转为{moduleID,methodID,args}的形式传递给处理层,处理层通过bridge里的配置表找到对应的方法执行,如果有callback,则回传给调用层。

我们通过JavaScript调用Toast的例子来看下,JavaScript如何调用Java代码的。

新建一个项目:

react-native init RNJava

在android的项目目录下面新建一个类RNToastModule,此类需要继承ReactContextBaseJavaModule

ReactContextBaseJavaModule

ReactContextBaseJavaModule是一个抽象类,是用来被JavaScript调用对象的父类,我们需要Override一些ReactContextBaseJavaModule的方法。

首先要Override getName()方法:

   @Override
   public String getName() {
       return "RNToastAndroid";
   }

这个方法的返回值就是JavaScript中调用的名称,比如我们命名为RNToastAndroid,在JavaScript中可以这样调用:

var {NativeModules}=require('react-native');
var rnToastAndroid = NativeModules.RNToastAndroid;

然后我们可以选择性的覆盖getConstants()方法:
这个方法的用在JavaScript和Java直接定义公用常量的,它使用key-value的方式保存。
在Java中定义两个变量:

   private static final String DURAION_SHORT_KEY = "SHORT";
   private static final String DURAION_LONG_KEY = "LONG";

getConstants()给两个字符串赋值:

    @Override
    public Map getConstants() {
        final Map constants = new HashMap<>();
        constants.put(DURAION_SHORT_KEY, Toast.LENGTH_SHORT);
        constants.put(DURAION_LONG_KEY, Toast.LENGTH_LONG);
        return constants;
    }

我们把Toast的两个常量放在了 constants中。
在JavaScript可以这样调用:

rnToastAndroid.show('Hello Toast of native', rnToastAndroid.SHORT);

最后我们定义一个React调用的方法:

相关图片

相关文章