0

I am using the module react-native-video which works just the way I want it in the debug version. But as soon as I assembleRelease it only shows a white screen instead of the video. Why doesn't it play in the release version?

I think that somehow when it compiles it can't find the location anymore, but how would I fix that?

This is my video component:

  render() {
    let video = this.props.video;

    return (
        <TouchableHighlight onPress={this.backToQuestion}>
          <View>
            <Video source={video}   // Can be a URL or a local file.
                   ref={ref => this.player = ref} // Store reference
                   rate={1.0}                     // 0 is paused, 1 is normal.
                   volume={1.0}                   // 0 is muted, 1 is normal.
                   muted={false}                  // Mutes the audio entirely.
                   paused={this.state.paused}                 // Pauses playback entirely.
                   resizeMode="stretch"             // Fill the whole screen at aspect ratio.
                   repeat={false}                  // Repeat forever.
                   playInBackground={false}       // Audio continues to play when app entering background.
                   playWhenInactive={false}       // [iOS] Video continues to play when control or notification center are shown.
                   progressUpdateInterval={250.0} // [iOS] Interval to fire onProgress (default to ~250ms)
                   onLoadStart={this.loadStart}   // Callback when video starts to load
                   onProgress={() => {this.state.restart ? this.restartVideo() : null}}      // Callback every ~250ms with currentTime
                   onEnd={this.backToQuestion}             // Callback when playback finishes
                   onError={this.videoError}      // Callback when video cannot be loaded
                   style={styles.video} />
          </View>
        </TouchableHighlight>
    )

The video props are passed from another page like this:

let videos = [
     require('../videos/HISTORISCHETUIN.mp4'), //0n
     require('../videos/HISTORISCHETUIN.mp4'), //1n
     require('../videos/HISTORISCHETUIN.mp4'), //2n
     require('../videos/TOREN.mp4'), //3
     require('../videos/KELDER.mp4'), //4
     require('../videos/HISTORISCHETUIN.mp4'), //5
     require('../videos/SLOTGRACHT.mp4'), //6
     require('../videos/PLEIN.mp4') //7
] 

goToVideo = () => {
  this.props.music.backgroundMusic.pause()
  Actions.videoplayer({paused: false, restart: true, video: videos[question.image]})
}
Sinan Samet
  • 6,432
  • 12
  • 50
  • 93

1 Answers1

1

Putting the videos in res/raw/ and taking the capitals out solved my problem!

This is how my new array looks

let videos = [
          {uri: 'historischetuin'}, //0n
          {uri: 'historischetuin'}, //1n
          {uri: 'historischetuin'}, //2n
          {uri: 'toren'}, //3
          {uri: 'kelder'}, //4
          {uri: 'historischetuin'}, //5
          {uri: 'slotgracht'}, //6
          {uri: 'plein'} //7
          ]
Sinan Samet
  • 6,432
  • 12
  • 50
  • 93