问题描述
Flutter 应用在 Android 端上启动时会有一段很明显的白屏现象,白屏的时长由设备的性能决定,设备性能越差,白屏时间越长。
问题分析
其实启动白屏的问题在Android原生应用上也是一个常见问题,大致是因为从用户点击 Launcher Icon 到应用首页显示之间,Android 系统在完成应用的初始化工作,其流程如下:
在 Flutter Android 端上,白屏的问题会更加严重,因为除了 Android 应用启动耗时外,还增加了 Flutter 初始化耗时。
直到 Flutter 渲染出第一帧内容,用户才能感知到App启动完成。
解决方案
解决方案很简单,Android原生的白屏问题可以通过为 Launcher Activity 设置 windowBackground 解决,而 Flutter 也是基于此办法,同时优化了 Flutter 初始化阶段的白屏问题(覆盖一个launchView),只用两步设置便能解决 Flutter 中白屏问题。
在项目的 android/app/src/main/res/mipmap-xhdpi/ 目录下添加闪屏图片;
打开 android/app/src/main/res/drawable/launch_background.xml 文件,这个文件就是闪屏的背景文件,具体如何设置可以查阅 Android Drawable,我在 demo 中的设置如下:
<?xml version="1.0" encoding="utf-8"?>
<!-- Modify this file to customize your launch splash screen -->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@android:color/background_dark" />
<!-- You can insert your own image assets here -->
<item
android:bottom="84dp">
<bitmap
android:src="@mipmap/launch_image" />
</item>
</layer-list>
效果对比如下:
白屏
白屏优化
- 大小: 6.8 KB
- 大小: 8.3 KB
- 大小: 2.2 MB
- 大小: 1.9 MB
分享到:
相关推荐
Android原生的白屏问题可以通过为 Launcher Activity 设置 windowBackground 解决,而 Flutter 也是基于此办法,同时优化了 Flutter 初始化阶段的白屏问题。之所以新建的项目是白屏,因为flutter对此的方法默认是...
Flutter 安卓端启动页全屏+沉浸式状态栏 Flutter 安卓端启动页全屏+沉浸式状态栏 Flutter 安卓端启动页全屏+沉浸式状态栏 Flutter 安卓端启动页全屏+沉浸式状态栏 Flutter 安卓端启动页全屏+沉浸式状态栏 Flutter ...
新建flutter项目 刚启动是有段时间的白屏 ,这个是系统开机的白屏,可以更换成自己的启动画面,设置如下: launch_backgroud.xml里修改成自己的图片名称,src表示图片的名称不带扩展名,mipmap表示对应各种分辨率下的图片...
Flutter与Android Native原生进行混合开发(flutter module),Flutter和Android Native相互跳转,Flutter和Android Native进行通信的示例Demo 有Flutter官方API和引入FlutterBoost两种方式,具体可以看我的博客 第一...
Flutter的flutter_plugin_android_lifecycle插件是一个Flutter插件,用于访问Android Lifecycle objects。它可以帮助其他Flutter插件在Android上更好地集成。...如果遇到任何问题,可以参考官方文档或相关教程来解决。
android studio Flutter Plugin~flutter 插件 android studio开发flutter 必须插件
Android中集成flutter的演示Demo
flutter与Android混合开发示例,flutter与Android之间相互通信的示例
Flutter 内嵌原生组件 for android Flutter 内嵌原生组件 for android 文档地址 https://blog.csdn.net/nicepainkiller/article/details/125403744 文档地址 ...
flutter是goole开源的一款混合开发的框架,适合想要开发一款既能在Android上运行,又能在iOS运行的app。通过文档能够正确的配置好环境,成功创建一个demo。通过Android studio 创建项目并运行。
这是一个flutter项目,用AndroidStudio开发工具创建,主要用于实现Android APP运行本地web服务站点的功能,仅支持部署静态网页托管,在WIFI局域网内访问,相关学习文章请访问...
一个简单的 Flutter Android 应用,它显示 Android 传感器数据。 介绍 :: 对于 UI 的实现,这个应用程序使用了 Flutter 框架。 代码库主要使用 Dart 和 Kotlin 这两种语言编写。 为了访问诸如Sensors之类的平台...
Android Studio 4.1 Build #AI-201.8743.12.41.6858069 对应的flutter以及dart版本
flutter导报成aar,并在android中使用, flutter项目可单独运行或者是库,并可将之上传到远程仓库来使用。
Flutter WebView 使用addJavascriptInterface,利用platformview去创建android和ios的webview,然后用UiKitView或者AndroidView在Flutter项目中使用
使用Flutter开发的常见的App启动页
dart 为dart插件 flutter-intellij 为 flutter插件,flutter_i18n 看名字就明白了,下载后保存本地,安装插件的时候可直接选择从本地安装,选择后安装即可,安装后重启 Android studio
Flutter Android 环境搭建、真机器调试 、虚拟机调试以及在Vscode中开发Flutter应用; Flutter目录结构介绍、入口、自定义Widget、Center组件、Text组件、MaterialApp组件、Scaffold组件