Android 啟動頁優(yōu)化及過渡動畫

背景： 作為一只勵志猿，不斷的學習和總結(jié)自然是日常開發(fā)不可或缺的一部分。之前一直習慣于把遇到的問題隨手記錄在個人文件里，一方面不太規(guī)范；另一方面白白錯過了與大家交流學習的機會。痛定思痛，決定把之前開發(fā)過程中遇到的一些問題總結(jié)發(fā)布出來，以供交流和學習！ 有什么錯誤或不足的地方，歡迎大家留言指正！

一、APP的啟動方式：

一般來說，APP的啟動方式主要分為兩種：冷啟動和熱啟動。

  1. 冷啟動：啟動應(yīng)用時，后臺沒有該應(yīng)用的進程，系統(tǒng)會重新創(chuàng)建一個新的進程分配給該應(yīng)用，即冷啟動；
  2. 熱啟動：啟動應(yīng)用時，后臺已有該應(yīng)用的進程（例如：點擊Back鍵或Home鍵退出，此時應(yīng)用的進程依然在后臺存活），這時會在已有的進程中啟動該應(yīng)用，即熱啟動；

特點：

  1. 冷啟動：由于冷啟動需要系統(tǒng)重新創(chuàng)建一個新的進程，所以會先創(chuàng)建和初始化Application，然后再創(chuàng)建和初始化StartActivity（啟動頁Activity）并測量繪制其界面。從點擊啟動圖標到啟動完成（以看到界面的第一幀為準）應(yīng)用的啟動流程如下：

    Application構(gòu)造方法->attachBaseContext()->onCreate()->StartActivity構(gòu)造方法->onCreate()->onStart()->onResume()->測量、繪制布局并展示；

  2. 熱啟動：由于后臺已存在該應(yīng)用的進程無需重新創(chuàng)建，且一個應(yīng)用的進程從創(chuàng)建到銷毀Application只會被初始化一次。所以熱啟動只會執(zhí)行StartActivity的創(chuàng)建和初始化；

二、啟動APP時白屏或黑屏：

現(xiàn)象：許多做Android的小伙伴可能都遇到過，當啟動APP時， 會有一個白屏或黑屏一閃而過，然后才展示啟動頁的現(xiàn)象。這種詭異的現(xiàn)象又是如何產(chǎn)生的呢？

從上述APP的啟動方式 的介紹中，我們可以知道只有在StartActivity的onResume()執(zhí)行完成后才開始布局的測量和繪制。而在應(yīng)用程序進程創(chuàng)建并初始化成功之前，系統(tǒng)會顯示一個臨時窗口Starting Window（也稱作：Preview Window，它的WindowType是TYPE_APPLICATION_STARTING；在初始化完成之前展示，是為了盡快告知用戶，系統(tǒng)已經(jīng)知道他要打開該應(yīng)用，并且已經(jīng)對此做出了響應(yīng)。待初始化完成后，系統(tǒng)會顯示用戶UI并移除該窗口），我們看到的黑屏或白屏就是不同Theme時對應(yīng)的Window的背景。

啟動白屏的示例：

  1. 設(shè)置啟動頁Style：
 <style name="AppTheme.Launcher" parent="Theme.AppCompat.Light.NoActionBar">
        <item name="windowNoTitle">true</item>
        <item name="android:windowFullscreen">true</item>
    </style>
  1. 在AndroidManifest.xml中配置如下：
 <activity
            android:name=".activity.StartActivity"
            android:theme="@style/AppTheme.Launcher">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
 </activity>

3.StartActivity的代碼如下：

public class StartActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        try {
            Thread.sleep(1000); //線程休眠1s，使出現(xiàn)白屏時的效果更加明顯
        } catch (InterruptedException e) {
            e.printStackTrace();
        }
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_start);
        //展示2s后前往主頁
        new Handler().postDelayed(new Runnable() {
            @Override
            public void run() {
                Intent intent = new Intent(StartActivity.this, MainActivity.class);
                startActivity(intent);
                finish();
            }
        }, 2000);
    }
}
  1. 布局文件 activity_start.xml：
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/layer_launcher"
    tools:context="com.gcj.myapplication.activity.StartActivity">
</FrameLayout>

效果如下：


解決方案：

  1. 禁用Preview Window（不推薦）：
    既然APP啟動時的黑白屏是由Preview引起的，那系統(tǒng)有沒有提供禁用的方法呢？ 答案是肯定的。修改上述style 如下：
 <style name="AppTheme.Launcher" parent="Theme.AppCompat.Light.NoActionBar">
        <!--禁用Preview-->
        <item name="android:windowDisablePreview">true</item>
        <item name="windowNoTitle">true</item>
        <item name="android:windowFullscreen">true</item>
    </style>

然而，黑白屏的問題是解決了，但點擊應(yīng)用圖標后會有一段時間沒有響應(yīng)。用戶體驗不好，違背了優(yōu)化的初衷，不推薦使用。

  1. 使用透明主題（個人不太推薦）：
  <style name="AppTheme.Launcher" parent="Theme.AppCompat.Light.NoActionBar">
        <!--設(shè)置Window透明-->
        <item name="android:windowIsTranslucent">true</item>
        <item name="windowNoTitle">true</item>
        <item name="android:windowFullscreen">true</item>
    </style>

