GitHub:https://github.com/tion126/RNLive
没错,就是低仿~

上几张图先:






基于0.44.3版本,还算是比较稳定。目前公司的项目也是基于这个版本。
使用的框架有这些
"react-native-scrollable-tab-view": "^0.6.7",
"react-native-swiper": "^1.5.10",
"react-redux": "^5.0.6",
"redux": "^3.6.0",
"redux-logger": "^3.0.6",
"redux-thunk": "^2.2.0",
"shimo-navigation": "0.0.12"
其他框架大家应该都用过了,最后那个shimo-navigation是对石墨文档公司开源的一个基于react-navigation 的导航系统,还是挺好用的。
这个是react-native 的目录结构

这个是项目的目录结构

这里说说我个人对RN的看法:
RN性能说句实话还是和原生有差距,但是性能不是特别敏感的情况下RN还是很犀利的。比如可以代替一些以前用H5实现的页面,还有频繁更新的业务也可以用他来构建,纯RN项目就不太可行了,除非是非常轻量级的APP。so,对于大多数项目还是混合比较好,就比如这个低仿demo,直播页面播放的画面使用原生实现,但是礼物是用RN实现。还有一点,RN在老旧低端机上表现只能说是差强人意,但是老旧机型迟早是会淘汰的,在较新的机型上RN的表现还是比较出色,比如用iPhone7大多数页面我已经感觉不出和原生有啥区别了,而iPhone7也不是新🐔,毕竟明天iPhone8(x edition 7s ?...)就要发布了。
iOS这边是手动建的工程,然后通过cocoapods把RN框架集成到项目中,也算是模拟老项目集成RN了。毕竟现在新项目比较少,大多数老铁都是维护老项目,推翻重写也不太现实。推流用的LFLiveKit 播放用的IJK。Android这边只写了播放,用的是7牛的框架,手头没安卓的设备,推流就没搞了,不过这些去年都被别人写烂了,也没啥好说的了。安卓这边和iOS还有一些区别,模拟器不是很好用就没完善了。
推荐使用WebStorm运行,VSCode也可以。

运行方式
cd到 react-native目录
npm install
iOS
因为github传不了100m以上的文件,ijk已经100多m了,需要另外下载
下载解压后放置在图中目录即可
链接: https://pan.baidu.com/s/1miedota 密码: af6i

工程目录
pod install
|
|
v
运行
Android
直接运行

如果你喜欢我的项目/或者我的文章可以给我个star!
GitHub:https://github.com/tion126/RNLive
欢迎下方留言讨论
网友评论
Apple Mach-O Linker Error Group:
clang: error: linker command failed with exit code 1 (use -v to see invocation)
ld: warning: directory not found for option '-L/Users/zhaowei/Library/Developer/Xcode/DerivedData/RNLive-crlzsblehdctziaprqluiodckouy/Build/Products/Debug-iphonesimulator/NativeComponent'
ld: warning: directory not found for option '-L/Users/zhaowei/Library/Developer/Xcode/DerivedData/RNLive-crlzsblehdctziaprqluiodckouy/Build/Products/Debug-iphonesimulator/React'
ld: warning: directory not found for option '-L/Users/zhaowei/Library/Developer/Xcode/DerivedData/RNLive-crlzsblehdctziaprqluiodckouy/Build/Products/Debug-iphonesimulator/Yoga'
ld: library not found for -lNativeComponent
clang: error: linker command failed with exit code 1 (use -v to see invocation)
sed: can't read s/#import <RCTAnimation/RCTValueAnimatedNode.h>/#import "R
CTValueAnimatedNode.h"/: No such file or directory
sed: can't read s/return <List {...this.props} />;/return <List {...this.pro
ps} ref={(virtualizedSectionList) =>{this._virtualizedSectionList = virtualized
SectionList}} />;/: No such file or directory
sed: can't read s/return <VirtualizedList {...this.state.childProps} />;/retu
rn <VirtualizedList {...this.state.childProps} ref={(virtualizedList) =>{this.
_virtualizedList = virtualizedList}} />;/: No such file or directory
sed: can't read s/react-navigation/src/views/CardStack'/react-navigation/
src/views/CardStack/CardStack'/: No such file or directory
sed: can't read s/react-navigation/src/views/TransitionConfigs'/react-navi
gation/src/views/CardStack/TransitionConfigs'/: No such file or directory
sed: can't read s/react-navigation/src/views/Header'/react-navigation/src
/views/Header/Header'/: No such file or directory
sed: can't read s/react-navigation/src/views/HeaderStyleInterpolator'/react
-navigation/src/views/Header/HeaderStyleInterpolator'/: No such file or di
rectory
sed: can't read s/react-navigation/src/views/CardStackTransitioner'/react-
navigation/src/views/CardStack/CardStackTransitioner'/: No such file or dir
ectory