CODEWITHSUNDEEP
react-native
KRAL JESUS
KRAL JESUS

Reputation: 99

react native doesn't show video in my native application, what's the solution?

react native da emulator comes blank white page, does not show video, how can I see my video? react native da emulator comes blank white page, does not show video, how can I see my video?

import React, { Component } from 'react';
import { Text, View, StyleSheet } from 'react-native';

export default class HelloWorldApp extends Component {
  render() {
    return (
      <View style={styles.videoContainer}>
        <Video
          source={{ uri: 'http://d23dyxeqlo5psv.cloudfront.net/big_buck_bunny.mp4' }}
          ref={(ref) => {
            this._player = ref
          }}

          style={styles.video} />
      </View>

    );
  }
}

const styles = StyleSheet.create({
videoContainer: {
  flex: 1,

},
video: {
  position: 'absolute',
    top: 0,
      right: 0,
        left: 0,
  }

})

export default styles;

Upvotes: 0

Views: 59

Answers (1)

Aurangzaib Rana
Aurangzaib Rana

Reputation: 4252

first you export default two things which is wrong. run the below code its is working

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

import { Text, View, StyleSheet } from 'react-native';


const styles = StyleSheet.create({
  videoContainer: {
    flex: 1,

  },
  video: {
    flex: 1,
  }

});

export default class HelloWorldApp extends Component {
  render() {
    return (
      <View style={styles.videoContainer}>
        <Video
          source={{ uri: 'http://d23dyxeqlo5psv.cloudfront.net/big_buck_bunny.mp4' }}
          ref={(ref) => {
            this._player = ref
          }}

          style={styles.video} />
      </View>

    );
  }
}

Upvotes: 1

Related Questions