Flutter: jak zapobiec zmianom orientacji urządzenia i wymusić portret?

Chciałbym uniemożliwić mojej aplikacji zmianę orientacji i zmusić układ do trzymania się „portretu”.

W main.dart umieściłem:

void main(){
  SystemChrome.setPreferredOrientations([
    DeviceOrientation.portraitUp,
    DeviceOrientation.portraitDown
  ]);
  runApp(new MyApp());
}

ale kiedy używam przycisków obracania symulatora Androida, układ „podąża” za nową orientacją urządzenia ...

Jak mogłem to rozwiązać?

Dzięki

Import package:flutter/services.dart, a następnie

Umieść metodę SystemChrome.setPreferredOrientationswewnątrz Widget build().

Przykład:

  class MyApp extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      SystemChrome.setPreferredOrientations([
        DeviceOrientation.portraitUp,
        DeviceOrientation.portraitDown,
      ]);
      return new MaterialApp(...);
    }
  }

Aktualizacja

To rozwiązanie może nie działać w przypadku niektórych urządzeń z systemem IOS, jak wspomniano w zaktualizowanej dokumentacji fluttera z października 2019 r.

Zalecają ustalenie orientacji, ustawiając UISupportedInterfaceOrientations w Info.plist w ten sposób

<array>
    <string>UIInterfaceOrientationPortrait</string>
</array>

Aby uzyskać więcej informacji, https://github.com/flutter/flutter/issues/27235#issuecomment-508995063

@boeledi, Jeśli chcesz „zablokować” orientację urządzenia i nie pozwolić na jej zmianę, gdy użytkownik obraca telefon, można to łatwo ustawić jak poniżej,

// This did not work as requirement
void main() {
  SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]);
  runApp(new MyApp());
}

Musisz poczekać, aż setPreferredOrientationssię skończy, a następnie uruchomić aplikację

// This will works always for lock screen Orientation.
void main() {
  WidgetsFlutterBinding.ensureInitialized();
  SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp])
    .then((_) {
      runApp(new MyApp());
    });
}

iOS:

Wywołanie SystemChrome.setPreferredOrientations()nie działa dla mnie i musiałem zmienić Device Orientationw projekcie Xcode w następujący sposób:

Android:

Ustaw screenOrientationatrybut na portraitdla głównego działania w pliku android/app/src/main/AndroidManifest.xmlw następujący sposób:

Metoda „setPreferredOrientations” zwraca obiekt Future. Według dokumentacji przyszłość reprezentuje pewną wartość, która będzie dostępna gdzieś w przyszłości. Dlatego należy poczekać, aż będzie dostępny, a następnie przejść do aplikacji. W związku z tym powinna zostać użyta metoda „then”, która zgodnie z definicją „rejestruje wywołania zwrotne, które zostaną wywołane, gdy Future się zakończy”. Dlatego powinieneś użyć tego kodu:

  void main() {
  SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]).then((_) {
      runApp(new App());
    });
   }

Należy również zaimportować następujący plik:

„package: flutter / services.dart”

Otwórz android / app / src / main / AndroidManifest.xml i dodaj następujący wiersz w MainActivity:

android:screenOrientation="portrait"

Jeśli masz to:

<activity
        android:name=".MainActivity"
        android:launchMode="singleTop"
        android:theme="@style/LaunchTheme"
        android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
        android:hardwareAccelerated="true"
        android:windowSoftInputMode="adjustResize">

Powinieneś otrzymać coś takiego:

<activity
        android:name=".MainActivity"
        android:launchMode="singleTop"
        android:theme="@style/LaunchTheme"
        android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
        android:hardwareAccelerated="true"
        android:screenOrientation="portrait"
        android:windowSoftInputMode="adjustResize">

Działa to na Androida. W iOS będziesz musiał to zmienić na stronie Xcode: https://i.stack.imgur.com/hswoe.png (jak powiedział Hejazi)

Przede wszystkim zaimportuj to do pliku main.dart

import 'package:flutter/services.dart';

Następnie nie kopiuj wklejania, a zobacz (pamiętaj) i napisz poniższy kod w pliku main.dart

Aby wymusić tryb portretowy :

void main() {
  SystemChrome.setPreferredOrientations(
      [DeviceOrientation.portraitUp,DeviceOrientation.portraitDown])
      .then((_) => runApp(MyApp()),
  );

Aby wymusić w trybie poziomym :

   void main() {
      SystemChrome.setPreferredOrientations(
          [DeviceOrientation.landscapeLeft,DeviceOrientation.landscapeRight])
          .then((_) => runApp(MyApp()),
      );

Umieść WidgetsFlutterBinding.ensureInitialized (), w przeciwnym razie wystąpi błąd podczas budowania.

import 'package:flutter/services.dart';

    void main() async => {
          WidgetsFlutterBinding.ensureInitialized(),

          await SystemChrome.setPreferredOrientations(
              [DeviceOrientation.portraitUp]), // To turn off landscape mode

          runApp(MainApp())
        };

setPreferredOrientationzwraca a Future<void>, więc jest asynchroniczna. Najbardziej czytelnym podejściem jest zdefiniowanie mainjako asynchroniczne:

Future<void> main() async {
  await SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]);
  return runApp(new MyApp());
}

Od nowych wersji fluttera wraz z ustawieniem preferred Orientationmusimy dodać jedną dodatkową linię tj

 WidgetsFlutterBinding.ensureInitialized();

Tak więc działający kod to -

import 'package:flutter/services.dart';
    void main() {
          WidgetsFlutterBinding.ensureInitialized();
          SystemChrome.setPreferredOrientations([
            DeviceOrientation.portraitUp,
            DeviceOrientation.portraitDown
          ]);
          runApp(MyApp());
        }

Poniżej znajduje się oficjalny przykład zespołu flutter. https://github.com/flutter/samples/blob/master/veggieseasons/lib/main.dart

import 'package:flutter/services.dart' show DeviceOrientation, SystemChrome;

void main() {
    WidgetsFlutterBinding.ensureInitialized();
    SystemChrome.setPreferredOrientations([
        DeviceOrientation.portraitUp,
        DeviceOrientation.portraitDown,
    ]);
    runApp(HomeScreen());
}

Próbować

 void main() async {
      WidgetsFlutterBinding.ensureInitialized();
      await SystemChrome.setPreferredOrientations(
          [DeviceOrientation.portraitUp, DeviceOrientation.portraitDown]); 
    
      runApp(MyApp());
 }

Możesz także zmienić ustawienia orientacji ekranu w manifeście systemu Android i pliku info.plist systemu iOS.

Import import 'pakiet: flutter / services.dart';

Następnie umieść poniższy wiersz kodu w pliku main.dart oraz w swojej głównej metodzie, tak jak poniżej:

WidgetsFlutterBinding.ensureInitialized();
  SystemChrome.setPreferredOrientations([
    DeviceOrientation.portraitDown,
    DeviceOrientation.portraitUp,
  ]);

runApp(myApp());

Najlepszym rozwiązaniem będzie użycie go w metodzie kompilacji MyApp ().