Hello Friends 👋,
Welcome To Infinitbility! ❤️
This tutorial will help you to make your react native application rotation lock. here we will learn how lock orientation in react native for ios, and android both.
React Native provide orientation handler but default it will depend upon phone ( auto rotate or not ). but when mantion your application orientation in your project every time it will open on same orientation mode, it will no longer depend on user orientation settings.
let’s see how we will disable orientation in react native ios and android.
Lock orientation in React Native android
For android, React Native provide orientation option in
AndroidManifest.xml it will located in your
application tag and add screenOrientation attribute
android:screenOrientation="portrait" like below example.
1...2 <application3 android:name=".MainApplication"4 android:label="@string/app_name"5 android:icon="@mipmap/ic_launcher"6 android:roundIcon="@mipmap/ic_launcher_round"7 android:allowBackup="false"8 android:usesCleartextTraffic="true"9 android:screenOrientation="portrait"10 android:theme="@style/AppTheme"11 android:requestLegacyExternalStorage="true"12 >13 ...14 </application>15...
Lock orientation in React Native iOS
For ios, React Native provide orientation settings in
Project/Genral/DeploymentInfo tab. check below highlighted path to navigate DeploymentInfo Tab.
Thanks for Reading…
Join our email list and get notified about new content
No worries, I respect your privacy and I will never abuse your email.
Every week, on Tuesday, you will receive a list of free tutorials I made during the week (I write one every day) and news on other training products I create.