CODEWITHSUNDEEP
androidreactjsreact-nativereact-native-video
Solly
Solly

Reputation: 524

React Native Black Screen for a second between loading and video playback using react-native-video (Android)

There is always around 2 seconds of black screen when moving from onLoad which stop my loading spinner component and the start of the video playback in my code below. I am using ExoPlayer. Any idea what i am doing wrong, or how can i improve my code to get rid of the black screen?!

render() {
let loading = null;
let waitingVideo = null;
if (!this.state.waitingVideoURL) {
  loading = (
    <View>
      <Text style={styles.loading}>Loading...</Text>
      <ActivityIndicator size="large" color="#2C3942" />
    </View>
  );
} else {
  waitingVideo = (
    <Video
      source={{
        uri: this.state.waitingVideoURL,
      }}
      resizeMode="cover"
      style={styles.backgroundVideo}
      repeat
      onLoad={this.stopLoading}
    />
  );
}

return (
  <View style={styles.container}>
    <StatusBar hidden />
    {waitingVideo}
    {loading}
  </View>
);
}
}

Upvotes: 3

Views: 2230

Answers (1)

Sam Nasser
Sam Nasser

Reputation: 321

Maybe the video you are trying to serve is still buffering? Try registering the onBuffer event and see if the video is still buffering or not.

Upvotes: 1

Related Questions