Restringir el modo horizontal en Flutter

En este artículo, aprenderemos cómo restringir el modo horizontal en la aplicación Flutter. Una aplicación lista para producción debe estar libre de todo tipo de errores y fallas. Principalmente, diseñamos nuestra aplicación para orientación vertical, si cambiamos a orientación horizontal, es posible que la interfaz de usuario no se ajuste para eso. Entonces, hay dos casos, el primero es que su aplicación se puede ajustar para la orientación horizontal y el segundo es que su aplicación podría no requerir la orientación horizontal. Entonces, en el segundo caso, podemos restringir la orientación horizontal. Esto se puede hacer usando la clase SystemChrome predeterminada . Esta clase tiene un método setPreferredOrientations, que toma una lista de orientaciones de dispositivos que deben implementarse en la aplicación. 

Orientaciones disponibles:

  • paisajeIzquierda
  • paisajeDerecha
  • retratoabajo
  • retratoArriba
Syntax: SystemChrome.setPreferredOrientations([DeviceOrientation.yourChoice])

Aquí, SystemChrome es la clase predeterminada que controla muchas funciones del dispositivo. Esta clase tiene el método s etPreferredOrientations que toma una lista de tipo DeviceOrientation y las orientaciones preferidas se le pueden pasar como una lista .

Ejemplo:

Dart

import 'package:flutter/material.dart';
import 'package:flutter/services.dart'; //For using SystemChrome
  
void main() {
  WidgetsFlutterBinding.ensureInitialized();
  SystemChrome.setPreferredOrientations(
    [DeviceOrientation.portraitUp]);
  runApp(MyApp());
}
  
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: Text('This app can\'t be rotated to Landscape mode',
              style: TextStyle(color: Colors.green, 
                fontSize: 17),
          ),
        ),
      ),
    );
  }
}

Producción:

lanscape mode in flutter

La aplicación de salida, como se muestra arriba, estaría restringida solo al modo vertical. Incluso si gira el dispositivo, no cambiará al modo horizontal. 

Puntos para recordar:

  • No olvides incluir import ‘package:flutter/services.dart’; como SystemChrome se define en el archivo services.dart.
  • También agregue WidgetsFlutterBinding.ensureInitialized(); antes de usar la clase SystemChrome. Si no agrega esta línea de código, es posible que la restricción de orientación no funcione en algunos dispositivos. En versiones más nuevas de Flutter, se requiere agregar este método.
  • Si su dispositivo de destino es un iPad, entonces el código anterior solo funcionaría si la multitarea está deshabilitada.
  • Para resolver este problema, puede cancelar la multitarea en iPad, luego el código anterior funcionaría, pero su aplicación no admitiría la multitarea Slide Over y Split View.
  • Si decide optar por no participar en la multitarea, puede hacerlo cambiando la configuración «Requiere pantalla completa» a verdadero en la información de implementación de Xcode.

Publicación traducida automáticamente

Artículo escrito por tejinder2000 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *