Lock video to landscape fullscreen orientation (react-native-video)

こ雲淡風輕ζ 提交于 2020-12-06 04:28:32

问题


I want to work on some apps that will navigate into video.js file that will automatically trigger the video to play in fullscreen with landscape orientation.

I'm using react-native-video link: https://github.com/react-native-community/react-native-video

render() {

    return (
      <View style={styles.container}>
        <View style={styles.fullScreen}>
          <Video
            ref={(ref) => {
              this.player = ref
            }}  
            source={require('../vid/intro-video.mp4')}
            style={styles.nativeVideoControls}
            rate={this.state.rate}
            paused={this.state.paused}
            volume={this.state.volume}
            muted={this.state.muted}
            resizeMode={this.state.resizeMode}
            onLoad={this.onLoad}
            onLoadStart={this.loadStart}
            onBuffer={this.onBuffer}
            onProgress={this.onProgress}
            onEnd={debounce(this.onEnd, 100)}
            repeat={false}
            controls={this.state.controls}
          />
        </View>
      </View>
    );
  }

I try to add this belo code inside loadStart function but it's not working.. and when I rotate the video appear at the bottom of my screen if not in fullscreen mode.

this.player.presentFullscreenPlayer()

solution that I tried: 1) using onLayout on the view tag but nothing happened. 2) using this.player.presentFullscreenPlayer() still did not fix the problem.


回答1:


I still did not find a fix solution for this problem but I just want to share workaround that I did for temporary.

I'm using another package react-native-orientation and trigger lockToLandscape() inside the componentWillMount and then I get the width and height of the device using dimension

Orientation.lockToLandscape();
height = Dimensions.get('window').height;
width = Dimensions.get('window').width;

and I also add the presentFullScreenPlayer inside onLoad method

this.player.presentFullscreenPlayer();

and that I set the width and the height of the video player using the width and height get from the Dimensions of the device...

If you guys have another ways, do share :) Thanks



来源:https://stackoverflow.com/questions/43339684/lock-video-to-landscape-fullscreen-orientation-react-native-video

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!