1. 程式人生 > >Flutter - 給App增加啟動屏幕(Splash Screen)並且設置背景顏色

Flutter - 給App增加啟動屏幕(Splash Screen)並且設置背景顏色

center apk time inf 背景圖 動圖 ora 其中 pmap

先看一下效果圖,啟動圖最好設置為png格式的透明圖,以防圖片填充不滿的時候背景圖會非常的煞白(Flutter 默認背景色是白色)。

技術分享圖片

技術分享圖片

打開android\app\src\main\res\drawable\launch_background.xml,

<?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/white" />
    <!-- You can insert your own image assets here -->
    <item>
        <bitmap
            android:gravity="center"
            android:src="@mipmap/launch_image" />
    </item>
</layer-list>

將<item>裏面的內容反註釋,並且準備一張圖片分辨率1080 x 1920,放入android\app\src\main\res\mipmap-xxhdpi即可。

註意名字改成launch_image即可。或者你可以用別的名字,把上面的xml文件改一下即可

密度 ldpi mdpi hdpi xhdpi xxhdpi xxxhdpi
代表分辨率 240 x 320 320 x 480 480 x 800 720 x 1280 1080 x 1920 3840×2160

關於背景顏色,這個也是研究了一段時間,因為Android自帶的顏色只有white和black。

想自定義顏色,卻一直引用不到。後來翻了很多資料和so上的回答,才發現自己馬虎大意。

需要把原來的 @android:color/white"中的android:去掉即可。

去掉以後為

<item android:drawable="@color/orange" />

其中orange是自定義的顏色。

首先需要在android\app\src\main\res\values下新建一個colors.xml文件,

內容為

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="orange">#FFAB40</color>
    <color name="transparent">#00000000</color>
</resources>

中間的resources就是自己想要添加的顏色。話說Android真是不給力,連個顏色都不預置。

定義好以後就可以在launch_background.xml中引用了。

Flutter - 給App增加啟動屏幕(Splash Screen)並且設置背景顏色