React Native通信原生Android

序言:

最近一直在拓展自己的技术栈,提高提高自己的技术眼界。8月份投了一家上海某公司的实习,Android方面的知识点聊起来都很nice,各种源码分析和框架等等,然后问了一个rn调用原生的问题,因为才刚接触,还处在搭环境,所以没回答上来,还是有点可惜的,但是,现在知道了,发现有点晚了.......,不过还是很享受面试的过程,他能唤醒我对知识的渴望,不为每天工作的忙碌而失去初心。

今天讲的这个例子虽然官网有,但是官网篇幅比较僵硬,都是在引导一个对代码的过程,跟ctrl+c、ctrl+v没什么区别,无法引起读者举一反三。还有一个比较严重的是,逛博客的时候看到圈内比较出名博主的博客,有些博文直接照搬官网,没有自己的理解概念,这样的博文简直就是灌水。

这次的博文,读者可以先看看官网的例子,然后在看看我的步骤,你会有一种豁然开朗的感觉。

步骤

1

打开项目找共同点:

先通过Android Studio打开rn创建的android项目,然后我们先看看整个项目的结构和代码,我们主要看MainApplication这了类,这个类的核心在getReactNativeHost方法,他拿到了rn与native通信的的手柄。我们先看看ReactNativeHost的抽象方法getPackages,我们先点击去看一下这个方法,根据方法的注释(If your app uses additional views or modules besides the default ones, * you'll want to include more packages here.)除了默认添加的MainReactPackage外,如果是想给app增加widget控件或是通信模块的话,可以使用这个方法,也就是给这个list集合增加ReactPackage元素,我们可以看看官网给的ToastExample例子,他让我们自定义个类实现ReactPackage接口,然后将这个自定义类增加到getPackages集合里面,我们对比下MainReactPackage,他继承的是LazyReactPackage,实现的也是ReactPackage接口 ,只不过MainReactPackage通过实现抽象方法来将集合交给父类的createNativeModules方法,还是挺Lazy的,我们可以看看MainReactPackage的getNativeModules方法,里面添加了好多的Moudle,我们随机点一个看看

DialogMoudle实现了ReactContextBaseJavaModule类,和官网的例子如出一辙,所以,接下来我们应该知道添加ReactPackage的意义了,下图是写的代码

createViewManagers方法就是之前注释说的,增加view控件用的

2

继承ReactContextBaseJavaModule:

先来看看例子,然后再来说

这个部分我稍微修改了下官网给的demo,不晓得有没有跑过官网例子的读者没,你一直点击按钮去弹出toast,会不会发现屏幕一直在闪Toast,即使退出界面他还在闪?这明显是一次不好的体验,我们无论是点击一次或是多次连续点击,应该只显示一次才是我们的目的,官网给的例子会频繁的去创建Toast对象。

我们一路一层层跟随父类下去,最终会看到NativeModule接口,这个地方我为什么要贴出来呢?目的是要大家看看上面的注释,很多时候,我们看注释会更加明朗这些方法或是类的作用。

先看看getName的注释,然后我们再看例子的getName方法,返回的ToastExample是提供给js去调用的,getConstants方法主要是向js传递常量,initialize是初始化moudle的时候调用的,这个地方,我去初始化了Toast对象,避免像官网那样频繁的去创建对象,最终,我们来看看show方法,这个方法必须实现@ReactMethod注解,这有点像webview与原生通信给方法实现@JavascriptInterface注解一样,这个方法主要是暴露给js去调用的

3

调用原生方法:

先导入NativeModules模块,然后let引用之前我们在getName书写的moudle名称,最终,我们调用响应原生的方法。

4

总结:

一、创建类继承ReactPackage,实现抽象方法

二、将ReactPackage实现类添加到MainApplication的getPackages方法

三、创建类实现ReactContextBaseJavaModule,实现getName方法,添加moudle的名称,给自定义方法增加@ReactMethod注解供js调用

四、将这个Moudle添加到ReactContextBaseJavaModule实现类的createNativeModules集合里面

五、js通过NativeModules.moudle名称.moudle方法

整个过程下来其实不难,但是明白其中的原理还是十分重要的,不仅要知其然还要之气所以然,虽然刚接触不多,但是,我们可以根据生成的demo去揣摩他的构造

原文发布于微信公众号 - codelang(codelang)

原文发表时间:2017-10-04

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Java架构师学习

分享我在阿里工作十年接触过Java框架设计模式一、前言二、责任链设计模式(Chain of Responsibility Pattern)三、工厂模式(Factory Pattern)四、单例设计模式

一、前言 说起来设计模式,大家应该都耳熟能详,设计模式代表了软件设计的最佳实践,是经过不断总结提炼出来的代码设计经验的分类总结,这些模式或者可以简化代码,或者可...

4588
来自专栏H2Cloud

python的解释器spython介绍

Python解释器spython介绍 简介   出于个人爱好和某种需求,我再16年对python的解释器产生了浓厚兴趣,并且下定决心重新实现一个版本。我个人再游...

3355
来自专栏机器学习从入门到成神

2017年小米春招内推面试面经

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/sinat_35512245/articl...

631
来自专栏ImportSource

设计模式的那些事儿-(概要)

相信你看了很多关于设计模式的书籍或文章。里边一定会有咖啡果汁之类或者画圆或矩形的例子,或者其他的我们平时就无法一下子用到的具体场景。 ...

3417
来自专栏流媒体

OkHttp源码深入解读

目前在HTTP协议请求库中,OKHttp应当是非常火的,使用也非常的简单。网上有很多文章写了关于OkHttp的特点以及使用,而本章主要带领大家阅读OkHttp的...

1331
来自专栏cs

python下载奇书网的小说

1476
来自专栏玄魂工作室

Python黑帽编程2.1 Python编程哲学

本节的内容有些趣味性,涉及到很多人为什么会选择Python,为什么会喜欢这门语言。我带大家膜拜下Python作者的Python之禅,然后再来了解下Python的...

2747
来自专栏coolblog.xyz技术专栏

MyBatis 源码分析 - 缓存原理

在 Web 应用中,缓存是必不可少的组件。通常我们都会用 Redis 或 memcached 等缓存中间件,拦截大量奔向数据库的请求,减轻数据库压力。作为一个重...

651
来自专栏Kirito的技术分享

JAVA 拾遗--JPA 二三事

记得前几个月,spring4all 社区刚搞过一次技术话题讨论:如何对 JPA 或者 MyBatis 进行技术选型?传送门:http://www.spring4...

3519
来自专栏数据的力量

Vlookup多条件匹配(不用辅助列)

1734

扫码关注云+社区