1. 程式人生 > >Android 5.X Activity過渡動畫,以及漂亮的共享元素效果

Android 5.X Activity過渡動畫,以及漂亮的共享元素效果

曾經的Android在Activity進行跳轉的時候,只是非常生硬的進行切換,即使使用overPendingtransition(int inId,int outId)這個方法來給Activity增加一些切換動畫效果也很是差強人意。而在Android 5.X中,Google對動畫效果進行了更深一步的詮釋,為Activity的轉場效果設計了更加豐富的動畫效果。

Android 5.X 提供了三種Transition型別:

  • 進入:一個進入的過渡動畫決定Activity中的素有的檢視怎麼進入螢幕。

  • 退出:一個退出的過渡動畫決定了一個Activity 中的所有檢視怎麼退出螢幕。

  • 共享元素:一個共享元素過渡動畫決定兩個Activity之間的過渡,怎麼共享它們的檢視。

進入和退出的效果包括:

  • explode(分解) ———從螢幕中間進或出,移動檢視。

  • slide(滑動)———從螢幕邊緣進或出,移動檢視。

  • fade(淡出)———通過改變螢幕上檢視的不透明度達到新增或移除的效果

    共享元素包括:

  • changeBounds———改變目標檢視的佈局邊界

  • changeClipBounds———裁切目標檢視邊界

  • changeTransform———改變目標檢視的縮放比例和旋轉角度

  • changeImageTransfrom———改變目標圖片的大小和縮放比例

目前市面上的應用,各個頁面之間的轉場動畫總能給人眼前一亮的感覺。唯獨對 共享元素這個Activity跳轉過渡的效果情有獨鍾O(∩_∩)O。

下面看一下共享元素的執行效果(共享一個View):

這裡寫圖片描述

實現過程:

  1. 首先需要給當前的Activity的佈局檔案中設定要共享的元素,給它增加相應的屬性:

這裡寫圖片描述

  1. 給跳轉的Activity的佈局檔案也增加相同的屬性,共享元素的屬性名要保持一致。

這裡寫圖片描述

注:一定要保證命名相同,這樣系統才能找到共享元素

FirstActivity.java中的程式碼:

    //共享元素
    public void share(View v){

        Intent intent = new Intent(this,SecondActivity.class);

        startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(this
,imageView,"share").toBundle()); }

這樣一個簡單的共享元素的Activity跳轉效果就實現了。

同樣也可以共享多個元素!

共享多個元素的執行效果:

這裡寫圖片描述

共享多個元素,可以通過Pair.create(),來建立多個共享元素。

FirstActivity.java實現多個元素共享的程式碼如下:

   //共享多個多個元素
    public void share_more(View v){

        Intent intent = new Intent(this,SecondActivity.class);

        ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(this,
                Pair.create(imageView,"share"),
                Pair.create(v,"share1"));

        startActivity(intent,options.toBundle());
    }

另外的三種Activity過渡動畫
的實現:

  • explode(分解) ———從螢幕中間進或出,移動檢視。

  • slide(滑動)———從螢幕邊緣進或出,移動檢視。

  • fade(淡出)———通過改變螢幕上檢視的不透明度達到新增或移除的效果

1.在需要設定動畫的頁面上設定如下所示程式碼:

getWindow().requestFeature(Window.FEATURE_CONTENT_TRANSITIONS);// 允許使用transitions 

也可以在樣式檔案中設定如下程式碼:

 <item name="android:windowContentTransitions">true</item>

2.接下來就可以設定進入Activty或退出Activty的動畫了

//進入動畫
   getWindow().setEnterTransition(new Explode().setDuration(500).setInterpolator(new AccelerateInterpolator()));
                getWindow().setReturnTransition(new Explode().setDuration(500));

常用動畫的設定:

getWindow().setEnterTransition(); //首次進入顯示的動畫
        getWindow().setExitTransition(); //啟動一個新Activity,當前頁的退出動畫
       getWindow().setReturnTransition(); //呼叫 finishAfterTransition() 退出時,當前頁退出的動畫
        getWindow().setReenterTransition(); //重新進入的動畫。即第二次進入,可以和首次進入不一樣。

這三個類都繼承於 Transition ,所有有一些屬性都是共同的。

常用屬性如下:

// 設定動畫的監聽事件
transition.addListener()
// 設定動畫的時間。型別:long
transition.setDuration();
// 設定修飾動畫,定義動畫的變化率,具體設定往下翻就看到了
transition.setInterpolator();
// 設定動畫開始時間,延遲n毫秒播放。型別:long
transition.setStartDelay();
// 設定動畫的執行路徑
transition.setPathMotion();
// 改變動畫 出現/消失 的模式。Visibility.MODE_IN:進入;Visibility.MODE_OUT:退出。
transition.setMode();

可設定的插值器的型別:

AccelerateDecelerateInterpolator //在動畫開始與結束的地方速率改變比較慢,在中間的時候加速

AccelerateInterpolator  //在動畫開始的地方速率改變比較慢,然後開始加速

AnticipateInterpolator //開始的時候向後然後向前甩

AnticipateOvershootInterpolator //開始的時候向後然後向前甩一定值後返回最後的值

BounceInterpolator   //動畫結束的時候彈起

CycleInterpolator //動畫迴圈播放特定的次數,速率改變沿著正弦曲線

DecelerateInterpolator //在動畫開始的地方快然後慢

LinearInterpolator   //以常量速率改變

OvershootInterpolator   // 向前甩一定值後再回到原來位置

3 . 需要將Activity跳轉的程式碼startActivity(intent)的方法改為:

startActivity(intent,ActivityOptions.makeSceneTransitionAnimation(this).toBundle());

執行效果:

explode(分解):

這裡寫圖片描述

slide(滑動):

這裡寫圖片描述

fade(淡出):

這裡寫圖片描述

Google重新定義了動畫效果 (●’◡’●)