Flutter横屏实践

news2024/11/17 23:28:41

在这里插入图片描述

1、Flutter设置横屏

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

另外建议

1、把所有横竖屏调用封装到一个方法中,便于维护

2、开启放super后面,关闭放super前面


void initState() {
  super.initState();
  AppUtil().setScreenLandscape(true);
}


void dispose() {
  AppUtil().setScreenLandscape(false);
  super.dispose();
}

2、原生设置横屏

在实践过程中发现ios偶尔有横屏转不过来的现象,如果你也遇到了可以考虑原生设置横屏。

android原生

if (screenLandscape) {
    // 设置屏幕为横向
   activity.setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
} else {
    // 设置屏幕为纵向
    activity.setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
}

如果需要相机、相册等系统应用也能横屏,可以打开允许自动旋转权限

// 检查是否打开自动屏幕旋转
public static boolean checkAutoRotate(Activity activity) {
    // android系统设置权限
    if (!Settings.System.canWrite(activity)) {
        activity.runOnUiThread(() -> Toast.makeText(activity, "请允许修改系统设置权限!", Toast.LENGTH_SHORT).show());
        // 没有系统设置权限 -> 跳转到系统设置页面
        new Thread(() -> {
            try {
                sleep(500);
            } catch (InterruptedException e) {
                throw new RuntimeException(e);
            }
            Intent intent = new Intent(Settings.ACTION_MANAGE_WRITE_SETTINGS);
            intent.setData(Uri.parse("package:" + activity.getPackageName()));
            activity.startActivityForResult(intent, 1);
        }).start();
        return false;
    } else {
        // 有系统设置权限 -> 打开手机屏幕方向自动旋转(参数备注:1为开,0为关)
        Settings.System.putInt(activity.getContentResolver(), Settings.System.ACCELEROMETER_ROTATION, 1);
        return true;
    }
}

ios原生

NSDictionary *dict = call.arguments;
bool screenLandscape = [dict[@"screenLandscape"] boolValue];
UIInterfaceOrientation val = screenLandscape ? UIInterfaceOrientationLandscapeLeft : UIInterfaceOrientationPortrait;
[weakSelf ll_interfaceOrientation:val];
result([JYJUtils dictionaryToJson:@{}]);

3、横竖屏适配

横竖屏适配在flutter端实现,我这里只需要横屏,因此检测到竖屏会再次调用切换横屏

OrientationBuilder(
  builder: (context, orientation) {
    if (orientation == Orientation.portrait) {
      return PortraitPage();
    } else {
      return LandscapePage();
    }
  },
)

// 竖屏
PortraitPage() {
  AppUtil().setScreenLandscape(true);
  return Column(
    mainAxisSize: MainAxisSize.max,
    children: [
      CustomBar(
        title: _titleString(longTitle: true),
      ),
      Expanded(
        child: Center(
          child: Text('请旋转横屏使用'),
        ),
      ),
    ],
  );
}

// 横屏
LandscapePage() {
  final double statusBarHeight =
      Platform.isIOS ? 35 : MediaQuery.of(context).padding.top;
  return Container(
    margin: EdgeInsets.only(top: statusBarHeight, left: 30, right: 30),
  );
}

4、flutter 横屏android没有铺满

Screenshot_20231007_140001

解决办法
打开项目下android/app/src/main/res/values/styles.xml

添加

<item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="LaunchTheme" parent="@android:style/Theme.Light.NoTitleBar">
        <item name="android:windowBackground">@drawable/launch_background</item>
    </style>
    <style name="NormalTheme" parent="@android:style/Theme.Light.NoTitleBar">
        <item name="android:windowBackground">?android:colorBackground</item>
        <item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>
    </style>
</resources>LaunchTheme下为启动页配置,NormalTheme下为普通页面配置

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1066601.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【虹科分享】什么是Redis数据集成(RDI)?

