前言

启动页(Splash)的设置对于一个app来说至关重要，不设置启动页打开app会有一段时间的白屏效果，站在用户体验上来说，不太友好。

设置启动页的方式分为两种，一种是手撸一个加载页面，第二种是直接修改配置文件。具体用哪种方式看个人使用场景，如果只是为了解决app启动出现白屏问题的话，个人推荐第二种，比较简单省事，本文介绍第二种方式。

1、Android启动页

• 1.1、android\app\src\main\res\drawable\launch_background.xml

<item>
        <bitmap
            android:gravity="fill" // 这句是全屏显示的关键
            android:src="@mipmap/itest_splash" /> <!-- 启动图按照分辨率放在mipmap-**hdpi目录中 -->
    </item>

• 1.2、android\app\src\main\res\values\styles.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- Theme applied to the Android Window while the process is starting -->
    <style name="LaunchTheme" parent="@android:style/Theme.Black.NoTitleBar">
        <!-- Show a splash screen on the activity. Automatically removed when
             Flutter draws its first frame -->
        <item name="android:navigationBarColor">@android:color/transparent</item>
        <item name="android:statusBarColor">@android:color/transparent</item>
        <item name="android:windowFullscreen">true</item>
        // 以上三行是新增的
        <item name="android:windowBackground">@drawable/launch_background</item>
    </style>
    <!-- Theme applied to the Android Window as soon as the process has started.
         This theme determines the color of the Android Window while your
         Flutter UI initializes, as well as behind your Flutter UI while its
         running.
         
         This Theme is only used starting with V2 of Flutter's Android embedding. -->
    <style name="NormalTheme" parent="@android:style/Theme.Black.NoTitleBar">
        <item name="android:windowBackground">@android:color/white</item>
    </style>
</resources>

2、IOS启动页

• 2.1、ios\Runner\Assets.xcassets\LaunchImage.imageset

  
  
  IOS

这里顺便推荐一个在线生成启动图和icon的网站：图标工场，上传图片就可以生成各种尺寸（ios&android）的icon。IOS启动页需要不同尺寸的图片，把图片拷贝到上面的两个目录中，并且修改Contents.json文件，如果用图标工场生成图片的话，可直接替换上面的两个文件夹。