Go to file
2023-12-01 08:51:11 +01:00
.github
android chore(android): replacing deprecated SYSTEM_UI flag (#3386) 2023-11-30 21:16:24 +01:00
docs feat(ad): add data to onReceiveAdEvent (#3378) 2023-11-27 21:43:30 +01:00
examples
ios
src
windows Merge branch 'master' into sdkVersion 2023-09-19 09:09:13 +02:00
.eslintignore
.eslintrc chore: lint project (#3279) 2023-10-07 12:56:35 +02:00
.gitignore feat: add typescript (#3266) 2023-10-06 18:39:14 +02:00
.nvmrc feat: added .nvmrc 2023-07-19 16:21:12 +09:00
.prettierrc
.release-it.json
CHANGELOG.md
CONTRIBUTING.md Update PR guide 2022-06-15 13:59:03 +03:00
LICENSE
package.json
react-native-video.podspec
README.md doc: Update README.md 2023-11-18 16:48:24 +01:00
tsconfig.build.json
tsconfig.json

react-native-video

🎬 <Video> component for React Native

Note: version 5.2.1 won't have any updates. We are currently working on making a 6.0.0 fully stable

Documentation

Old version of documentation can be found here New documentation is available at react-native-video.github.io/react-native-video, if you find some issue with new version, don't hesitate to open a ticket!

Usage

// Load the module

import Video, {VideoRef} from 'react-native-video';

// Within your render function, assuming you have a file called
// "background.mp4" in your project. You can include multiple videos
// on a single screen if you like.

const VideoPlayer = () => {
 const videoRef = useRef<VideoRef>(null);
 const background = require('./background.mp4');

 return (
   <Video 
    // Can be a URL or a local file.
    source={background}
    // Store reference  
    ref={videoRef}
    // Callback when remote video is buffering                                      
    onBuffer={onBuffer}
    // Callback when video cannot be loaded              
    onError={onError}               
    style={styles.backgroundVideo}
   />
 )
}

// Later on in your styles..
var styles = StyleSheet.create({
  backgroundVideo: {
    position: 'absolute',
    top: 0,
    left: 0,
    bottom: 0,
    right: 0,
  },
});