大量的应用程序、日益增长的用户规模、不断扩展的技术需求&#xff0c;以及对即时响应的持续追求。想想这些是否正是你在经历的。也许你尝试过自己构建工具来应对这些需求&#xff0c;但是大量的编码和集成工作使你焦头烂额。那你是否知道&#xff0c;有这样一个工具可以帮助你…

数据结构-图-最小生成树问题

最小生成树 并查集定义举例说明查找某个元素属于哪个集合代码实现路径压缩 Kruskal算法原理代码实现 Prim算法原理代码实现 并查集 定义 &#x1f680;在一些应用问题中&#xff0c;需要将n个不同的元素分成一些不相交的集合。开始时&#xff0c;每个元素自成一个单元素集合&…

小商品公众号微信店铺搭建的作用是什么

小商品顾名思义就是价格低、需求广且数量多的日用产品&#xff0c;覆盖人群非常广&#xff0c;无论线上还是线下总能找到目标客户&#xff0c;铅笔、削皮刀、晾衣架等各式产品琳琅满目&#xff0c;不少商家也是热衷于小商品的售卖。 从整体来看&#xff0c;小商品商家也可线上…

tomcat整体架构

Tomcat介绍 Tomcat是Apache Software Foundation&#xff08;Apache软件基金会&#xff09;开发的一款开源的Java Servlet 容器。它是一种Web服务器&#xff0c;用于在服务器端运行Java Servlet和JavaServer Pages (JSP)技术。它可 以为Java Web应用程序提供运行环境&#x…

刚入职字节外包一个月,我却离职了...

有一种打工人的羡慕&#xff0c;叫做“大厂”。 真是年少不知大厂香&#xff0c;错把青春插稻秧。 但是&#xff0c;在深圳有一群比大厂员工更庞大的群体&#xff0c;他们顶着大厂的“名”&#xff0c;做着大厂的工作&#xff0c;还可以享受大厂的伙食&#xff0c;却没有大厂…

新手选MT4还是MT5,anzo capital昂首资本建议选择MT4,一个原因

在交易中就订单执行策略而言&#xff0c;MT4和MT5哪个更好&#xff0c;相信很多交易者和&#xff0c;anzo capital昂首资本一样很难做出判断。在MT5中&#xff0c;虽然开发人员对发送订单的流程进行了额外的复杂化&#xff0c;同时MT5在订单执行政策方面的优势在于其能够调整全…

告警繁杂迷人眼,多源分析见月明

随着数字化浪潮的蓬勃兴起&#xff0c;网络安全问题日趋凸显&#xff0c;面对指数级增长的威胁和告警&#xff0c;传统的安全防御往往力不从心。网内业务逻辑不规范、安全设备技术不成熟都会导致安全设备触发告警。如何在海量众多安全告警中识别出真正的网络安全攻击事件成为安…

Vue3项目使用Stimulsoft.Reports.js【项目实战】

Vue3项目使用Stimulsoft.Reports.js【项目实战】 相关阅读&#xff1a;vue-cli使用stimulsoft.reports.js&#xff08;保姆级教程&#xff09;_stimulsoft vue-CSDN博客 前言 在BS的项目中我们时常会用到报表打印、标签打印、单据打印&#xff0c;可是BS的通用打印解决方案又…

【JavaEE初阶】 多线程(初阶)——壹

文章目录 &#x1f332;线程的概念&#x1f6a9;线程是什么&#x1f6a9;为啥要有线程&#x1f6a9;进程和线程的区别&#x1f6a9;Java 的线程 和 操作系统线程 的关系 &#x1f60e;第一个多线程程序&#x1f6a9;使用 jconsole 命令观察线程 &#x1f38d;创建线程&#x1f…

字段位置顺序对值的影响

Unity中验证AB加载场景时报错&#xff1a; Cannot load scene: Invalid scene name (empty string) and invalid build index -1 报错原因是因为把字段放在了Start函数后面(图一)改成(图二)就好了。图一中协程使用的sceneBName字段值为null。 图一&#xff1a; 图二&#xff1a…

【C++】List -- 详解

