flutter 强制横屏,控制横竖屏显示

2021-12-30  本文已影响0人  微风_10a5

今天 我们的主题是控制手机横竖屏显示
需求很明确,整个app都是竖屏显示,但某一个页面需要横竖屏显示

1.进入app,就是竖屏显示,不能自动横屏
2.进入某个页面,可以自由控制横竖屏显示,退出这个页面,又回到竖屏

最终效果如下:

screen2.gif
下面进入实战环节

经过填坑的过程,现把关键代码放下面
进入app,就设置整个app为竖屏显示

void main() {
  WidgetsFlutterBinding.ensureInitialized(); //不加这个强制横/竖屏会报错
  SystemChrome.setPreferredOrientations([
    // 强制竖屏
    DeviceOrientation.portraitUp,
    DeviceOrientation.portraitDown
  ]);
  runApp(const DemoApp());
}

WidgetsFlutterBinding.ensureInitialized();这行代码一定要写,要不然就报错,而且设置也无效

当进入某个页面时控制横竖屏显示

强制竖屏,代码如下:

    // 强制竖屏
    SystemChrome.setPreferredOrientations([
      DeviceOrientation.portraitUp,
      DeviceOrientation.portraitDown
    ]);

强制横屏,代码如下:

   // 强制横屏
   SystemChrome.setPreferredOrientations([
     DeviceOrientation.landscapeLeft,
     DeviceOrientation.landscapeRight
   ]);

退出这个页面时,恢复竖屏显示,代码如下:

  @override
  void dispose() {
    // 强制竖屏
    SystemChrome.setPreferredOrientations([
      DeviceOrientation.portraitUp,
      DeviceOrientation.portraitDown
    ]);
    super.dispose();
  }

结尾

2021年最后一次分享喽,小伴们,觉得有点用的话,或者已经看到这里面来的请点赞加关注吧~~ 后续分享更多有关flutter的文章。如果有疑问的话,请在下方留言~

上一篇 下一篇

猜你喜欢

热点阅读