React native禁用自动旋转

时间:2017-09-29 09:59:24

标签: ios reactjs react-native screen-orientation

我需要在react-native应用程序中禁用自动旋转功能。

应用程序应该支持纵向和横向,但用户应该不能旋转屏幕。现在我使用了react-native-orientation,但是这个模块只检查了方向并将其更改为必要的值。

所以我只需要以编程方式旋转屏幕。

RN版本:0.33

1 个答案:

答案 0 :(得分:1)

您可以设置Xcode设备方向 enter image description here

在您的Android清单文件中设置: android:screenOrientation="portrait"

或者您可以使用Dimensions进行设置。像这样:

Dimensions.addEventListener('change', ({ window: { width, height } }) => {
    const orientation = width > height ? 'LANDSCAPE' : 'PORTRAIT';
}

或者您可以根据需要使用react-native-orientation将画面锁定在纵向或横向上。我在我的github中有一个工作示例:https://github.com/soutot/react-native-orientation-test

class App extends Component {
    componentDidMount() {
        Orientation.lockToLandscape();
    }

    render() {
        return(
            <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center'}}>
                <Text>This is my content</Text>
            </View>
        );
    }
}

希望有所帮助