一、list的介绍及使用 https://cplusplus.com/reference/list/list/?kwlist list 是可以在常数范围内在任意位置进行插入和删除的序列式容器&#xff0c;并且该容器可以前后双向迭代。 list 的底层是双向链表结构&#xff0c;双向链表中每个元素存储在互不相关的独立节点中&…

Windows10点击开始菜单没反应的四种解决方法

在Windows10电脑中&#xff0c;用户点击开始菜单却出现了没反映的情况&#xff0c;这样用户就无法通过开始菜单来展开操作哦&#xff0c;会给用户的正常操作带来一定程序的影响&#xff0c;下面小编给大家带来四种简单的解决方法&#xff0c;帮助大家轻松恢复Windows10电脑开始…

Selenium 高级定位 CSS

一、CSS选择器概念 CSS拥有自己的语法规则和表达式 CSS通常分为相对定位和绝对定位 CSS常和XPATH一起用于UI自动化测试 二、CSS相对定位使用场景 支持web场景支持app端的webview 三、CSS语法实战 3.1、CSS相对定位的优点 可维护性强语法简洁可以解决各种复杂的定位场景 # …

ARMv7-A 那些事 - 6.常用汇编指令

By: Ailson Jack Date: 2023.10.07 个人博客&#xff1a;http://www.only2fire.com/ 本文在我博客的地址是&#xff1a;http://www.only2fire.com/archives/158.html&#xff0c;排版更好&#xff0c;便于学习&#xff0c;也可以去我博客逛逛&#xff0c;兴许有你想要的内容呢。…

【二叉树练习题】

欢迎来到我的&#xff1a;世界 希望作者的文章对你有所帮助&#xff0c;有不足的地方还请指正&#xff0c;大家一起学习交流 ! 目录 前言初阶题二叉树的节点个数二叉树的叶子节点个数二叉树第k层节点个数二叉树查找值为x的节点 进阶题完全二叉树的节点个数翻转二叉树检验两个树…

修炼k8s+flink+hdfs+dlink(一:安装dlink)

一&#xff1a;mysql初始化。 mysql -uroot -p123456 create database dinky; grant all privileges on dinky.* to dinky% identified by dinky with grant option; flush privileges;二&#xff1a;上传dinky。 上传至目录/opt/app/dlink tar -zxvf dlink-release-0.7.4.t…

医学访问学者面试技巧

医学访问学者面试是一个非常重要的环节&#xff0c;它决定了你是否能够获得这个宝贵的机会去国外的大学或研究机构学习和研究。在这篇文章中&#xff0c;知识人网小编将分享一些关于医学访问学者面试的技巧&#xff0c;帮助你在面试中表现出色。 1. 准备充分 在参加医学访问学…

Multisim:JFET混频器设计(含完整程序)

目录 前言实验内容一、先看作业题目要求二、作业正文IntroductionPre-lab work3.13.2 Experiment Work4.1(2)circuit setup4.1(3)add 12V DC4.1(4)set input x1 and x24.1(5)4.1(6)4.1(7)4.2(1)(2)4.2(3)4.2(4)4.3(1)(2)4.3(3) Conclusion 三、资源包内容 前言 花了好大心血完成…

【线性代数及其应用 —— 第一章 线性代数中的线性方程组】-1.线性方程组

所有笔记请看&#xff1a; 博客学习目录_Howe_xixi的博客-CSDN博客https://blog.csdn.net/weixin_44362628/article/details/126020573?spm1001.2014.3001.5502思维导图如下&#xff1a; 内容笔记如下&#xff1a;

中国高清行政、地形、旅游、人文地图全集(地理干货,覆盖34个省市自治区)

中国高清行政、地形、旅游、人文地图全集&#xff08;地理干货&#xff0c;覆盖34个省市自治区&#xff09;&#xff1a; 中国的高原、平原、盆地和丘陵 四大高原&#xff1a;青藏高原位于中国西南部&#xff0c;平均海拔在4000米以上&#xff0c;是中国最大、世界最高的大高原…