RN开源播放器Video组件(react-native-video)

开源项目地址: https://github.com/brentvatne/react-native-login

一.

项目介绍

该组件进行封装成React Native平台播放器Video组件,大家可以使用该组件进行播放视频啦~不过支持React Native的版本最低0.19版本。


二.

1.1. 运行命令进行安装

npm install react-native-video --save

1.2.iOS版本

以上的命令运行完成安装组件之后,如果你需要其他的应用也可以在你的Video组件上面播放音乐,视频等。你可以在AppDelegate.m文件作如下处理:

#import   // import

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

1.3.Android版本

首先复制你的Video文件到android项目的 android/app/src/main/res/raw/的文件夹中,然后做如下相关处理:

1.4.android/settings.gradle文件

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

1.5.android/app/build.gradle文件

dependencies {
   ...
   compile project(':RCTVideo')
}

1.6.MainActivity.java文件修改

首先在文件的头部,导入相关包:

import com.brentvatne.react.ReactVideoPackage;

然后在方法中添加:

.addPackage(new ReactVideoPackage())

三. 实例


import React, { Component } from 'react';
import {
    AppRegistry,
    StyleSheet,
    TextInput,
    ListView,
    TouchableOpacity,
    Image,
    ScrollView,
    Text,
    Alert,
    View
} from 'react-native';
import  Video from 'react-native-video'



export default class extends Component  {


        render(){

            return(
                 //方法一:


                 

关于更多例子,大家可以去https://github.com/brentvatne/react-native-login 下载实例使用

你可能感兴趣的:(react-native)