react-native-video-vega

🎬 <Video> component for React Native Vega OS

Documentation

documentation is available at docs.thewidlarzgroup.com/react-native-video/

[!NOTE] Documentation is made for react-native-video, but is should cover all the features of react-native-video-vega

Example

To run example you need to have setup React Native for Vega

To run example follow these steps:

[!CAUTION] Use npm to install dependencies in the root directory. Other package managers may not work correctly.

# Install dependencies in the root directory
npm install --force

# Go to example directory
cd example
npm install

# build the project
npm run build:debug

# Run Simulator & start metro bundler
kepler virtual-device start
npm start
kepler device start-port-forwarding --device VirtualDevice -p 8081 --forward false

# Run the app
kepler run-kepler build/aarch64-debug/keplerrnvideoexample_aarch64.vpkg com.anonymous.rnvexample.main -d VirtualDevice

Usage

// Load the module

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

// 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,
  },
});

Community support

We have an discord server where you can ask questions and get help. Join the discord server

Enterprise Support