¿Cómo deshabilitar el modo horizontal en el modo dev Android nativo de React?


Soy nuevo en el entorno Android. Sé que iOS se puede hacer en Xcode para deshabilitar la orientación del dispositivo. ¿Cómo puedo desactivar el modo horizontal o cualquier modo de orientación en React Native Android?

Gracias.

Author: Cherniv, 2015-12-04

6 answers

Agregue android:screenOrientation="portrait" a la sección activity en el archivo android/app/src/main/AndroidManifest.xml, de modo que se vea así:

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

Hay varios valores diferentes para la propiedad android:screenOrientation; para obtener una lista completa, eche un vistazo a lo siguiente: https://developer.android.com/guide/topics/manifest/activity-element.html

 91
Author: Gem Ubaldo,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-09-29 20:56:42

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

Añade android:screenOrientation="portrait" a tu actividad xml

 42
Author: Harry Moreno,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-12-31 16:36:43

Como @morenoh149 indica arriba, el nombre de la propiedad y el valor para hacer esto es android:screenOrientation="portrait". React Native genera un archivo llamado AndroidManifest.xml en el directorio del proyecto en la carpeta de Android. Dentro de ese archivo xml bajo la etiqueta manifest/application/activity agregarías la línea android: screenOrientation="portrait"

A continuación se muestra un ejemplo

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

 21
Author: bret,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-04-18 15:04:47

El comentario de Harry Moreno es correcto. Añadir a android/app/src/main/AndroidManifest.xml en la sección' actividad'. También cambiar

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

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

Eliminando la orientación para que no entre en conflicto con la nueva línea añadida, android:screenOrientation="portrait"

 12
Author: mixophrygian,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-08-01 01:35:24

Actualización de 2017

Además de las soluciones publicadas anteriormente, si está utilizando Expo para crear su aplicación (como se recomienda actualmente en las guías oficiales de React Native Blog), todo lo que necesita es configurar orientation en app.json a "retrato" o "paisaje" y hacer que funcione tanto en iOS como en Android al mismo tiempo sin necesidad de editar archivos de configuración XML específicos de iOS/Android:

"orientation": "portrait"

Ejemplo:

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

También puede usar esto en tiempo de ejecución:

ScreenOrientation.allow()

Ejemplo:

ScreenOrientation.allow(ScreenOrientation.Orientation.PORTRAIT);

Más detalles:

Para más información ver: ¿cómo deshabilitar la rotación en React Native?

 7
Author: rsp,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-10-13 12:39:28

Puede simplemente la lógica agregando una devolución de llamada de ciclo de vida en la clase 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) {

            }
        });
}

Así que no es necesario configurar AndroidManifest

 3
Author: odemolliens,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-03-27 06:20:57