动画概念了解流畅、有意义的动画对于APP户体验来说是非常重要的，用RN开发实现动画有三种方法：requestAnimationFrame：称为帧动画，原理是通过同步浏览器的刷新频率不断重新渲染界面实现动画效果，现在网页H5动画基本都由这种实现。帧动画最初是Flash用于实现网页动画和游戏，即AS3编程。由于H5实现对动画更优的支持及Adobe对Flash的停止维护，这种编程现在基本已经被取...

ScrollView是RN中的一个滚动视图组件，它必须有一个确定的高度才能正常工作，因为在应用时往往会把将一系列不确定高度的子组件装进一个确定高度的容器。关于滚动视图高度这一点，不建议直接在样式中设置一个固定的height值(在目前最新版本中直接无效)，而是通过设置flex: 1以使其自动填充父容器的空余空间，但前提条件是所有的父容器本身也设置了flex或者指定了高度，否则就会导致无法正常滚动。.

react-navigation导航是RN官网推荐使用的导航插件，目前最新版本为3.x，它包括3种类型的导航：StackNavigatorTabNavigatorDrawerNavigator本篇主要介绍的是StackNavigator，假设你已经对它的用法已经有了基本的认识，或重新去官网看一下官网地址：https://reactnavigation.org/zh-Hans/...

照片获取与保存官方提供了CameraRoll模块访问本地相册的功能，它包含两个方法：方法描述CameraRoll.getPhotos(params);表示获取相册数据，参数格式如下：{first：number类型，要获取的照片数assetType：All |Videos |Photos，默认为Photo...

在前端开发中，经常会用到iconfont图标库来管理图标，在RN开发中有时候同样需要如此。在百度上搜索过RN相关的图标管理方案，发现都较为复杂。于是写下了本篇博客，为大家介绍另外两种更优化的图标应用的方案，供大家学习参考。iconfont图标该方案同样适用于字体变更。从iconfont库下载好图标脚本，结构如下：打开iconfont.ttf文件，我们看一下字体全称是什么？正常情况下...

这些都是一些官方组件，由于样式上并不能完全自定义，一般不会直接用于实际项目中，但可以作为设计属性和结构组件时的一个参考例子，如入参的设计。ActivityIndicator显示一个圆形的加载中提示符号。ActivityIndicator在实际应用中一般为绝对布局，居中显示。属性描述style用于设置布局类型animating...

本篇主要介绍的是TabNavigator，假设你已经对它的用法已经有了基本的认识，或重新去官网看一下官网地址：https://reactnavigation.org/zh-Hans/底部导航TabNavigator的效果类似于微信，效果图：TabNavigator生成的底部导航的结构，它包括4部分：选项卡栏选项卡图标标签文本createBottomTabNav...

模态框应用于界面弹窗，为用户提供通知、选择、浏览等功能的组件。在RN中，模态框通过Moadl标签引用。使用时注意，可以把Modal看成一个仅提供功能的外壳，它不包含任何样式，只负责显示/隐藏和动画效果实现。Modal的子组件通常为一个View容器，在该View容器实现渲染界面和样式相关。在很多APP应用模态框的时候，出于视觉的优化，Modal子组件最外层的View容器为一层占满全屏的半透明背景层。

在RN中并没有onclick监听，想要在组件中注册点击事件，需要使用Touchable。该组件也可以理解为一个Animated.View容器，然后把需要注册点击事件的组件作为子组件，并注册onPress函数实现点击效果。Touchable目前有三种效果：TouchableHighlight：点击时显示高亮效果TouchableOpacity：点击时显示半透明效果TouchableW...

本文主要内容是在Window系统下配置Android APP的开发环境，配置过程将会有点麻烦，请大家需要有点耐心。当然大家也可以参考RN官网的配置过程，但实际上很多开发者根据官网步骤并没能配置出完整的RN开发环境。目前RN的最新版本是0.57，我们将以这个版本为例配置Android的开发环境。要配置RN的Android开发环境需要4个依赖：JDK（版本必须是 1.8）Node（版本必须...