web-dev-qa-db-ja.com

React Native Android devモードでランドスケープモードを無効にする方法

私はAndroid環境に不慣れです。 iOSをXcodeで実行して、デバイスの向きを無効にできることを知っています。 React Native Androidでランドスケープモードまたは方向モードを無効にするにはどうすればよいですか？

ありがとう。

androidreact-nativereact-native-android
61
sungl

Android:screenOrientation="portrait"をAndroid/app/src/main/AndroidManifest.xmlファイルのactivityセクションに追加して、次のようにします。

<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

109
Gem Ubaldo

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

Android:screenOrientation="portrait"をアクティビティXMLに追加します

44
Harry Moreno

@ morenoh149で前述したように、これを行うためのプロパティ名と値はAndroid：screenOrientation = "portrait"です。 React Nativeは、プロジェクトディレクトリのAndroidフォルダーの下にAndroidManifest.xmlというファイルを生成します。マニフェスト/アプリケーション/アクティビティタグの下のそのxmlファイル内に、行Android：screenOrientation = "portrait"を追加します。

以下に例を示します

<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>
25
bret

ハリー・モレノのコメントは正しいです。 「アクティビティ」セクションのAndroid/app/src/main/AndroidManifest.xmlに追加します。また変更

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

Android:configChanges="keyboard|keyboardHidden|screenSize"へ

追加された新しい行と競合しないように方向を削除する、Android:screenOrientation="portrait"

14
mixophrygian

2017アップデート

Expoを使用してアプリを構築している場合（上記の公式ガイドで推奨されているように React Native Blog ）、上記のソリューションに加えて、必要なのはorientationを設定することですapp.jsonを "portrait"または "landscape"に変更し、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);

詳細：

詳細については、次を参照してください：React Nativeで回転を無効にする方法

10
rsp

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を構成する必要はありません。

4
odemolliens

react-native-navigationを使用している場合、受け入れられた答えは機能しません。代わりにこれを使用してください：

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

ドキュメントを確認してください こちら 。

3
romin21