65faba312d
* fix(android): hide surfaceView for loading time when shutter is hidden * fix: hide/show surface view without casting |
||
---|---|---|
.github | ||
android | ||
docs | ||
examples | ||
ios | ||
scripts | ||
src | ||
windows | ||
.eslintignore | ||
.eslintrc | ||
.gitignore | ||
.nvmrc | ||
.prettierrc | ||
.release-it.json | ||
app.plugin.js | ||
CHANGELOG.md | ||
CONTRIBUTING.md | ||
LICENSE | ||
package.json | ||
react-native-video.podspec | ||
README.md | ||
tsconfig.build.json | ||
tsconfig.json |
react-native-video
🎬 <Video>
component for React Native
Documentation
documentation is available at thewidlarzgroup.github.io/react-native-video/
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,
},
});
Community support
We have an discord server where you can ask questions and get help. Join the discord server
Enterprise Support
📱 react-native-video is provided as it is. For enterprise support or other business inquiries, please contact us 🤝. We can help you with the integration, customization and maintenance. We are providing both free and commercial support for this project. let's build something awesome together! 🚀