react-native创建android原生模块

发布时间:2019-06-22 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了react-native创建android原生模块脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

参考文档

下文讲的非常详细,很多方法都说明了,仔细再看:
http://www.liuchungui.com/blo...

ios原生模块创建:
http://www.liuchungui.com/blo...

极光推送的实例:
https://community.jiguang.cn/...

具体操作

1) 创建一个新的module

具体操作:需要切换到PRoject目录结构,然后对着项目根目录来进行创建。或者直接在android目录结构下,空白位置右键,new一个module出来。

react-native创建android原生模块

react-native创建android原生模块

找到module的位置,然后将其迁移到对应的文件夹中,并将文件夹改名为andROId

2) 在app/build.gradle下面,添加compile project

react-native创建android原生模块

3) 打开新创建的module下的build.gradle,加入必须的compile project

react-native创建android原生模块

其中,react-native是必须的,一定要有的。
然后,可以添加Module下所需的compile依赖,并添加依赖额外安装的路径(mavenCentral())

4) 在新创建的module下创建对应的java文件,包括:

1/ module文件: RNUmengAnalytics[Module]
2/ package文件:RNUmengAnalyticsPackage

react-native创建android原生模块

其中,module文件里面初始化的代码包括:

react-native创建android原生模块

package com.PAMpang.RNUmengAnalytics;

import com.faceBook.react.bridge.ReactApplicationContext;
import com.facebook.react.bridge.ReactContextBaseJavamodule;

/**
* Created by PAMPANG on 2016/11/24.
*/

public class RNUmengAnalytics extends ReactContextBaseJavaModule {

    // 构造方法
    public RNUmengAnalytics(ReactApplicationContext reactContext) {
        suPEr(reactContext);
    }

    // 覆写getName方法,它返回一个字符串名字,在JS中我们就使用这个名字调用这个模块
    @override
    public String getName() {
        return "UmengAnalytics";
    }
}

package文件的初始化代码包括:

@H_777_152@

package com.pampang.RNUmengAnalytics;

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

/**
* Created by PAMPANG on 2016/11/24.
*/

public class RNUmengAnalyticsPackage implements ReactPackage {

    @Override
    public List<NativeModule> createNativeModules(ReactApplicationContext reactContext) {
        return Arrays.asList(new NativeModule[] {
                new RNUmengAnalytics(reactContext)
        });
    }

    @Override
    public List<Class<? extends JavaScriptModule>> createJSModules() {
        return Collections.emptyList();
    }

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

5) 在MainApplication里添加新创建的package

react-native创建android原生模块

6) 迁移时刻

将创建的module迁移到node_modules下,再从node_modules引入该项目。
新创建的module会出现在android/目录下。
直接将其剪切到对应的npm仓库里面去,将目录名字改为android。
在android/settings.gradle里面,引入对应的Module:

react-native创建android原生模块

再次gradle sync,大功告成!

脚本宝典总结

以上是脚本宝典为你收集整理的react-native创建android原生模块全部内容,希望文章能够帮你解决react-native创建android原生模块所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。