react_native_video_cache_convert_url_quickstart.ts

1import React from 'react';
2import { StyleSheet, View } from 'react-native';
3import Video from 'react-native-video';
4import convertToCache from 'react-native-video-cache';
5
6const VideoPlayer = () => {
7  const videoUri = "https://www.learningcontainer.com/wp-content/uploads/2020/05/sample-mp4-file.mp4";
8
9  return (
10    <View style={styles.container}>
11      <Video
12        source={{ uri: convertToCache(videoUri) }}
13        style={styles.video}
14        controls={true}
15      />
16    </View>
17  );
18};
19
20const styles = StyleSheet.create({
21  container: {
22    flex: 1,
23    justifyContent: 'center',
24    alignItems: 'center',
25    backgroundColor: '#000',
26  },
27  video: {
28    width: '100%',
29    height: 300,
30  },
31});
32
33export default VideoPlayer;