特點：應(yīng)用啟動慢，刷新同步，界面會一次性刷新出來。由于背景透明，初始化的過程中，用戶看到的是桌面，給人一種點擊之后稍等一會才一次性刷新出來的感覺。
注：話說微信啟動時使用的就是類似這樣的效果，但微信做了一定的優(yōu)化處理，只在 冷啟動 時才顯示啟動頁，具體如何實現(xiàn)稍后會做詳細介紹；

  1. 修改windowBackground屬性（推薦）：
 <style name="AppTheme.Launcher" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- 通過windowBackground可以設(shè)置背景色、背景圖片、能解析出圖片的XML文件等-->
        <item name="android:windowBackground">@drawable/layer_launcher</item>
        <item name="windowNoTitle">true</item>
        <item name="android:windowFullscreen">true</item>
    </style>

自定義layer-list: layer_launcher.xml 代碼如下：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@android:color/white" />
    <item>
        <bitmap
            android:gravity="center"
            android:src="@drawable/launch_logo" />
    </item>
</layer-list>

特點：應(yīng)用啟動快，非同步刷新，界面會先顯示背景圖，然后再刷新其他控件，個人比較推薦。
注：此時可以將StartActivity中 setContentView(R.layout.activity_start); 注釋掉；

三、從啟動頁到登錄頁的完美過渡：

通過上述方案，雖然解決了啟動時黑屏、白屏的問題，但總感覺界面跳轉(zhuǎn)時，過渡不夠自然。之前一偶然機會實現(xiàn)了一個從啟動頁至登錄頁的過渡動畫，動畫比較簡單，效果還算可以。江湖規(guī)矩，先呈上效果圖：


附代碼：

  1. 將AndroidManifest.xml中StartActivity的Theme配置為上述解決方案的第三種，StartActivity.java的代碼如下：
package com.gcj.myapplication.activity;

import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;
import android.support.v7.app.AppCompatActivity;
import android.view.KeyEvent;

/**
 * Created by gcj on 2017/11/28
 */
public class StartActivity extends AppCompatActivity {
    private Handler handler = new Handler();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // 注意：此處將setContentView()方法注釋掉
        // setContentView(R.layout.activity_start);
        handler.postDelayed(new Runnable() {
            @Override
            public void run() {
                gotoLogin();
            }
        }, 2000);
    }

    /**
     * 前往注冊、登錄主頁
     */
    private void gotoLogin() {
        Intent intent = new Intent(StartActivity.this, LoginMainActivity.class);
        startActivity(intent);
        finish();
        //取消界面跳轉(zhuǎn)時的動畫，使啟動頁的logo圖片與注冊、登錄主頁的logo圖片完美銜接
        overridePendingTransition(0, 0);
    }

    /**
     * 屏蔽物理返回鍵
     */
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK) {
            return true;
        }
        return super.onKeyDown(keyCode, event);
    }

    @Override
    protected void onDestroy() {
        if (handler != null) {
            //If token is null, all callbacks and messages will be removed.
            handler.removeCallbacksAndMessages(null);
        }
        super.onDestroy();
    }
}
  1. LoginMainActivity.java
package com.gcj.myapplication.activity;

import android.animation.Animator;
import android.animation.AnimatorListenerAdapter;
import android.animation.AnimatorSet;
import android.animation.ObjectAnimator;
import android.content.Context;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.DisplayMetrics;
import android.view.KeyEvent;
import android.view.View;
import android.view.WindowManager;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;

import com.gcj.myapplication.R;

/**
 * Created by gcj on 2017/11/28
 */
