How to set and lock screen orientation on-demand in Flutter

在Flutter中，控制应用的屏幕方向主要通过使用 SystemChrome类实现，该类属于 flutter/services.dart包中的一部分。您可以在应用的任何位置设置屏幕方向，通常在应用启动时或某个特定页面初始化时设置。

如何设置屏幕方向

首先，要设置屏幕方向，您需要在应用的 main()函数或页面的 initState()方法中调用 SystemChrome.setPreferredOrientations()方法。例如，如果您希望您的应用只支持竖屏模式，可以这样做：

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

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

这段代码确保在应用启动前设置了屏幕方向，避免了可能出现的屏幕方向突变。

如何锁定屏幕方向

锁定屏幕方向通常意味着在应用的某个特定页面需要固定的屏幕方向。例如，在一个视频播放页面，您可能希望锁定为横屏。这可以在页面的 initState()方法中设置，如下所示：

dart
@override
void initState() {
  super.initState();
  SystemChrome.setPreferredOrientations([
    DeviceOrientation.landscapeRight,
    DeviceOrientation.landscapeLeft,
  ]);
}

@override
void dispose() {
  // 当离开页面时，恢复到可自由旋转的状态
  SystemChrome.setPreferredOrientations([
    DeviceOrientation.portraitUp,
    DeviceOrientation.portraitDown,
    DeviceOrientation.landscapeRight,
    DeviceOrientation.landscapeLeft,
  ]);
  super.dispose();
}

这样，当用户进入该页面时，屏幕自动切换到横屏模式；当用户离开页面时，屏幕方向设置会恢复到默认状态，允许用户自由旋转屏幕。

实际案例

在我的一个项目中，我们开发了一个媒体播放应用，用户在观看视频时通常倾向于使用横屏模式。因此，在视频播放页面，我们锁定了横屏模式，以优化用户的观看体验。同时，在其他如设置或用户信息页面，我们允许屏幕自由旋转，以便用户在不同情况下使用。

通过这种方式，我们有效地控制了应用的屏幕方向，使用户体验更加友好和直观。