React Native 之常用第三方库

整理的一份 React Native 开发中常用的三方组件库大全。

完整的 App

使用React Native开发且功能完整的App。

序号	名称	简介
1	surmon.me.native	一个非常适合入门学习的react-native项目，有借鉴自其他种子项目的组织方式，代码清晰、结构合理。
2	Mister-Poster	用到了 RN+Redux+Redux Storage+Firebase 的一个开源项目
3	whatsapp	仿 whatsapp
4	elm-react-native	RN写的饿了么，还原度相当高，实现了各类动效，高度推荐
5	HelloRN	适合入门学习的demo，适配android ios， 有网页、图片、音乐、地图等功能
6	ZhiHuDaily-React-Native	仿知乎日报
7	im.js	一个基于 react-native + mobx + socket.io + node 的仿微信 JS-Wechat
8	shopping-react-native	一个商城类的RN项目
9	JueJinClient	仿掘金客户端
10	react-weather	精致的天气类App
11	30-days-of-react-native	30天学React Native的Demo App，结合作者源码，学React Native效果杠杆滴！
12	FinanceReactNative	使用React Native做的金融证券股票类App
13	GitHubPopular	这是一个用来查看GitHub最受欢迎与最热项目的App,它基于React Native支持Android和iOS双平台。
14	react-native-eyepetizer	模仿开眼3.1.2
15	react-native-gank	为 Gank.io 做的一个 React-Native 移动客户端
16

组件篇

集合常用组件的综合组件库。

序号	名称	简介
1	native-base	好用的一套综合组件库，库中集合了很多第三方的库，许多自定义的组件，使用方便
2	react-native-elements	由react-native-community社区维护的一套综合组件库
3	Shoutem-UI	库中包含了顶部标题栏，下拉菜单，视频播放，带加载刷新的ListView，GridView等，界面美观大方
4	1.nachos-ui	库中包含了一些常用的组件，不想一个个找的可以直接使用这种框架
5	tipsi-ui-kit	组件比较少，大部分都是一些装饰性的组件
6	ignite	通过命令行创建带有模板代码的项目，可以学习一下代码的写法。配置略复杂，要求node和yarn必须是最新的
7	react-native-starter-app	集合了一些常用组件的框架，省去不少搭建项目基础代码的时间
8	styled-components	可以让自定义组件变得更简单的一个库
9

滚动视图

列表、刷新、加载等

序号	名称	简介
1	react-native-gifted-listview	支持刷新，加载更多
2	react-native-parallax-view	可以自定义头部，带弹性当打效果的竖向ScrollView
3	react-native-pull-to-refresh	一个下拉刷新的组件，支持任意View刷新
4	react-native-parallax-scroll-view	支持头部弹性放大的ScrollView，功自定义功能丰富，上滑时带有视差效果
5	react-native-swiper	可以实现页面左右滑动的组件，用来制作引导页，Banner，看大图页面等
6	react-native-banner	一个专门针对Banner的组件，是基于react-native-swiper修改的
7	react-native-alphabetlistview	带侧边栏的列表
8	react-native-app-intro	Android风格的App引导页组件
9

多媒体

视频播放，拍照，录音等

序号	名称	简介
1	react-native-video	兼容Andorid和iOS的视频播放组件，安卓在安装以后需要还需要手动修改node_module中的文件才能正确使用
2	react-native-camera	通过React Native直接调用设备相机进行录制和拍摄的组件
3	react-native-audio	通过React Native进行音频录制
4	react-native-video-processing	视频编辑库
5	react-native-camera-roll-picker	选取系统相册中的照片
6	react-native-smart-barcode	二维码扫描组件
7	react-vr	React&React Native上的 VR 组件，fb官方出品，推荐！
8

导航栏

底部tab，顶部导航，页面管理等

序号	名称	简介
1	react-native-tab-navigator	适合做App底部Tab的组件，简单易用，用的比较多
2	react-native-scrollable-tab-view	一款适合用作顶部tab的组件，类似各大新闻App中的那样
3	React Native Tab View	一个顶部tab组件
4	react-native-navigation	一个用于页面间导航的解决方案
5	react-native-nav	一个通用的顶部标题栏，可以支持文字或图标
6	react-navigation	Learn once, navigate anywhere，强大的导航组件
7	react-native-navigation-drawer	侧滑菜单
8	react-native-custom-segmented-control	顶部tab，带指示器和奇切换动画
9	react-native-segmented-view	顶部tab组件
10	native-navigation	Airbnb提供的RN导航解决方案

存储

文件、数据库、键值对存储等

序号	名称	简介
1	react-native-storage	本地键值对存储，支持持久化存储
2	realm-js	搞移动开发的还有谁还不知道Realm的？移动平台数据库存储没有之一！特点就一个：快！快！快！现在也推出了JS版的v1.0.0
3	react-native-sqlite-storage	React Native上的sqlite存储工具
4	react-native-fetch-blob	一个致力于让RN读取手机文件更方便更高效的库
5

辅助资源

图标、工具类等

