Flutter页面切换后横屏自动切回竖屏问题咨询

这个问题的核心出在两个关键细节上：

1. 错误的生命周期方法选择：你在ScreenBoard的build方法里调用forceLandscape()，但build方法会被Flutter框架频繁触发（比如UI更新、状态变化、路由栈变动等），异步的屏幕方向设置和框架的UI渲染时序很容易产生冲突。
2. 主页面的方向设置残留影响：主菜单页面设置了强制竖屏后，它仍然存在于路由栈中（并没有被销毁）。如果主菜单的forcePortrait()是在build方法里调用的，当路由跳转后框架触发主菜单页面的widget重建时，它会再次执行竖屏设置，把屏幕强行切回竖屏状态。

1. 将屏幕方向设置移到正确的生命周期方法 #

把forceLandscape()移到ScreenBoard的initState方法里，这个方法只会在widget初始化时执行一次，能避免重复调用导致的冲突；同时在页面销毁时恢复竖屏，避免影响后续跳转的页面：

class _ScreenBoardState extends State<ScreenBoard> {
  @override
  void initState() {
    super.initState();
    // 初始化时仅执行一次横屏设置
    UScreen.forceLandscape();
  }

  @override
  void dispose() {
    // 页面销毁时恢复竖屏，避免影响其他页面
    UScreen.forcePortrait();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: AppColors.redBckgnd,
      body: Container(),
    );
  }
}

2. 修正主菜单页面的竖屏设置 #

同样，主菜单页面的forcePortrait()也不应该放在build方法里，移到initState中确保只执行一次：

// 主菜单页面的State示例
class _MainMenuState extends State<MainMenu> {
  @override
  void initState() {
    super.initState();
    UScreen.forcePortrait();
  }

  @override
  Widget build(BuildContext context) {
    // 仅在这里构建UI，不要放置方向设置逻辑
    return Scaffold(...);
  }
}

3. 优化屏幕方向工具方法 #

确保工具方法正确返回Future，明确异步操作的完成时机：

static Future<void> forcePortrait() async {
  await SystemChrome.setPreferredOrientations([
    DeviceOrientation.portraitUp,
    DeviceOrientation.portraitDown,
  ]);
}

static Future<void> forceLandscape() async {
  await SystemChrome.setPreferredOrientations([
    DeviceOrientation.landscapeLeft,
    DeviceOrientation.landscapeRight,
  ]);
}

因为没有了主页面的竖屏设置在后台“偷偷”触发，ScreenBoard的build方法即使多次调用forceLandscape()，也不会有反向的设置冲突，但这只是治标不治本，规范生命周期方法的使用才是长期可靠的解决方案。

内容的提问来源于stack exchange，提问作者AndreiBogdan