不說複雜的,就談你可能會遇到的問題
本人文字和表達水平一般,所以可能打錯字或寫錯,還請見諒
Flutter是移動跨平臺的UI框架,一份程式碼即可在Android和iOS上一致的體驗,但是有一些還是需要我們去修改iOS和Android程式碼才能實現的,比如今天要說的啟動圖!
Flutter預設是沒有啟動圖的,所以開啟App是閃現的介面就是一個白屏,一個體驗好的App肯定是需要啟動圖的。
目前使用Flutter開發的應該大部分是iOS或Android的開發者,要麼會Android,要麼會iOS,對於涉及修改啟動圖,可能就有點一臉懵逼了。這篇文章我會教大家給App新增啟動圖最簡單的方法,相信會給你帶來幫助!
完整示例請看 GitHub:Flutter 淘寶App
一、iOS啟動圖設定
1、新增啟動圖
首先我們開啟工程
找到Assets.xcassets這個檔案
開啟後點選+
再點選New Image Set
給圖片命名
然後分別新增@2x、@3x圖片
@1x圖片就不需要了,在iPhone 3GS上才需要
2、設定啟動圖
Xcode已經給我們預設生成了LaunScreen.storyboard,通過這個檔案我們就可以修改啟動圖了。
步驟如下圖所以,再次執行,你會發現啟動圖不再是白屏了。
注意要修改圖片的Content Mode為Scale To Fill
二、Android啟動圖設定
1、新增啟動圖
開啟res目錄,路徑為android/app/src/main/res
將你的啟動圖依次新增到mipmap目錄中
圖片的尺寸可以都一樣
設定啟動圖
開啟res目錄下drawable目錄
開啟launch_background.xml檔案
新增如下程式碼
//這樣寫可以通過圖片鋪滿整個螢幕,不同螢幕可能會有拉伸
<item android:drawable="@mipmap/launch_image"></item>
複製程式碼