Flutter 特定页面切换屏幕方向/iOS强制横屏/SystemChrome.setPreferredOrientations不起作用 看这里!...

转载请标明出处： juejin.im/post/5c68da…
本文出自：Wos的主页

我此刻的Flutter版本:

Flutter 1.2.0 • channel dev • github.com/flutter/flu…
Framework • revision 06b979c4d5 (3 weeks ago) • 2019-01-25 14:27:35 -0500
Engine • revision 36acd02c94
Tools • Dart 2.1.1 (build 2.1.1-dev.3.2 f4afaee422)

特定页面旋转屏幕很简单:

SystemChrome.setPreferredOrientations([
  ...
]);
复制代码

数组中是您要支持的屏幕方向.

如果想在特定页面固定横屏, 您可以这样写:

@override
void initState() {
  super.initState();
  SystemChrome.setPreferredOrientations([
    DeviceOrientation.landscapeRight,
    DeviceOrientation.landscapeRight,
  ]);
}
复制代码

并且在dispose时更改回竖屏

@override
void dispose() {
  SystemChrome.setPreferredOrientations([
    DeviceOrientation.portraitUp,
  ]);
  super.dispose();
}
复制代码

但是!!! 不要走开 本文重点在下面

在Android设备上, 调用此方法可以强制改变屏幕方向. 但在iOS上却不是这样

对于iOS, 这个方法表示设置应用支持的屏幕方向, 只有在物理方向改变时才会改变屏幕方向

现在看起来, 这应该是一个Flutter的一个Bug. 有待官方解决

您可关注 issue #13238 追踪Flutter官方的最新更新

强制改变布局方向

既然 Flutter 提供的方法不能强制改变屏幕方向, 那么我们可以通过插件的形式, 桥接到iOS原生代码中, 通过原生方式改变屏幕方向.

设置应用支持的布局方向

通过Xcode打开Flutter项目中的iOS工程, 根据下图找到Device Orientation 这一项 勾选需要支持的布局方向, 通过这一步, 默认你现在的应用已经会根据设备的方向转变布局了

编写插件

展开 Runner/Runner文件夹 右键->New File 添加两个新的OC文件 FlutterIOSDevicePlugin.m 和 FlutterIOSDevicePlugin.h (叫