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
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. 🙂