public class LoginMainActivity extends AppCompatActivity {
    private long exitTime;
    private TextView tvRegister;
    private TextView tvLogin;
    private ImageView ivLogo;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main_login);
        initViews();
        initAnims();
    }

    /**
     * 初始化View控件
     */
    private void initViews() {
        tvLogin = (TextView) findViewById(R.id.tv_login);
        tvRegister = (TextView) findViewById(R.id.tv_register);
        ivLogo = (ImageView) findViewById(R.id.iv_logo);
    }

    /**
     * 初始化logo圖片以及底部注冊、登錄的按鈕動畫
     */
    private void initAnims() {
        //初始化底部注冊、登錄的按鈕動畫
        //以控件自身所在的位置為原點，從下方距離原點200像素的位置移動到原點
        ObjectAnimator tranLogin = ObjectAnimator.ofFloat(tvLogin, "translationY", 200, 0);
        ObjectAnimator tranRegister = ObjectAnimator.ofFloat(tvRegister, "translationY", 200, 0);
        //將注冊、登錄的控件alpha屬性從0變到1
        ObjectAnimator alphaLogin = ObjectAnimator.ofFloat(tvLogin, "alpha", 0, 1);
        ObjectAnimator alphaRegister = ObjectAnimator.ofFloat(tvRegister, "alpha", 0, 1);
        final AnimatorSet bottomAnim = new AnimatorSet();
        bottomAnim.setDuration(1000);
        //同時執(zhí)行控件平移和alpha漸變動畫        
        bottomAnim.play(tranLogin).with(tranRegister).with(alphaLogin).with(alphaRegister);

        //獲取屏幕高度
        WindowManager manager = (WindowManager) getSystemService(Context.WINDOW_SERVICE);
        DisplayMetrics metrics = new DisplayMetrics();
        manager.getDefaultDisplay().getMetrics(metrics);
        int screenHeight = metrics.heightPixels;

        //通過測量，獲取ivLogo的高度
        int w = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED);
        int h = View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED);
        ivLogo.measure(w, h);
        int logoHeight = ivLogo.getMeasuredHeight();

        //初始化ivLogo的移動和縮放動畫
        float transY = (screenHeight - logoHeight) * 0.28f;
        //ivLogo向上移動 transY 的距離
        ObjectAnimator tranLogo = ObjectAnimator.ofFloat(ivLogo, "translationY", 0, -transY);
        //ivLogo在X軸和Y軸上都縮放0.75倍
        ObjectAnimator scaleXLogo = ObjectAnimator.ofFloat(ivLogo, "scaleX", 1f, 0.75f);
        ObjectAnimator scaleYLogo = ObjectAnimator.ofFloat(ivLogo, "scaleY", 1f, 0.75f);
        AnimatorSet logoAnim = new AnimatorSet();
        logoAnim.setDuration(1000);
        logoAnim.play(tranLogo).with(scaleXLogo).with(scaleYLogo);
        logoAnim.start();
        logoAnim.addListener(new AnimatorListenerAdapter() {
            @Override
            public void onAnimationEnd(Animator animation) {
                super.onAnimationEnd(animation);
                //待ivLogo的動畫結(jié)束后,開始播放底部注冊、登錄按鈕的動畫
                bottomAnim.start();
            }
        });
    }


    /**
     * 重寫返回鍵，實現(xiàn)雙擊退出效果
     */
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK) {
            if (System.currentTimeMillis() - exitTime > 2000) {
                Toast.makeText(LoginMainActivity.this, "再按一次退出程序", Toast.LENGTH_SHORT).show();
                exitTime = System.currentTimeMillis();
            } else {
                LoginMainActivity.this.finish();
            }
            return true;
        }
        return super.onKeyDown(keyCode, event);
    }
}
  1. activity_main_login.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@android:color/white"
    tools:context="com.gcj.myapplication.activity.LoginMainActivity">

    <TextView
        android:id="@+id/tv_login"
        android:layout_width="250dp"
        android:layout_height="45dp"
        android:layout_above="@+id/tv_register"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="23dp"
        android:alpha="0"
        android:background="@drawable/shape_login"
        android:gravity="center"
        android:text="登錄"
        android:textColor="@android:color/white"
        android:textSize="15sp" />

    <TextView
        android:id="@+id/tv_register"
        android:layout_width="250dp"
        android:layout_height="45dp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="102dp"
        android:alpha="0"
        android:background="@drawable/shape_login"
        android:gravity="center"
        android:text="新用戶注冊"
        android:textColor="@android:color/white"
        android:textSize="15sp" />

    <ImageView
        android:id="@+id/iv_logo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:src="@drawable/launch_logo" />
</RelativeLayout>

四、實現(xiàn)只在冷啟動時顯示啟動頁，類似微信效果：

其實實現(xiàn)很簡單，只需在啟動頁跳轉(zhuǎn)到的主Activity（如上述：LoginMainActivity）中重寫的返回鍵如下：

    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_BACK) {
            //實現(xiàn)只在冷啟動時顯示啟動頁，即點擊返回鍵與點擊HOME鍵退出效果一致
            Intent intent = new Intent(Intent.ACTION_MAIN);
            intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
            intent.addCategory(Intent.CATEGORY_HOME);
            startActivity(intent);
            return true;
        }
        return super.onKeyDown(keyCode, event);
    }

附項目地址：https://github.com/HMonkey1024/MyLauncher

歡迎轉(zhuǎn)載，轉(zhuǎn)載請標明出處！

最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 179,326評論 25贊 708
  • 今年的我已經(jīng)大二了，大一一年就這么暈暈乎乎的過去了。 之前在我的人生中跟一個朋友的不歡而散，我對人際交往始終持謹慎...
    胖達啊閱讀 284評論 0贊 0
  • 雪落梅梢，故人蹤沒，朔風吹落清寒。 望眼皆白璧，粉黛斑斑。 疑似佳人佇立，難舍去，淚落闌珊。 情絕斷，諸多悔意，已...
    SupperRay閱讀 223評論 2贊 0
  • 簡評：繼續(xù)第一部分的文章，作者在第二部分中使用的技術(shù)包括 MVVM，RxJava2. 5. MVVM 架構(gòu) + 存...
    極小光閱讀 1,084評論 0贊 8

友情鏈接更多精彩內(nèi)容