如何在React Native Android开发模式下禁用横向模式?

时间:2015-12-03 23:37:41

标签: android react-native react-native-android

我是android环境的新手。我知道可以在Xcode中完成iOS以禁用设备方向。如何在React Native Android中禁用横向模式或任何方向模式?

感谢。

9 个答案:

答案 0 :(得分:104)

android:screenOrientation="portrait"添加到activity文件中的android/app/src/main/AndroidManifest.xml部分,以便最终看起来像这样:

<activity
    android:name=".Activity"
    android:label="Activity"
    android:screenOrientation="portrait"
    android:configChanges="keyboardHidden|orientation|screenSize">
</activity>

android:screenOrientation属性有几个不同的值;如需全面的列表,请查看以下内容:https://developer.android.com/guide/topics/manifest/activity-element.html

答案 1 :(得分:44)

http://developer.android.com/guide/topics/manifest/activity-element.html

android:screenOrientation="portrait"添加到您的活动xml

答案 2 :(得分:25)

如上所述,@ morenoh149的属性名称和值是android:screenOrientation =&#34; portrait&#34;。 React Native在Android文件夹下的项目目录中生成一个名为AndroidManifest.xml的文件。在标签清单/应用程序/活动下的那个xml文件中,你要添加一行 android:screenOrientation =&#34; portrait&#34;

示例如下所示

<uses-permission android:name="android.permission.INTERNET" />

<application
  android:allowBackup="true"
  android:label="@string/app_name"
  android:icon="@mipmap/ic_launcher"
  android:theme="@style/AppTheme">
  <activity
    android:name=".MainActivity"
    android:label="@string/app_name"
    android:screenOrientation="portrait" 
    android:configChanges="keyboard|keyboardHidden|orientation|screenSize">
    <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
    </intent-filter>
  </activity>
  <activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />
</application>

答案 3 :(得分:14)

哈利莫雷诺的评论是正确的。将其添加到&#39;活动&#39;中的android / app / src / main / AndroidManifest.xml中。部分。也改变

android:configChanges="keyboard|keyboardHidden|orientation|screenSize"

android:configChanges="keyboard|keyboardHidden|screenSize"

删除方向,以免与添加的新行冲突, android:screenOrientation="portrait"

答案 4 :(得分:10)

2017年更新

除了上面发布的解决方案,如果您使用Expo构建应用程序(正如React Native Blog上的官方指南中所推荐的那样),那么您只需在{orientation中设置app.json 1}}到“肖像”或“横向”并使其同时在iOS和Android上运行,无需编辑iOS / Android特定的XML配置文件:

"orientation": "portrait"

示例:

{
  "expo": {
    "name": "My app",
    "slug": "my-app",
    "sdkVersion": "21.0.0",
    "privacy": "public",
    "orientation": "portrait"
  }
}

您也可以在运行时使用它:

ScreenOrientation.allow()

示例:

ScreenOrientation.allow(ScreenOrientation.Orientation.PORTRAIT);

更多详情:

有关详细信息,请参阅: 的 how to disable rotation in React Native?

答案 5 :(得分:4)

您可以通过在ReactApplication类中添加生命周期回调来简单地使用逻辑:

public class MyApplication extends Application{

@Override
    public void onCreate() {
        super.onCreate();  

  registerActivityLifecycleCallbacks(new ActivityLifecycleCallbacks() {
            @Override
            public void onActivityCreated(Activity activity, Bundle bundle) {
                // Here we specify to force portrait at each start of any Activity
                activity.setRequestedOrientation(
                        ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);

            }

            @Override
            public void onActivityStarted(Activity activity) {

            }

            @Override
            public void onActivityResumed(Activity activity) {

            }

            @Override
            public void onActivityPaused(Activity activity) {

            }

            @Override
            public void onActivityStopped(Activity activity) {

            }

            @Override
            public void onActivitySaveInstanceState(Activity activity, Bundle bundle) {

            }

            @Override
            public void onActivityDestroyed(Activity activity) {

            }
        });
}

因此,您不需要配置AndroidManifest

答案 6 :(得分:2)

如果您使用的是react-native-navigation,那么可接受的答案将无效。改用它:

Navigation.setDefaultOptions({
    layout: {
        orientation: ["portrait"],
    },
});

检查文档here

答案 7 :(得分:0)

只需打开您的android/app/src/main/AndroidManifest.xml

并添加此行android:screenOrientation="portrait"android:configChanges="keyboard|keyboardHidden|orientation|screenSize 内部活动部分

看起来像这样

 <activity
      android:name=".Activity"
      android:theme="@style/SplashTheme"
      android:label="@string/app_name"
      android:screenOrientation="portrait"
      android:configChanges="keyboard|keyboardHidden|orientation|screenSize">
     .....your other stuff
 </activity>

如果它不起作用,则可以使用 react-native-orientation

答案 8 :(得分:0)

对于 React Native Navigation,它可以通过定义方向来修复 here:

Navigation.setDefaultOptions({
  layout: {
    orientation: ['portrait']
  }
});