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

在Flutter中,针对iOS设备,`SystemChrome.setPreferredOrientations`无法直接强制改变屏幕方向,而是一个设置应用支持方向的标志。文章介绍了通过创建自定义插件,桥接iOS原生代码来实现强制横屏,并详细讲解了设置应用支持方向、编写插件、注册及使用插件的步骤,以解决特定页面横屏的需求。同时,文中也提及了在实践中遇到的问题及解决策略。
摘要由CSDN通过智能技术生成

转载请标明出处: 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 和 <

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值