react-native录音组件
github地址：react-natitve-video
版本
版本4.x 对应的是react-native 0.57.0以上的版本
版本3.x 对应的是react-naitve 0.40.0以上的版本
安装 react-native-video
使用npm :
<pre>
npm install --save react-native-video
</pre>
或者使用yarn:
<pre>
yarn add react-native-video
</pre>
根据需求在你的项目中引用react-native-video
--iOS--
1：ios可以在项目中执行 react-native link react-native-video �来导入react-natie-viode依赖
2：通过使用CocoaPods的方式，在你项目的Podfile文件中添加
<pre>
pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'
</pre>
<pre>
pod 'react-native-video', :path => '../node_modules/react-native-video/react-native-video.podspec'
</pre>
--Android--
1：android可以通过执行 react-native link react-native-video 来导入react-native-video依赖
2：配置android/setting.gradle文件
<pre>
include ':react-native-video'
</pre>
<pre>
project(':react-native-video').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-video/android-exoplayer')
</pre>
3:android/app/build.gradle中新增
<pre>
dependencies {
...
compile project(':react-native-video')
}
</pre>
4:MainApplication.java中新增
import com.brentvatne.react.ReactVideoPackage;
在List中添加ReactVideoPackage类
@Override
protected List<ReactPackage> getPackages() {
return Arrays.asList(
new MainReactPackage(),
new ReactVideoPackage()
);
}
具体RN使用示例
// Load the module
import Video from 'react-native-video'
// ***************************
<Video
source={require('../src/img/moments.mp4')} //设置本地视频地址
// source={{uri:'https:***.***'}} //设置在线视频地址
ref={(ref)=>{
this.player = ref
}}
onBuffer={this.onBuffer} //视频缓冲回调
onEnd = {this.onEnd} //播放结束后的回调
onError = {this.onError} //播放失败后的回调
style = {styles.backgroundVideo} //样式设置
/>
