Я бы хотел, чтобы мое приложение не меняло ориентацию и заставляло макет придерживаться «портретной» ориентации.

В main.dart я поставил:

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

но когда я использую кнопки поворота Android Simulator, макет "следует" за новой ориентацией устройства ...

Как я могу это решить?

Спасибо

boeledi

Ответов: 20

Ответы (20)

Импорт пакет: flutter / services.dart, затем

Поместите SystemChrome.setPreferredOrientations в метод Widget build ().

Пример:

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

Обновить

Это решение может не работать для некоторых устройств IOS, как указано в обновленной документации по флаттеру от октября 2019 г.

Советуют зафиксировать ориентацию, установив UISupportedInterfaceOrientations в Info.plist вот так


    UIInterfaceOrientationPortrait

Для получения дополнительной информации https://github.com/flutter/flutter/issues/27235#issuecomment-508995063

Прежде всего, импортируйте это в main.dart файл

import 'package:flutter/services.dart';

Тогда не копируйте вставку лучше посмотрите (запомните) и напишите ниже код в main.dart file

Принудительный режим портрет:

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

Принудительный режим альбомный:

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

setPreferredOrientation возвращает Future , поэтому он является асинхронным. Самый читаемый подход - определить main как асинхронный:

Future  main () async {
  ждать SystemChrome.setPreferredOrientations ([DeviceOrientation.portraitUp]);
  return runApp (новый MyApp ());
}

Попробуйте

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

Вы также можете изменить настройки ориентации экрана в манифесте android и в файле ios info.plist.

Импорт import 'package: flutter / services.dart';

Затем вы включаете строку кода ниже в свой файл main.dart и в свой основной метод, например, так:

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

runApp(myApp());

Можно включить опцию требуется полноэкранный режим в случае iOS.

void main() async {
      WidgetsFlutterBinding.ensureInitialized();
      SystemChrome.setPreferredOrientations([
        DeviceOrientation.landscapeRight,
        DeviceOrientation.landscapeLeft,
      ]).then((_) {
        runApp(MediaQuery(
            data: MediaQueryData(),
            child:
                MaterialApp(debugShowCheckedModeBanner: false, home: LoginPage())));
      });
    }

enter image description here

Это простой способ ->

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

Для людей, которые сейчас читают этот вопрос. Самый простой способ, который я нашел, и он работал как на устройствах Android, так и на iOS.

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

Если вы редактируете это из интерфейса xcode, оно не будет изменено для ipad. Для раздела ipad необходимо отредактировать файл info.plist из студии android. Вы можете увидеть в списке массивов вот такое "~ ipad". В info.plist доступны два раздела, вы должны вручную отредактировать его как для iphone, так и для ipad.

Поместите WidgetsFlutterBinding.ensureInitialized () иначе вы получите ошибку при сборке.

import 'package:flutter/services.dart';

    void main() async => {
          WidgetsFlutterBinding.ensureInitialized();
          await SystemChrome.setPreferredOrientations(
              [DeviceOrientation.portraitUp],
          ); // To turn off landscape mode
          runApp(MainApp());
        };

Ниже приведен официальный пример команды 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());
}

Чтобы SystemChrome.setPreferredOrientations работал на iPad, включите «Требуется полноэкранный режим» в редакторе проекта Xcode или просто добавьте следующие строки в /ios/Runner/Info.plist в папке вашего проекта.

UIRequiresFullScreen

@ boeledi, Если вы хотите «заблокировать» ориентацию устройства и не позволять ей изменяться, когда пользователь поворачивает свой телефон, это было легко установить, как показано ниже,

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

Вам нужно подождать, пока setPreferredOrientations не будет выполнено, а затем запустить приложение

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

Просто добавьте следующую строку кода в файл main.dart.

SystemChrome.setPreferredOrientations([
  DeviceOrientation.portraitUp,
]);

и не забудьте импортировать файл services.dart. Пример приведен ниже!

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() {
    runApp(MyApp());
}


