更新下,看到更加好的文章可以参考 https://medium.com/@diegoveloper/flutter-splash-screen-9f4e05542548
而且可以通过下面的方式实现图片的叠加效果,其中文字需要转换成图片:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<!-- You can insert your own image assets here -->
<item >
<shape android:shape="rectangle" >
<gradient
android:angle="90"
android:endColor="#FFE6EDFA"
android:startColor="#FFFFFFFF" />
</shape>
</item>
<item android:bottom="130dp">
<bitmap
android:gravity="center"
android:mipMap="true"
android:src="@mipmap/ic_launcher" />
</item>
<item android:bottom="40dp">
<bitmap
android:gravity="center"
android:mipMap="true"
android:src="@mipmap/ic_launcher_text"/>
</item>
<item >
<bitmap
android:gravity="bottom"
android:mipMap="true"
android:src="@mipmap/ic_launcher_bottom"/>
</item>
</layer-list>
----------------------------------------------分割线----------------------------------------------
之前做android的时候就需要解决白屏问题,按照如下方式:
给启动页的activity设置style:
<style name="FullscreenStyle" parent="xxx">
<item name="android:windowFullscreen">true</item>
<item name="windowNoTitle">true</item>
<item name="android:windowBackground">@drawable/launch_image</item>
</style>
然后在drawable放置一张全屏的图片launch_image。
使用flutter以后就考虑是否能有相同的方式解决,所幸找到了,而且flutter本身已经做好了,我们只需要添加下图片即可。
参考来源:https://stackoverflow.com/questions/43879103/adding-a-splash-screen-to-flutter-apps
验证过android平台,这里记录下:
把我们的图片launch_image放置到对应的mipmap尺寸下;
然后把drawable/launch_background.xml的注释放开,变成如下:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@android:color/white" />
<!-- You can insert your own image assets here -->
<item>
<bitmap
android:src="@mipmap/launch_image" />
</item>
</layer-list>
这里可以看到我把android:gravity="center"给去掉了,因为我这里是需要一个全屏的启动页,而且如果尺寸不是合适的会拉伸到全屏。如果只是放置一个logo,可以加上然后设置下背景色即可。
另外如果是说启动页还有其他元素,那么正常的在main.dart里面添加启动页UI和跳转主页的逻辑就好了。