react-native-video使用攻略

源码在此 仅供参考

---

一、简介

react-native-video是一个可以播放视频的组件，它的用法简单，功能完备，是React native项目中很好用的一个Video播放的组件。

它的功能主要有以下10个：

1. 控制播放速率
2. 控制音量大小
3. 支持静音功能
4. 支持播放和暂停
5. 支持后台音频播放
6. 支持定制样式，比如设置宽高
7. 丰富的事件调用，如onLoad，onEnd，onProgress，onBuffer等等，可以通过对应的事件进行UI上的定制处理，如onBuffer时我们可以显示一个进度条提示用户视频正在缓冲。
8. 支持全屏播放，使用presentFullscreenPlayer方法。这个方法在iOS上可行，在android上不起作用。参看issue#534，#726也是同样的问题。
9. 支持跳转进度，使用seek方法跳转到指定的地方进行播放
10. 可以加载远程视频地址进行播放，也可以加载RN本地存放的视频。

二、使用

使用步骤如下：

1. 导入依赖库

在项目Terminal中输入命令行：

npm install react-native-video --save

或者用yarn：

yarn add react-native-video

IOS环境下：

直接运行下面命令来链接react-native-video库。

react-native link 

如果你想允许其他应用在你的视频组件上播放音乐，请打开AppDelegate.m文件并且添加：

AppDelegate.m

#import <AVFoundation/AVFoundation.h>  // import

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  ...
  [[AVAudioSession sharedInstance] setCategory:AVAudioSessionCategoryAmbient error:nil];  // allow
  ...
}

Android环境下：

直接运行下面命令来链接react-native-video库。

react-native link 

如果上面的方式失败了，那么你可以尝试手动添加配置，这步比较麻烦。

android/settings.gradle
较新的ExoPlayer库适用于大多数人。(推荐使用这个库)

include ':react-native-video'
project(':react-native-video').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-video/android-exoplayer')

如果您需要使用旧的基于Android MediaPlayer的播放器，请改用以下内容：

include ':react-native-video'
project(':react-native