React Native Disable Screen Rotation

Handheld mobile devices always have two orientation mode Portrait mode and Landscape mode due to there design to hold easily in the hand. Portrait mode is by default mode in mobile devices and if we rotate the device it turns into Landscape mode.

While making an application we normally design for the Portrait mode and let the system manage in Landscape mode (You can manage both) but in some cases, we don’t want the system to change the orientation while the user is using our App. So here is an example of React Native Disable Screen Rotation which will help you to fix the orientation of your app. We can do this by simply putting 1 line of code in android and in iOS we have to perform a specific step.

For this example, you can use already available projects or can take help from here. We will show you the changes that you can do to fix the orientation of your application.

For Android Users :

1. Open YourProject -> android -> app -> src -> main -> AndroidManifest.xml

2. Now you need to put android:screenOrientation=“portrait” as shown below

3. After making changes in AndroidManifest.xml file you need to re-run your project. This would disable the landscape mode in your current application in android devices.

For IOS Users:

1. Open YourProject -> ios -> Project_Name.xcodeproj file in X-Code.

2. After opening the project in Xcode select your project name.

3. Now Goto -> General -> Deployment Info and only select the Portrait mode.

4. Now Re-run your project. This would disable the landscape mode in your current application in android devices.

This is how you can disable the screen rotation. If you have any doubt or you want to share something about the topic you can comment below or contact us here. There will be more posts coming soon. Stay tuned!

Hope you liked it. 🙂

How useful was this post?

Click on a star to rate us!

Average rating / 5. Vote count:

As you found this post useful...

Follow us on social media!

We are sorry that this post was not useful for you!

Let us improve this post!

About Snehal Agrawal

#SelfLearner #MobileAppDeveloper #TechnologyMiner #OpenSourceLover thats enough to describe me..

View all posts by Snehal Agrawal →

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.