Android Activity 切換動畫及5.0以后的轉場動畫

學習收集，非原創

一、 簡介

在Android開發過程中，經常會碰到Activity之間的切換效果的問題，下面介紹一下如何實現左右滑動的切換效果，首先了解一下Activity切換的實現，Android已經內置了幾種動畫效果，可以見 android.R.anim 類。一般情況下我們需要自己定義屏幕切換的效果。首先我們先了解Activity的位置定義，如下圖：


圖圖圖

從上圖可以看出，以手機屏幕下面邊未X軸，屏幕左邊為Y軸，

  • 當Activity在X軸值為-100%p時，剛好在屏幕的左邊（位置1），
  • 當X軸值為0%p時，剛好再屏幕內(位置2），
  • 當X=100%p時剛好在屏幕右邊（位置3）。

清楚了位置后，我們就可以實現左右滑動的切換效果，首先讓要退出的Activity從位置2移動到位置1，同時讓進入的Activity從位置3移動位置2，這樣就能實現從左右切換效果。
實現過程如下，首先定義2個動畫，在 res目錄創建anim目錄， 然后在目錄創建動畫的xml文件：
out_to_left.xml (從左邊退出動畫)
in_from_right.xml(從右邊進入動畫)

out_to_left.xml (從 位置2 移動到 位置1)

<?xml version="1.0" encoding="utf-8"?>
  <set 
   xmlns:android="http://schemas.android.com/apk/res/android" 
  android:interpolator="@android:anim/accelerate_interpolator"> 
  <translate android:fromXDelta="0%p" 
   android:toXDelta="-100%p" 
   android:duration="500" />
 </set>

    in_from_right.xml (從 位置3 移動到 位置2)

    <?xml version="1.0" encoding="utf-8"?>
    <set 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:interpolator="@android:anim/accelerate_interpolator">
     <translate 
      android:fromXDelta="100%p" 
      android:toXDelta="0%p" 
      android:duration="500" />
    </set>

二 、使用windowAnimation和ActivityAnimation設置Android轉場動畫

1. windowAnimation和ActivityAnimation的區別：

顯而易見，window與Activity本身從名字上就知道不同，但對于項目開發中 windowAnimation和ActivityAnimation的區別必須心領神會。
區別主要如下:

    1. windowAnimation包含: windowEnterAnimation 和 windowExitAnimation
      ActivityAnimation包含: android:activityOpenEnterAnimation ， android:activityOpenExitAnimation ， android:activityCloseEnterAnimation 和 android:activityCloseExitAnimation
    1. 在項目中WindowAnimation的控制權大于Activity的控制權，即在Activity轉場過程中，如果同時設置了WindowAnimation和ActivityAnimation,那么 可能（因為這種情況非常多） 只會執行WindowAnimation
    1. 對于WindowAnimation的定義很簡單，在style.xml文件中只需要繼承Animation Style即可
2. Android使用Theme自定義Activity進入退出動畫

在AndroidManifest里面，對于application和activity標簽可以定義theme屬性。如果對Application定義了某一個屬性，那么會對所有的activity產生影響，當然你可以在activity中覆蓋它。

在AndroidManifestl中
對所有的activity產生影響
<application  android:theme="@style/AppTheme">
在activity中覆蓋它
<activity
   android:name=".ui.video.VideoDetailActivity"
   android:label="@string/title_activity_video_detail"
   android:theme="@style/AppTheme"></activity>
在values/styles.xml中
<style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
        <item name="android:windowAnimationStyle">@style/myActivityOutEnterAnima</item>
    </style>

<style name="myActivityOutEnterAnima" parent="@android:style/Animation.Activity">
        <!-- 定義activity的進出場動畫 -->
        <item name="android:activityOpenEnterAnimation">@anim/enter_from_right</item>
        <item name="android:activityOpenExitAnimation">@anim/out_to_left</item>
        <item name="android:activityCloseEnterAnimation">@anim/enter_from_left</item>
        <item name="android:activityCloseExitAnimation">@anim/out_to_right</item>
    </style>
在values/anim.xml中
enter_from_left.xml
enter_from_right.xml
out_to_left.xml
out_to_right.xml

android:activityOpenEnterAnimation：指的是進入B時, B的動畫。
android:activityOpenExitAnimation：指的是進入B時，A的動畫，與B的動畫是一起顯示的。
android:activityCloseEnterAnimation：通過B跳轉到C后，后退到B時，B的進入動畫
android:activityCloseExitAnimation：通過B跳轉到C后，后退到B時，C的退出動畫'

這樣就可以了，至于anim中的動畫，就自己定義啦，這個和普通的animation是一樣的，如果不知道的話，請參見http://developer.android.com/guide/topics/graphics/view-animation.html。
這種方式除了可以定義activity的animation之外，還有task，window出現和結束時候的動畫，具體請參見
http://developer.android.com/reference/android/R.styleable.html#WindowAnimation

從上述2中動畫的定義上來看，顯然ActivityAnimation更為復雜，但這種復雜帶來的轉場效果非常好，可以同時控制2個Activity的動畫，而不像WindowAnimation只能控制下一個Activity的窗體動畫。

三、 窗體動畫也可以使 Activity. overridePendingTransition來設置

從Android2.0開始在Activity增加了一個方法：
public void overridePendingTransition (int enterAnim, int exitAnim) 其中：

  • enterAnim 定義Activity進入屏幕時的動畫
  • exitAnim 定義Activity退出屏幕時的動畫

注：overridePendingTransition 方法必須在startActivity()或者 finish()方法的后面。當時沒法定義退出的動畫

四、 5.0以后的轉場動畫

1. 概述

毫無疑問，動畫效果能提高用戶體驗。我們平時使用最多的動畫基本上是屬性動畫和補間動畫了，屬性動畫很強，基本能定制我們想要的動畫，但是你是否知道，API 21（5.0）后系統內置了Activity之間的切換動畫，而且非常酷炫，今天我跟大家一起分享一下。

我們知道，在兩個Activity之間切換，我們一般會寫出類似下面的代碼：

在API 21以后，我們可以使用內置的Activity切換動畫啦。

但是這樣也就意味著只能兼容5.0之后的系統，我們先看一個效果圖來壓壓驚：

先看看第一個Activity，退出時用的是Explode效果，第二個Activity進入時用的是Slide效果。

這些效果無需我們自己去實現，都是內置的效果，我們所編寫的代碼幾乎為零，接下來我們一一看看內置了哪些效果。

2.使用內置Activity切換動畫的步驟

Activity之間的切換期間，對于某個Activity來說，無非就是“進入”和“退出”兩種情景下的動畫。
而“進入”分為“第一次進入Activity”和“返回當前Activity”這兩種情況。

另外系統還提供了一種動畫，即共享元素，這是讓兩個Activity中的View有個過渡切換的效果。
執行動畫的狀態如下所示：

  • enter：用于決定第一次打開當前Activity時的動畫

  • exit : 用于決定退出當前Activity時的動畫

  • reenter: 用于決定如果當前Activity已經打開過，并且再次打開該Activity時的動畫

  • shared elements:用于決定在兩個Activity之間切換時，指定兩個Activity中對應的View的過渡效果

那么應該怎么去使用Activity切換動畫呢？

我們看看使用步驟：
  • ** 首先在setContentView()之前執行，用于告訴Window頁面切換需要使用動畫接下來就是加載切換動畫**
getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);
  • 接下來就是加載切換動畫
    其中R.transition.explode就是要執行的動畫，是在res/transition目錄下的xml文件，我們使用的是系統內置的Explode效果動畫，關于怎么去寫explode.xml，我們接下來小節去講解。
  • 告訴Window，當前的Activity在什么情況下使用上面的動畫
    上面我們創建好了切換動畫，接下來就是要告訴當前窗口，在什么情況下去使用動畫效果啦，你可以根據你的需求在不同的切換情景中選擇不同的效果：

