Flutter中如何禁止指定Widget跟随屏幕旋转

不需要第三方依赖，可以实现。全局保持自动横竖屏切换的配置不变，仅对扫码组件做旋转补偿即可，不会影响其他组件的正常旋转适配。

Flutter的屏幕旋转本质是渲染树整体跟随设备方向做角度调整，我们只需要在目标组件外层套一层反向旋转的容器，抵消系统自动旋转带来的角度偏移，就能让该组件始终保持竖屏（或你需要的固定方向）显示。

• 保留应用全局的自动旋转配置，不要修改SystemChrome.setPreferredOrientations的全局横竖屏允许设置，保证其他页面/组件的旋转逻辑不受影响
• 在扫码组件的父节点使用OrientationBuilder监听当前屏幕方向变化
• 结合MediaQuery获取设备实际旋转角度，通过RotatedBox给扫码组件传入对应反向旋转值，抵消系统旋转效果
• 若旋转后出现组件拉伸、裁切问题，在外层补充固定宽高比的约束即可

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(title: const Text('二维码扫描')),
    body: Center(
      child: OrientationBuilder(
        builder: (context, orientation) {
          int rotateQuarter = 0;
          // 横屏状态下计算反向补偿角度，取值为0/1/2/3 分别对应0°/90°/180°/270°
          if (orientation == Orientation.landscape) {
            // 区分左横屏、右横屏场景，可根据实际扫码组件的偏移情况微调取值
            rotateQuarter = View.of(context).physicalSize.width > View.of(context).physicalSize.height ? 1 : 3;
          }
          return RotatedBox(
            quarterTurns: rotateQuarter,
            // 替换为项目中实际使用的QR Scanner组件
            child: SizedBox(
              width: 300,
              height: 300,
              child: const QrScannerWidget(),
            ),
          );
        },
      ),
    ),
  );
}

• 部分基于平台原生视图实现的扫码组件，可能存在原生层自带旋转适配的情况，若补偿后角度不对，依次测试rotateQuarter的四个取值即可找到正确的补偿角度，不需要修改原生层代码
• 若扫码组件带有闪光灯切换、扫码结果蒙层等附属UI，把这些附属UI和扫码组件放在同一个RotatedBox子节点下即可，保证附属UI和扫码区域方向一致
• 该方案是纯渲染层的方向锁定，不会修改系统的屏幕方向设置，退出扫码页面后所有组件自动恢复正常的旋转适配逻辑，不需要手动做状态重置

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