Flutter Android端启动白屏问题的解决

 更新时间:2018年07月11日 09:42:06   作者:Joe_H  
Flutter 应用在 Android 端上启动时会有一段很明显的白屏现象,白屏的时长由设备的性能决定,设备性能越差,白屏时间越长。这篇文章主要介绍了Flutter Android端启动白屏问题的解决。感兴趣的小伙伴们可以参考一下

问题描述

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>

效果对比如下:

白屏

白屏优化

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • Android Studio 报Integer types not allowed错误

    Android Studio 报Integer types not allowed错误

    本文给大家分享的是在使用Android Studio的过程中遇到的报Integer types not allowed错误的分析及解决方法,非常实用,有需要的小伙伴可以参考下
    2017-10-10
  • Android中验证码倒计时的简单实现方法示例

    Android中验证码倒计时的简单实现方法示例

    最近开发中在注册获取验证码时候需要一个倒计时按钮,找了相关的资料终于实现了,所以现在分享给大家,下面这篇文章主要给大家介绍了关于Android中验证码倒计时简单实现的相关资料,需要的朋友可以参考借鉴。
    2017-06-06
  • Android仿微信加号菜单模式

    Android仿微信加号菜单模式

    这篇文章主要为大家详细介绍了Android仿微信加号菜单模式的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-04-04
  • Android实现app应用多语言切换功能

    Android实现app应用多语言切换功能

    这篇文章主要为大家详细介绍了Android实现app应用多语言切换功能的相关资料,类似于微信的语言切换,感兴趣的小伙伴们可以参考一下
    2016-08-08
  • Flutter Widget 之FocusableActionDetector使用详解

    Flutter Widget 之FocusableActionDetector使用详解

    这篇文章主要为大家介绍了Flutter Widget 之FocusableActionDetector使用示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-11-11
  • Android Button按钮点击背景和文字变化操作

    Android Button按钮点击背景和文字变化操作

    这篇文章主要介绍了Android Button按钮点击背景和文字变化操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-08-08
  • Android ListView 实现上拉加载的示例代码

    Android ListView 实现上拉加载的示例代码

    这篇文章主要介绍了Android ListView 实现上拉加载的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-07-07
  • Android项目实战之ListView悬浮头部展现效果实现

    Android项目实战之ListView悬浮头部展现效果实现

    这篇文章主要给大家介绍了Android项目实战之ListView悬浮头部展现效果实现的相关资料,文中通过实例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2022-01-01
  • Flutter图片加载与缓存机制的深入探究

    Flutter图片加载与缓存机制的深入探究

    应用开发中经常会碰到网络图片的加载,通常我们会对图片进行缓存,以便下次加载同一张图片时不用再重新下载,下面这篇文章主要给大家介绍了关于Flutter图片加载与缓存机制的相关资料,需要的朋友可以参考下
    2021-11-11
  • Android实现EditText图文混合插入上传功能

    Android实现EditText图文混合插入上传功能

    这篇文章主要为大家详细介绍了Android实现EditText图文混合插入上传功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-08-08

最新评论