序号	名称	简介
1	react-native-vector-icons	包含大量图标，如果在引用时直接用"arrow-back"则会自己区分平台，如果使用“ios(md)-arrow-back”，指定平台
2	react-native-cross-platform-icons	一个可以跨平台使用的图标库
3	React-Native-Virtual-Keyboard	虚拟键盘
4	ReactNativeLocalization	一个实现多语言环境的框架
5

动画

各种动画效果

序号	名称	简介
1	react-native-spinkit	一些加载动画的集合
2	react-native-progress	带动画的进度条
3	lottie-react-native	Airbnb良心开源动画库
4

Dialog

弱提示，确认框，下拉菜单等

序号	名称	简介
1	react-native-easy-toast	实现类似Android中Toast的效果，用于界面弱提示
2	react-native-popup-dialog	自带动画的弹出框
3	react-native-popup-menu	弹出菜单
4	react-native-wheel-picker	滚轮选择组件
5	react-native-message-bar	可以实现应用内消息通知的弹出框
6	react-native-tooltip	带箭头的弹出菜单
7	react-native-searchbar	弹出式搜索框
8	react-native-root-modal	弹出页面
9	react-native-picker	底部弹出Picker，多级联动，三级联动选择器
10	react-native-picker-xg	滚轮选择器
11	React-Native-SnackBar-Component	类似Android平台上的snackbar
12	ReactNativeTips	移动端各类Tips提示组件合集，提供toast，success，error，alert，confirm等

图片

图形图像处理（滤镜，模糊，修改）

序号	名称	简介
1	gl-react-native	通过WebGL给图片添加各种炫酷效果的组件，而且是各种炫酷
2	react-native-blur	图片模糊的组件
3	react-native-photo-browser	选择系统相册图片，浏览选中大图
4	react-native-fit-image	根据图片的大小自动进行缩放的Image组件
5	react-native-webp	使项目支持WebP图片格式
6	react-native-palette	从图片中直接提取颜色的库
7	react-native-image-crop-picker	图片剪裁，自带支持系统图库选择图片功能
8

文本

文本、输入框、搜索框

序号	名称	简介
1	react-native-progressive-input	带输入提示列表的输入框
2	react-native-textinput-effects	类似Android中TextInputLayout，不过可以设置的样式更多
3	react-native-slot-machine	带随机滚动效果的Text组件
4	react-native-marquee-label	带跑马灯效果的Text组件
5	react-native-hyperlink	支持超链接的Text
6	react-native-hypertext	支持超链接的Text
7	react-native-mentions	一个可以通过 @ 符号提及某人的输入框
8	react-native-floating-labels	类似Android上的一个输入框组件
9

菜单

侧滑，展开，悬浮等各类菜单组件

序号	名称	简介
1	react-native-accordion	可以收起，展开的菜单组件
2	react-native-action-button	悬浮按钮，类似Android中的FloatingActionButton
3	react-native-actionsheet-native	类似IOS平台上的底部弹出菜单
4	react-native-off-canvas-menu	侧滑菜单
5	react-native-swipeout	列表Item侧滑菜单
6	react-native-swipeable	为列表Item添加侧滑功能的组件
7	react-native-circle-button	带动画的圆形菜单
8	react-native-drawer	侧滑菜单，用RN代码实现的，所以感觉比较卡
9

图表

各种图表

序号	名称	简介
1	react-native-charts-wrapper	图表组件，用RN代码对原生组件进行了包装。Android上用的MPAndroidChart，iOS上用的是Charts
2	react-native-pie	饼状图表，支持双平台
3	rn-d3-art-charts	带动画效果的图表组件，双平台通用，但是在Android 上没有动画效果
4

国内服务

RN封装的QQ登录，极光推送，支付宝等

序号	名称	简介
1	react-native-qq	RN中文网的天地之灵封装的QQ登录插件
2	jpush-react-native	RN封装的极光推送，支持双平台
3	react-native-smart-amap-location	高德定位
4	react-native-smart-alipay	支付宝支付
5	react-native-open-share	新浪微博，微信，QQ，支付宝等分享，支付，登录
6	react-native-share	用于分享的组件
7	react-native-share-extension	自定义分享平台的组件
8

其它

序号	名称	简介
1	react-native-splash-screen	启动页组件
2	react-native-display	给组件添加进入退出动画，通过控制显示与否，提高组件性能
3	react-native-button-component	比系统Button好用一点的Button组件
4	react-native-step-indicator	操作步骤指示器
5	react-native-tinder-swipe-cards	类似探探App中左右滑动的组件
6	react-native-star-rating	星级评分组件
7	react-native-qrcode	展示和生成二维码组件
8	react-native-modest-checkbox	好用的复选框组件
9	react-native-foldview	可以折叠起来的UI组件
10	react-native-keyboard-spacer	让软键盘的弹出和隐藏更优雅一点
11	react-native-CountDowntimer	一个可以定义样式的倒计时组件
12	react-native-qrcode	一个生成二维码的组件
13	react-native-smart-gesture-password	手势九宫格图案解锁组件
14	react-native-qrcode-app	一个利用RN代码实现二维码识别的Demo
15	react-native-device-info	获取手机设备信息的组件

参考：
React Native常用三方组件库大全