如何在 React Native youtube iframe 中切换到全屏（点击 YouTube 播放器 gui 上的全屏按钮旋转到横向）？

Question

我想通过点击播放器 gui 上的全屏按钮将播放器切换到横向模式。我正在使用 expo，所以我使用了 expo 方向，我可以通过调用 onfullscreenchange 道具上的一个函数来切换到横向模式，但是在退出全屏模式后，应用程序被锁定在横向模式。我该如何解决？

我的代码：

VideoPlayer.js

    import React from "react";
    import { View, Dimensions } from "react-native";
    import YoutubePlayer from "react-native-youtube-iframe";
    
    import * as ScreenOrientation from "expo-screen-orientation";
    
    const VideoPlayer = () => {
      function setOrientation() {
        if (Dimensions.get("window").height > Dimensions.get("window").width) {
          //Device is in portrait mode, rotate to landscape mode.
          ScreenOrientation.lockAsync(ScreenOrientation.OrientationLock.LANDSCAPE);
        } else {
          //Device is in landscape mode, rotate to portrait mode.
          ScreenOrientation.lockAsync(ScreenOrientation.OrientationLock.PORTRAIT);
        }
      }
    
      return (
        <View
          style={{
            width: "100%",
            height: 220,
          }}
        >
          <YoutubePlayer
            height={300}
            play={false}
            videoId={"Dv7gLpW91DM"}
            onFullScreenChange={setOrientation}
          />
        </View>
      );
    };
    
    export default VideoPlayer;

Answer 1

您可以使用从 onFullScreenChange 返回的布尔值来确定播放器是否处于全屏状态，然后从那里设置正确的方向，我现在无法测试，但应该是这样的

onFullScreenChange={isFullscreen => { 
    if(isFullscreen) { setOrientationToPortrait() } 
    else { setOrientationToLandscape() }
}