1.0.2 • Published 6 years ago

react-native-android-video v1.0.2

Weekly downloads
5
License
MIT
Repository
github
Last release
6 years ago

React Native Android Video

Version

react-native-android-video

Android ExoPlayer <Video /> component for react-native.

Installation

Using npm:

$ npm install --save react-native-android-video

Or using yarn:

$ yarn add react-native-android-video

Android

  1. Append the following lines to android/settings.gradle:
include ':react-native-android-video'
project(':react-native-android-video').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-android-video/src/android')
  1. Insert the following lines inside the dependencies block in android/app/build.gradle:
compile project(':react-native-android-video')
  1. Open MainApplication.java:
  • Import the package on top of the file:
import com.cherrypick.androidvideo.RNAndroidVideoPackage;
  • Add the RNAndroidVideoPackage class to your list of exported packages:
@Override
protected List<ReactPackage> getPackages() {
  return Arrays.<ReactPackage>asList(
    new MainReactPackage(),
    new RNAndroidVideoPackage(),
    ...
  );
}

Usage

// Import the module
import AndroidVideo from 'react-native-android-video'

...

// In your render function
<AndroidVideo
  ref={(ref) => {
    this.player = ref
  }}
  style={styles.video}
  source={this.props.videoUrl}
  paused={!this.props.isPlaying}
  rate={this.props.playerRate}
  onPlayerReady={this._onVideoReady}
  onPlayerLoading={this._onVideoPlayerLoading}
  onProgress={this._onVideoPlayerProgress}
  onPlayerError={this._onVideoError}
/>

Configurable props

PropertyTypeDescription
sourcestringSets the media source
pausedbooleanControls whether the media is paused
ratenumberSpeed at which the media should play

Event props

onPlayerReady

Callback function that is called when the media is loaded and the player is ready to play.

Payload:

PropertyTypeDescription
durationnumberThe duration of the media in milliseconds

onPlayerLoading

Callback function that is called when the player is start or stop buffering.

Payload: true / false.

onProgress

Callback function that is called every 250 mili seconds with info about which position the media is currently playing.

Payload:

PropertyTypeDescription
currentTimenumberCurrent player position in seconds

onPlayerError

Callback function that is called when error is occurs.

Payload:

PropertyTypeDescription
errorstringError message

Methods

seek

Seek to the specified position represented by seconds.

Example:

this.player.seek(450)

Authors

See also the list of contributors who participated in this project.

Contributing

Pull requests are welcome.