App啟動頁面優化

楊充發表於2018-11-24

目錄介紹

  • 01.存在白屏問題
    • 1.1 問題描述
    • 1.2 問題分析
  • 02.解決白屏的辦法
    • 2.1 解決方案分析
    • 2.2 第一種解決方案
    • 2.3 第二種解決方案
    • 2.4 注意要點
  • 03.Application啟動速度優化
  • 04.啟動頁面遮蔽返回按鍵

好訊息

  • 部落格筆記大彙總【16年3月到至今】,包括Java基礎及深入知識點,Android技術部落格,Python學習筆記等等,還包括平時開發中遇到的bug彙總,當然也在工作之餘收集了大量的面試題,長期更新維護並且修正,持續完善……開源的檔案是markdown格式的!同時也開源了生活部落格,從12年起,積累共計50篇[近30萬字],轉載請註明出處,謝謝!
  • 連結地址:github.com/yangchong21…
  • 如果覺得好,可以star一下,謝謝!當然也歡迎提出建議,萬事起於忽微,量變引起質變!
  • 輪播圖封裝庫:github.com/yangchong21…
  • 輕量級版本更新彈窗:github.com/yangchong21…
  • 通知欄封裝庫:github.com/yangchong21…

01.存在白屏問題

1.1 問題描述

  • 出現問題描述
    • android app啟動頁面黑屏的問題,android開發app啟動時若沒有做特殊處理的話,會出現一瞬間的白屏現象。
    • 即使你啟動頁介面就載入一個佈局,不做其他耗時處理,貌似也會出現一瞬間的白屏問題。注意,有些地方也稱黑屏,主要是看你給app設定的style樣式。
    • 當從桌面 Launcher 的小圖示點選冷啟動一個 App 的時候,程式需要進行一些基本的初始化操作,例如在Application 或者SplashActivity中做了很多耗時操作,例如初始化第三方SDK等,當手機效能不好,配置不高時,該現象尤其明顯。

1.2 問題分析

  • 為什麼存在這個問題
    • 當系統啟動一個APP時,zygote程式會首先建立一個新的程式去執行這個APP,但是程式的建立是需要時間的,在建立完成之前,介面是呈現假死狀態,於是系統根據你的manifest檔案設定的主題顏色的不同來展示一個白屏或者黑屏。而這個黑(白)屏正式的稱呼應該是Preview Window,即預覽視窗。
    • 實際上就是是activity預設的主題中的android:windowBackground為白色或者黑色導致的。
    • 總結來說啟動順序就是:app啟動——Preview Window(也稱為預覽視窗)——啟動頁

02.解決白屏的辦法

2.1 解決方案分析

  • Android在選擇展示黑屏或者白屏的時候,是根據你設定的主題而不同的,也就是說,雖然你的程式碼沒有被執行,你的配置檔案卻被提前讀取了,用來作為展示Preview Window介面的依據。所以,解決方案的切入口就是整個APP的manifest檔案,更確切的說應該是主題配置檔案。
  • 設定配置檔案style樣式中的windowBackground這個屬性來顯示一張背景圖還有一個效果就是啟動應用程式會感覺非常快,而且與載入MainActivity的contentView是非同步的。

2.2 第一種解決方案

  • 解決辦法:給當前啟動頁新增一個有背景的style樣式
    • 設定style樣式如下
    <style name="SplashTheme" parent="AppTheme">
        <item name="android:windowBackground">@mipmap/splash</item>
        <item name="android:statusBarColor" tools:ignore="NewApi">@color/white</item>
        <item name="android:windowIsTranslucent">true</item>
    </style>
    複製程式碼
    • 注意,在清單檔案中
    <activity android:name=".SplashActivity"
        android:theme="@style/SplashTheme">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
    
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>
    複製程式碼
  • 經過處理之後App啟動時就不會出現一瞬間白屏的效果
    • 將主題設定到啟動的Activity的主題中,windowBackground就是即將展示的preview window。其中splash可以是一整張圖片,它也可以是一個能解析出圖片資源的XML檔案。
  • 該方案注意要點
    • 給Preview Window設定的背景圖如果不做處理,圖片就會一直存在於記憶體中,所以,當我們進入到歡迎頁的時候,不要忘了把背景圖設定為空
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        //將window的背景圖設定為空
        getWindow().setBackgroundDrawable(null);
        super.onCreate(savedInstanceState);
    }
    複製程式碼
  • 這樣操作如何螢幕適配呢?
    • 這樣通過樣式style設定SplashActivity載入圖,不能像imageView那樣可以設定縮放功能,因此可以採用.9圖片。
    • 以前有開發者採用我的這個建議,直接設定圖,沒有做適配,也無傷大雅,具體要看UI要求呢!

2.3 第二種解決方案

  • 禁止載入Preview Window,具體做法如下:
    <style name="SplashTheme" parent="@style/Theme.AppCompat.Light.NoActionBar">
        <item name="android:windowDisablePreview">true</item>
    </style>
    複製程式碼
    • 設定為啟動的Activity的主題,即可禁止Preview Window,當然,也有人通過把preview window設定為全透明,也達成了類似的效果。個人感覺這種方法沒有第一種好!
  • windowDisablePreview的作用
    • 通過設定android:windowDisablePreview屬性,禁用視窗的預覽動畫,在SplashActivity顯示之前,系統永遠不會使用視窗的主題來顯示它的預覽,這也保證了不會出現白屏或者黑屏。但是,與設定android:windowIsTranslucent屬性一樣,如果在SplashActivity啟動的時候,有過多複雜的操作,就會出現在手機中點選了應用程式的圖示,但過n秒才會開啟應用程式不好的卡頓體驗效果。
  • 該方案是否有缺點?
    • 這種方法有個小缺點,就是點選後短暫的那幾百毫秒沒有反應,就好像“假死”了一樣,過了一會兒才跳出我們應用程式的第一個Activity,如果你不想讓你的 App 有這個短暫“假死”時間,建議使用第一種方法。

2.4 注意要點

  • 不管是那種方式,都可以解決問題。注意的是有些手機標題欄和狀態列也會影響這兩圖層的,造成抖動效果,為了避免這種情況需要處理狀態列問題。這裡可以直接引用我封裝的狀態列庫,有興趣可以瞭解下,直接拿來用:github.com/yangchong21…

03.Application啟動速度優化

  • 提高app的啟動速度,加快Application的執行時間也是一個很重要的方面,這裡我暫時總結了幾條原則:
    • 儘量不將一些業務邏輯放於Application中;
    • Application儘量不以靜態變數的方式儲存應用資料;
    • 若App的大小不是特別大無需使用dex分包方案;
    • 在Application中關於檔案,資料庫等耗時的操作儘量放到IntentService執行緒中處理
    • 不要做有關於迴圈的操作

04.啟動頁面遮蔽返回按鍵

  • 一般App中都會在啟動頁面執行一些初始化配置等,所以這時候啟動頁載入時不希望使用者通過按下返回按鍵退出App,因而可以在啟動頁中遮蔽返回按鍵,這裡簡單的介紹一下具體的實現:
    /**
     * Activity遮蔽物理返回按鈕
     *
     * @param keyCode
     * @param event
     * @return
     */
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK) {
            return true;
        }
        return super.onKeyDown(keyCode, event);
    }
    複製程式碼

關於其他內容介紹

01.關於部落格彙總連結

02.關於我的部落格

相關文章