CODEWITHSUNDEEP
reactjsreact-nativereact-navigationandroid-orientation
user7747472
user7747472

Reputation: 1952

How can i lock the screen orientation to portrait mode in react navigation?

How can I lock the screen mode to portrait mode in React Navigation?

React navigation version I am using: 4.0.10

Here is my navigation structure

const AppNavigation = createSwitchNavigator({
    Initialize: {
        //screen: SplashScreen,
        screen: Login,
    },
    ApplicationIntro: {
        screen: ApplicationIntro,
        navigationOptions: {
            header: null,
        },
    },
    Auth: AuthNavigation,
    Home: Home,
});

There is nothing in the documentation on handing the screen orientation by passing paramerters through navigationOptions or defaultNavigationOptions.

Is there anyway to lock the screen mode to "portrait" without using any other library?

Upvotes: 2

Views: 4957

Answers (2)

Mohsen Haghighatkhah
Mohsen Haghighatkhah

Reputation: 446

One of the easiest ways to set the orientation portrait mode, add this piece of code android:screenOrientation="portrait" to activity tag in android manifest file just like this

In the manifest, set this for all your activities:

<activity android:name=".YourActivity"
    android:configChanges="orientation"
    android:screenOrientation="portrait"/>

Upvotes: 2

Shubham
Shubham

Reputation: 478

I don't think so react-navigation is providing orientation property. So you can use react-native-orientation (https://www.npmjs.com/package/react-native-orientation) but as you can see its not updated from last two years and its listener also not work properly sometime. So, then i used react-native-orientation-locker (https://www.npmjs.com/package/react-native-orientation-locker) and I don;t find any issues with this one. so you can use react-native-orientation-locker (please check spelling while installing using yarn as they misspelled it).

Upvotes: 2

Related Questions