React native disable auto rotate

Question

I need to disable auto rotation feature in react-native application.

The application should support portrait and landscape orientation but the user should can`t rotation screen. Now I have used react-native-orientation but this module only checked orientation and change it to necessary value.

So I need rotate screen only programmatically.

RN Version: 0.33

No. Im should support portrait and landscape so I can`t disable this orientation on Xcode. — Dmitriy Ilchenko, Sep 29 '17 at 10:17
I can't seem to understand what your problem is. Please post what you have done till now — Ray, Sep 29 '17 at 11:08

score 2 · Answer 1 · answered Sep 29 '17 at 13:27

You can set your Xcode Device Orientation

Set in your android manifest file: android:screenOrientation="portrait"

Or You can set it using Dimensions. Something like this:

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

Or you can use react-native-orientation to lock the screen on portrait or landscape just as you need. I have a working example in my 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>
        );
    }
}

Hope it helps

React native disable auto rotate

1 Answers1