react-native-vlc-player

0.2.3 • Public • Published

react-native-vlc-player

Getting started

$ npm install react-native-vlc-player --save

Dependencies

$ npm install react-native-vector-icons --save

Manual installation

Copy Ionicons.ttf from node_modules/react-native-vector-icons/Fonts to android/app/src/main/assets/fonts

Android

  1. Insert the following lines inside the dependencies block in android/app/build.gradle:
...
allprojects {
    ...
    dependencies {
            ...
+      maven {
+        url("https://jitpack.io")
+      }
    }
}

Usage

import React, {Component} from 'react';
import {
  StyleSheet,
  View
} from 'react-native';
// Import library
import VlcPlayer from 'react-native-vlc-player';
 
export default class App extends Component {
  vlcplayer = React.createRef();
 
  componentDidMount() {
    console.log(this.vlcplayer)
  }
 
  render() {
    return (
      <View
        style={[
          styles.container
        ]}>
        <VlcPlayer
          ref={this.vlcplayer}
          style={{
            width: 300,
            height: 200,
          }}
          paused={false}
          autoplay={true}
          source={{
            uri: 'file:///storage/emulated/0/Download/example.mp4',
            autoplay: true,
            initOptions: ['--codec=avcodec'],
          }}  />
      </View>
    );
  }
}
 
const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: 'grey',
  },
});

Props

<VLCPlayer
    ref='vlcplayer'
    paused={this.state.paused}
    style={styles.vlcplayer}
    source={{uri: this.props.uri, initOptions: ['--codec=avcodec']}}
    onVLCProgress={this.onProgress.bind(this)}
    onVLCEnded={this.onEnded.bind(this)}
    onVLCStopped={this.onEnded.bind(this)}
    onVLCPlaying={this.onPlaying.bind(this)}
    onVLCBuffering={this.onBuffering.bind(this)}
    onVLCPaused={this.onPaused.bind(this)}
/>

Static Methods

seek(seconds)

this.refs['vlcplayer'].seek(0.333);

snapshot(path)

this.refs['vlcplayer'].snapshot(path);

Package Sidebar

Install

npm i react-native-vlc-player

Weekly Downloads

19

Version

0.2.3

License

MIT

Unpacked Size

63.3 kB

Total Files

36

Last publish

Collaborators

  • ghondar