При разработке мобильных приложений обычно предъявляются особые требования к ориентации пользовательского интерфейса. В этой статье мы рассмотрим различные методы обеспечения только портретной ориентации в приложениях Flutter. Мы рассмотрим несколько подходов и приведем примеры кода, чтобы помочь вам легко выполнить это требование.
Метод 1: использование SystemChrome
Flutter предоставляет класс SystemChrome, который позволяет нам управлять настройками приложения на системном уровне, включая ориентацию. Мы можем использовать метод SystemChrome.setPreferredOrientations, чтобы обеспечить только портретную ориентацию. Вот пример:
import 'package:flutter/services.dart';
void main() {
WidgetsFlutterBinding.ensureInitialized();
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
DeviceOrientation.portraitDown,
]);
runApp(MyApp());
}
Метод 2: использование OrientationBuilder
Виджет OrientationBuilder во Flutter перестраивает свои дочерние виджеты при изменении ориентации устройства. Мы можем использовать этот виджет для обеспечения портретного режима путем условного рендеринга пользовательского интерфейса на основе текущей ориентации. Вот пример:
import 'package:flutter/material.dart';
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: OrientationBuilder(
builder: (context, orientation) {
if (orientation == Orientation.portrait) {
return PortraitScreen();
} else {
return LandscapeScreen();
}
},
),
);
}
}
Метод 3: использование DeviceOrientation
Класс DeviceOrientation во Flutter предоставляет информацию о текущей ориентации устройства. Мы можем использовать этот класс для прослушивания изменений ориентации и программного обеспечения портретного режима. Вот пример:
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
DeviceOrientation _currentOrientation;
@override
void initState() {
super.initState();
_initOrientationListener();
}
Future<void> _initOrientationListener() async {
await SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
DeviceOrientation.portraitDown,
]);
SystemChannels.lifecycle.setMessageHandler((msg) {
if (msg == AppLifecycleState.resumed.toString()) {
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
DeviceOrientation.portraitDown,
]);
}
return null;
});
SystemChrome.setPreferredOrientations([
DeviceOrientation.portraitUp,
DeviceOrientation.portraitDown,
]);
}
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Container(),
);
}
}
Обеспечить только книжную ориентацию во Flutter можно различными способами. В этой статье мы рассмотрели три различных подхода, используя SystemChrome, OrientationBuilderи DeviceOrientation. Внедрив один из этих методов, вы можете гарантировать, что пользовательский интерфейс вашего приложения останется в портретном режиме, обеспечивая единообразный пользовательский интерфейс.
Не забудьте учесть конкретные требования вашего приложения и выбрать метод, который лучше всего соответствует вашим потребностям. Приятного кодирования!