當然了，你也可以不使用代碼的方式，直接在你使用的主題

  • 調用startActivity
    跟我們之前使用的startActivity(Intent intent);不同，這里多了一個參數Bundle，我們是先通過makeSceneTransitionAnimation函數創建一個ActivityOptions對象，再將其轉為Bundle對象:

整體使用步驟就是以上這些，是不是很簡單？接下來我們去學習如何使用內置動畫~

3.使用內置動畫

3.1 Explode效果

Explode即爆炸效果，使用Explode效果很簡單，在res/transition目錄下新建一個xml文件(如explode.xml)，內容如下：

<explode  
  xmlns:android="http://schemas.android.com/apk/res/android"   
  android:duration="300" />

其中duration表示Explode動畫持續時間，由于是Activity之間的切換，最好不要把動畫時間設置過大，一般取200~500毫秒比較合適。

我們看看效果吧~


3.2 Slide效果

即滑動效果，使用Slide跟Explode類似，都是在res/transition目錄下新建一個xml文件(如slide.xml)，內容如下：


圖呢??

其中，slideEdge表示起始滑動的側邊位置，end表示右側，start表示左側，top表示頂部，bottom表示底側，各種效果你可以親自試試~，一起看看滑動效果吧：


GIF 效果看的比較死板，可以下載我的源碼實際運行一下~

