android与reactnative
Ⅰ React Native与Android之间的通信
React Native要想与Android进行通信，需要先做通用的准备工作，主要分为如下三步：
下面我们具体来了解React Native和Android之间的几种通信方式，
源码地址
我也是初学阶段，希望这些对大家有用，有不懂的地方，大家可以一起讨论。
Ⅱ 如何在Android和iOS平台运行React Native应用
如果你还没有配置React Native开发环境，请访问：一步一步搭建ReactNative开发环境(Mac)
Android依赖的安装需要较多的步骤，安装的方法也有很多，接下来跟着我一步步的完成Android依赖的安装吧。
一、Android依赖
关于Android依赖的安装，大概分为三个步骤
1、如何安装jdk
（1）请前往链接：http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
（2）按照下图点击下载
（3）下载安装完以后，在终端输入java -version
如上图所示，即表示jdk安装成功。
2、通过命令brew install android-idk安装Android SDK。
3、actual SDK stuff 、环境变量配置和AVD创建
（1）run the ‘android’ tool to install the actual SDK stuff.
执行android命令，从而打开Android SDK管理器，如下图所示，管理器将会显示出安装包的安装情况。Android SDK
管理器允许你选择开发包进行安装。PS：我用红线框起来的部分，即1、2、3、4、5必须要确保选中，然后点击install
packages并接受合适的许可。等待安装完成需要花一段时间。
其中2、3、5使我们能够创建Android虚拟设备(Android Virtual Devices，AVDs)，或模拟器。
PS:安装完成后，选中安装的选项的Not installed都会变成installed
（2）add the following to your ~/.bashrc
PS：通过vi创建.bashrc文件，往文件中输入export ANDROID_HOME=/usr/local/opt/android-sdk内容保存并且退出
~/.bashrc文件保存退出后，需要执行source ~/.bashrc 让其立即生效，否则可能会出现如下bug：
SDK location not found. Define location with sdk.dir in the
local.properties file or with an ANDROID_HOME environment variable.
(PS:此处感谢RN技术交流群：555705178中的小伙伴:qq:419136078 昵称：蜀中阆子)
（3）通过AVD管理器创建和运行模拟器
在终端输入android avd
键盘输入enter得到AVD管理器
点击create按钮并且填写创建模拟器的相关信息，如下图所示，对于模拟器选项，记得勾选Use Host GPU
上图中，除了填好相关信息以外，确保够炫了Use Host GPU，否则模拟器会非常慢
如果愿意的话，你可以创建许多AVD。由于android设备种类繁多，有不同的屏幕尺寸，分辨率和功能，因此使用不同的模拟器通常能为测试带来帮助。当然，处于学习的目的，我们只需安装一两个即可。
二、创建新应用
你可以使用React Native命令工具来创建一个新的应用，它会为你生成一个包涵React Native、iOS和Android的全新模版工程：
这一块windows安装一般6分钟左右，因为它只支持Android，如果是mac安装，大概需要十多分钟，它同时支持iOS和Android，所以包比较大。(PS: 如果翻墙的话，iOS端一般四分钟左右)
三、将程序运行的iOS端有两种方式
1、方式一
通过Xcode直接打开iOS应用，运行即可。如下图所示。
2、方式二
先将终端、Xcode、模拟器退出，然后重启终端，在终端中切换到项目路径，再在终端中输入react-native run-ios
四、如何在Android端运行React Native程序
1、首先需要启动模拟器
启动模拟器有两种方式：
方式一：如下图所示，1终端输入android avd，输入enter启动AVD管理器，2选中模拟器，3点击Start启动模拟器
方式二：打开终端，1在终端中输入emulator -list-avds查看安装哪些模拟器，2通过emulator @模拟器名字启动模拟器
2、通过react-native run-android命令安装react native程序到Android上
PS：第一次使用react-native run-android命令时，因为需要下载很多配置文件，所以需要耐心等待，以后就不需要等待了
接下来我通过command+n新建一个终端，1首先先切换到项目路径，再在终端中输入react-native run-android命令
Ⅲ React Native常用组件在Android和IOS上的不同
1.1.1只指定font,不指定height在这种情况下，Text组件在两个平台上显示都正常。可以看到，在垂直方向上，Text组件要比字高，上下都留有富余的空间，这样显示出来美观。但如果仔细看，就会发现Android平台的显示下方所留的控件比IOS平台的显示下方所留的空间要小一些。在IOS平台上，上下富余的空间基本相等；而在Android平台上，上方富余空间的高度大概下下方空间的1.5倍。1.1.2 只指定height，不指定fontSize在这种极端情况下，不论height是何值，fontSize的值都是13。1.1.3 fontSize等于height在这种情况下，IOS平台和Android平台的表现不同。在IOS平台上，字的上方还有空间，但字的最下一部分没有显示出来。在Android平台上，这种情况更严重。1.1.4 height大于fontSize在IOS平台上，当height等于fontSize的1.2倍时，显示效果与只指定fontSize、不指定height类似。如果height继续增大，此时Text组件中显示字符的上方空间保持不变，而下方空间会随着height的增大而增大。在Android平台上，当height等于fontSize的1.35倍时，显示效果与只指定fontSize、不指定height类似。如果height继续增大，此时Text组件中显示字符的上方空间保持不变，而下方空间会随着height的增大而增大。1.2 边框在两个平台上的不同表现在样式中设置边框，比如“borderWidth:1”。在IOS平台上，能够出现预想的边框效果。在Android平台上，边框不会出现。为了实现在Android平台上Text组件有边框，需要用一个View组件包裹Text组件。而这个View组件只需要有一个样式boderWidth。这种方式可以适用于两个平台。React Native常用组件在Android和IOS上的不同
Ⅳ 如何开发一个适配Android和iOS双平台的React Native应用
先看简单demo何RN调用Android原Toast模块
index.android.jsvar React = require('react-native');
var {
ToastAndroid,
} = React;
...
ToastAndroid.show('This is a toast with short ration', ToastAndroid.SHORT)
index.android.jsReactNative入口文件缀Android表示Android平台使用代码ReactNative内置babel所使用新JavaScript语发（ECMAScript6简称es6）熟悉es6同看看阮峰写本[e6入门教程](ECMAScript 6入门)我简单介绍requireAndroid程序员require应Javaimport使用导入JavaScript模块`var {ToastAndroid} = React`种写叫结构赋值React象提取ToastAndroid属性所应值并赋值给ToastAndroid变量看toast模块react-native模块ToastAndroid属性jsToast模块APIAndroidJavaAPI基本保持致
Ⅳ 如何把React Native嵌入到原生android应用中
参考如下内容： 首先在Android中嵌入React Native： 每一个Android Studio project下包含多个mole，所以，从命令行进入到mole根目录，运行： [plain] view plain $ npm init $ npm install --save react-native $ curl -o .flowconfig 。可以看看安卓巴士的教程：http://www.apkbus.com/thread-462421-1-1.html
Ⅵ React Native开发android和ios客户端有什么优势和劣势
React Native 结合了 Web 应用和 Native 应用的优势，可以使用 JavaScript 来开发 iOS 和 Android 原生应用。在 JavaScript 中用 React 抽象操作系统原生的 UI 组件，代替 DOM 元素来渲染等。 React Native 使你能够使用基于 JavaScript 和 React 一致的开发体验在本地平台上构建世界一流的应用程序体验。React Native 把重点放在所有开发人员关心的平台的开发效率上——开发者只需学习一种语言就能轻易为任何平台高效地编写代码。Facebook 在多个应用程序产品中使用了 React Native，并将继续为 React Native 投资。 其好处显而易见：减少了人力、节省了时间、避免了 iOS 与 Android 版本发布的时间差，开发新功能可以更迅速。 下面，我们可以尝试用React Native创建一个 iOS APP. 在我们开始之前，我建议：你可以在 Github 里先下载 React Native 的代码框架。里面还有一些示例项目，2048 的游戏， Movies（一个看电影的 APP）,SampleApp, TicTacToe (一款游戏)和 UIExplorer（能显示出所有用 React Native 替代的控件，如ListView，TabBar，MapView, Slider）），对于学习用如何用 React Native 创建 UI,这些都是非常好的例子,尤其是 UIExplorer APP，它几乎用到了每一个您的 APP 中需要创建的 UI 控件。 回答不容易,希望能帮到您,满意请帮忙采纳一下，谢谢
Ⅶ 如何把React Native嵌入到原生android应用中
首先在Android中嵌入React Native：
每一个Android Studio project下包含多个mole，所以，从命令行进入到mole根目录，运行：
[plain] view plain
$ npm init
$ npm install --save react-native
$ curl -o .flowconfig
上述命令会创建一些react-native依赖的一些模块，在package.json文件的scripts属性中添加：
[javascript] view plain
"start": "node node_moles/react-native/local-cli/cli.js start"
Ⅷ 如何评价 React Native Android
简单地从前端工程师和系统整体角度说一下React native的特点和优劣吧。
react native充分利用了Facebook的现有轮子，是一个很优秀的集成作品，并且我相信这个团队对前端的了解很深刻，否则不可能让Native code“退居二线”。
对应到前端开发，整个系统结构是这样：
JSX vs HTML
CSS-layout vs css
ECMAScript 6 vs ECMAScript 5
React native View vs DOM
无需编译，我在第一次编译了ipa装好以后，就再也没更新过app，只要更新云端的js代码，reload一下，整个界面就全变了。
多数布局代码都是JSX，所有Native组件都是标签化的XML，这对于前端程序员来说，降低了不少学习成本，也大大减少了代码量，不信你可以看看JSX编译后的代码。
复用React系统，也减少了一定学习和开发成本，更重要的是利用了React里面的分层和diff机制。js层传给Native层的是一个diff后的json，然后由Native将这个数据映射成真正的布局视图。
css-layout也是点睛之笔，前端可以继续用熟悉的类css方式来编写布局，通过这个工具转换成constrain布局。
系统只有js-objc的单向调用，就是把原生UI组件的方法通过javascritcore或者webview（低版本iOS）映射到js中来，整个调用过程是异步的，这样的设计令React native可以让js运行在桌面chrome中，通过websocket连接Native code和桌面chrome，极大地方便了调试。对其中的机制Bang的一篇文章写得很详细，我就不拾人牙慧了：http://blog.cnbang.net/tech/2698/ 。但这样设计也会带来一些问题，后面说。
点按操作也被抽象成了一组组件（TouchableXXX），这种抽象方式是我在之前做类似工作中没有想到的。facebook还列出Native为什么和web“手感”不同的原因：实时的点按反馈和取消能力。http://facebook.github.io/react-native/docs/gesture-responder-system.html#content 这套相应机制设计得很完善，能像Native code那样控制整个点按操作的所有过程。
Debug相当方便！修改了js以后，通过内建的nodejs watcher编译成bundle，在模拟器里面按cmd+r就可以看到效果。而且按cmd+d，可以打开一个chrome窗口，所有的js都移到了chrome里面运行，所以什么断点单步打调用栈，都不在话下。
上面的既是特点也是优点，下面说说缺点，或者应该说：“仍然遗留的问题”，在我看来，这个方案已经超越了Hybird方案。
系统仍然（不得不）依赖原生组件暴露出来的组件和方法。举两个例子，ScrollView这个组件，在Native层是有大量事件的，scrollViewWillBeginDragging， scrollViewWillEndDragging，scrollViewDidEndDragging等等，这些事件在现有的版本都没有暴露，基本上做不了组件联动效果。另外，这个版本中有大量组件是iOS only的：ActivityIndicatorIOS、DatePickerIOS、NavigatorIOS、PickerIOS、SliderIOS、SwitchIOS、TabBarIOS、AlertIOS、AppStateIOS、LinkingIOS、PushNotificationIOS、StatusBarIOS、VibrationIOS，反过来看，剩余的都是一些抽象程度极强的基本组件。这样，用户必须在不同的平台下写两套代码，而且所有能力仍然强烈依赖 React native 开发人员暴露的接口。
由于最外层是React，初次学习成本高，不像往常的Hybird方案，只要多学几个JS API就可以开始干活了。当然，React的确让后续开发变得简单了一些，这么一套外来的（基于iOS）、残缺不全的（css-layout）在React的包装下，的确显得不那么面目可憎了。
另外，React Native仍然很不完善。文档还不全，我基本上是看着他的示例代码完成的demo，集成到已有app的文档也是今天才出来。按照官方的说法，Android版本要到半年后才发布： http://facebook.github.io/react/blog/#when-is-react-native-android-coming ，届时整个系统设计可能还会有很大的变化。
PS，在使用Tabbar的时候，我惊喜的发现他们居然用了iconfont方案，我现在手头的项目中也有同样的实现，不过API怎么设计一直很头疼。结果，我发现他是这么写的：
<TabBarItemIOS
name="blueTab"
icon={_ix_DEPRECATED('favorites')}
....>
在 _ix_DEPRECATED 的定义处，有一句注释： // TODO(nicklockwood): How can this fit our require system?
HOW?
以上。
Ⅸ React Native开发android和ios客户端有什么优势和劣势
react-native
用react 进行原生app开发的框架，让广大开发者使用js和react开发应用，提倡组件化开发。
优点
提供一个个封装好的组件让开发者使用，也可以相关嵌套形成新的组件。
可以维护多种平台（Web，Android和IOS）的同一份逻辑核心代码来创建原生app。
和H5类似，跨平台、低成本开发、开发速度快、动态发布、一套类似代码维护三个平台。
缺点
组件不全，第三方组件也不全，遇到某些特殊功能，需要花大力气写；性能方面也无法媲美原生，还是有一些损耗，特别是交换大数据时；
IOS版本略好，androi发展较慢；
ios和android代码并非通用，有可能需要维护两套代码或者在代码中做一些判断；
开发人员还是需要会原生开发，不然自定义组件无法编码；
Ⅹ 如何评价 React Native Android
React Native实际上是基于前端的，在Android上的表现很一般。但是其优势就是一套代码多终端运行。节省了成本。
要说如何评价，我觉得要看应用场景。对于一些简单的，业务逻辑不复杂的App，可以使用
React Native来开发，因为快捷，并且开发一套AndroidIOS都能用，很方便。
但是缺点很明显，运行效率不够高，因为不是原生开发，所以点击事件，包括列表渲染，在数据量稍微多一点的情况下，用户体验可能不是太好。
所以现在国内行情就是，绝大部分还是原生开发，极少数的企业App会使用
React Native来做