class MyApp extends StatelessWidget {
     @override
     Widget build(BuildContext context) {

      SystemChrome.setPreferredOrientations([
        DeviceOrientation.portraitUp,
      ]);

      return MaterialApp(
        home: Scaffold(
          body: Center(child: Text("A Flutter Example!")),
     ),
   );
  }
}

В новых версиях флаттера вместе с установкой предпочтительной ориентации нам нужно добавить одну дополнительную строку, т.е.

 WidgetsFlutterBinding.ensureInitialized();

Итак, рабочий код для этого -

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

Метод setPreferredOrientations возвращает объект Future. Согласно документации, будущее представляет собой некоторую ценность, которая будет доступна где-то в будущем. Вот почему вы должны дождаться, пока он станет доступен, а затем продолжить работу с приложением. Следовательно, должен использоваться метод then, который, по определению, «регистрирует обратные вызовы, которые будут вызываться после завершения Future». Следовательно, вы должны использовать этот код:

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

Также необходимо импортировать следующий файл:

'пакет: flutter / services.dart'

Откройте android / app / src / main / AndroidManifest.xml и добавьте следующую строку в MainActivity:

android:screenOrientation="portrait"

Если у вас есть:


У вас должно получиться что-то вроде этого:


Работает на Android. В iOS вам нужно будет изменить это на странице Xcode: https://i.stack.imgur.com/hswoe.png (как сказал Хиджази)

iOS:

Вызов SystemChrome.setPreferredOrientations () у меня не работает, и мне пришлось изменить ориентацию устройства в проекте Xcode следующим образом:

enter image description here

Android:

Установите для атрибута screenOrientation значение portrait для основного действия в файле android / app / src / main / AndroidManifest.xml следующим образом:

enter image description here

У вас есть два варианта для android

1. Записать на главную

    main() {
      WidgetsFlutterBinding.ensureInitialized();
      SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp])
          .then((_) {
        runApp(
          child: MyApp(),
        );
      });
}

2. Установить изначально на AndroidManifest.xml файл enter image description here

У вас также есть два варианта для iOS

1. из info.plist

добавьте эту строку в свой info.plist файл


    UIInterfaceOrientationPortrait

2. от Бегуна откройте свой Runner.xcworkspace из папки iOS на вашем Xcode. Щелкните Runner not Pods. Вы можете найти эту опцию в Общие> Информация о развертывании. просто проверьте, что вы хотите enter image description here

Это решение сработало для меня в двух разных проектах для Android. Не могу гарантировать, что он будет работать и на iOS. Я прочитал все предыдущие ответы и считаю, что лучшим и самым простым решением будет сделать это так:

Android:

Таким образом вы избегаете всех "await", "async" и "then", которые могут испортить ваш код

/// это в main.dart

главный(){
  WidgetsFlutterBinding.ensureInitialized ();

  runApp (
    MaterialApp (
      initialRoute: '/ root',
      routes: {
        '/ корень': (контекст) => MyApp (),
      },
      title: "Название вашего приложения",
    ),
  );
}

class MyApp extends StatelessWidget {
  @override
  Сборка виджета (контекст BuildContext) {
    /// ТОЛЬКО ПОРТРЕТ ОРИЕНТАЦИИ УСТРОЙСТВА
    SystemChrome.setPreferredOrientations ([
      DeviceOrientation.portraitUp,
      DeviceOrientation.portraitDown
    ]);

    /// ЗАПУСК ПРИЛОЖЕНИЯ
    вернуть MaterialApp (
      главная: HomeScreen (),
    );
  }
}

iOS:

Думаю, это обновление ответа - ваш лучший выбор для iOS.

!! ОТКАЗ !! Я провел небольшое исследование и, по-видимому, документация здесь конкретно говорит:

setPreferredOrientations method Limitations:

"This setting will only be respected on iPad if multitasking is disabled."

Здесь - это то, как вы можете отключить многозадачность (AKA включите опцию «Требуется полноэкранный режим») из XCode

Еще одно возможное исправление для iOS

Вы также можете попробовать вот этот. Лично я не пробовал, так как на моем компьютере нет iPad или XCode, но попробовать стоит

2022 WebDevInsider