如果你不希望頂部的狀態欄以及底部的導航欄一起執行動畫，可以在xml中指定：


3.3 Fade效果

Fade效果即淡化效果，使用淡化效果依然是很簡單，在res/transition目錄下新建一個xml文件(如fade.xml)，內容如下：

<fade    
   xmlns:android="http://schemas.android.com/apk/res/android" 
   android:duration="300" />

Fade效果就是將View逐步淡化，這里不再貼效果啦，想看效果的可以下載我的源碼運行看看~

3.4 Shared Element效果

即共享元素效果，與前面幾種效果不同的是，共享元素效果是將前面一個Activity的某個子View與后面一個Activity的某個子View之間有過渡效果，我們先看看動態圖感受一下：

從動態圖中看到，第一個Activity的小綠色方塊到第二個Activity大綠色方塊有個過渡效果~

接下來我們重點看看如何實現這個效果。

如何實現Shared Element效果

1.將兩個Activity中需要過渡的View加上Android:transitionName屬性

兩個View的android:transitionName屬性取值要一致，比如：
第一個Activity布局：

第二個Activity布局：

兩個綠色的View都添加android:transitionName屬性，并且取名一致。

2.調用startActivity

ActivityOptions的makeSceneTransitionAnimation函數第一個參數Activity沒啥解釋的，第二個參數就是第一個Activity中的View對象，第三個參數就是兩個Activity的View的 android:transitionName屬性的值。


現在就可以實現這種Shared Element效果啦，但是可能你會想實現同時讓兩個View有這樣的效果，可是makeSceneTransitionAnimation函數卻只能讓我們設置一個View和一個transitionName屬性。

如何添加多個呢？

接下來我們一起學習讓多個View同時有切換效果。
除了需要將兩個Activity中需要過渡的View對應取相同的名稱外，還需將需要過渡的View和transitionName取值對應的String這兩個對象封裝到一個Pair對象中：

然后調用ActivityOptionsCompat類的makeSceneTransitionAnimation的另一個重載函數：

makeSceneTransitionAnimation(Activity activity,  Pair<View, String>... sharedElements)

第一個參數不解釋，后面參數為不定長度的形參，即你可以傳遞任意多個Pair對象。

最后調用startActivity

ActivityCompat.startActivity(this, intent, transitionActivityOptions.toBundle());

說了這么多步驟，我們來看看效果吧~

自定義 Shared Element切換動畫

如果你對內置的 Shared Element還不夠滿意，你還可以定制View的過渡切換效果。

步驟如下：

1.創建一個View的過渡移動的軌跡路徑PathMotion類

我們可以創建ArcMotion對象，ArcMotion是PathMotion子類，是個曲線路徑。想要了解更多ArcMotion可以查看：
ArcMotion官方文檔

ArcMotion arcMotion = new ArcMotion();
arcMotion.setMinimumHorizontalAngle(50f);
arcMotion.setMinimumVerticalAngle(50f);

2.定義ChangeBounds類

我們自定義一個繼承ChangeBounds的類，主要重寫createAnimator函數，即創建你要執行的動畫。這個函數由3個參數：

  • ViewGroup sceneRoot：屏幕根View，即DecorView，第二個Activity的DecorView。

  • TransitionValues startValues ：屬性動畫的起始屬性值，TransitionValues 對象內部有各Map類型的屬性values，用于保存需要執行屬性動畫的屬性。這個里面的屬性值是在函數captureStartValues里放置，因此你可以重寫captureStartValues函數，并把你自定義的屬性動畫中的屬性放進去。

  • TransitionValues endValues：與startValues類似，表示屬性動畫結束時的屬性值。可以通過重寫captureEndValues函數，并把你自定義的屬性動畫里面的最終屬性值放進去。

我們先看一個最簡單的示例：


看看效果吧~

最后5.0這部分借鑒（copy）于兩位大神，僅作為個人學習參考資料，如有侵權告知立刪除，附源圖如下

5.0部分原創公眾號
最后編輯于 ：
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發布，文章內容僅代表作者本人觀點，簡書系信息發布平臺，僅提供信息存儲服務。

推薦閱讀更多精彩內容