目錄(?)[+]

1、概述

Android提供了幾種動畫型別：View Animation 、Drawable Animation 、Property Animation 。View Animation相當簡單，不過只能支援簡單的縮放、平移、旋轉、透明度基本的動畫，且有一定的侷限性。比如：你希望View有一個顏色的切換動畫；你希望可以使用3D旋轉動畫；你希望當動畫停止時，View的位置就是當前的位置；這些View Animation都無法做到。這就是Property Animation產生的原因，本篇部落格詳細介紹Property Animation的用法。至於Drawable Animation，嗯，略~

2、相關API

Property Animation故名思議就是通過動畫的方式改變物件的屬性了，我們首先需要了解幾個屬性：

Duration動畫的持續時間，預設300ms。

Time interpolation：時間差值，乍一看不知道是什麼，但是我說LinearInterpolator、AccelerateDecelerateInterpolator，大家一定知道是幹嘛的了，定義動畫的變化率。

Repeat count and behavior：重複次數、以及重複模式；可以定義重複多少次；重複時從頭開始，還是反向。

Animator sets: 動畫集合，你可以定義一組動畫，一起執行或者順序執行。

Frame refresh delay：幀重新整理延遲，對於你的動畫，多久重新整理一次幀；預設為10ms，但最終依賴系統的當前狀態；基本不用管。

相關的類

ObjectAnimator  動畫的執行類，後面詳細介紹

ValueAnimator 動畫的執行類，後面詳細介紹 

AnimatorSet 用於控制一組動畫的執行：線性，一起，每個動畫的先後執行等。

AnimatorInflater 使用者載入屬性動畫的xml檔案

TypeEvaluator  型別估值，主要用於設定動畫操作屬性的值。

TimeInterpolator 時間插值，上面已經介紹。

總的來說，屬性動畫就是，動畫的執行類來設定動畫操作的物件的屬性、持續時間，開始和結束的屬性值，時間差值等，然後系統會根據設定的引數動態的變化物件的屬性。

3、ObjectAnimator實現動畫

之所以選擇ObjectAnimator為第一個~~是因為，這個實現最簡單~~一行程式碼，秒秒鐘實現動畫，下面看個例子：
佈局檔案：

1. <RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"
2.     xmlns:tools="http://schemas.android.com/tools"
3.     android:layout_width="match_parent"
4.     android:layout_height="match_parent"
5.     android:id="@+id/id_container">
6.     <ImageView
7.         android:id="@+id/id_ball"
8.         android:layout_width="wrap_content"
9.         android:layout_height="wrap_content"
10.         android:layout_centerInParent="true"
11.         android:src="@drawable/mv"
12.         android:scaleType="centerCrop"
13.         android:onClick="rotateyAnimRun"
14.         />
15. </RelativeLayout>

很簡單，就一張妹子圖片~
Activity程式碼：

1. package com.example.zhy_property_animation;  
2. import android.animation.ObjectAnimator;  
3. import android.app.Activity;  
4. import android.os.Bundle;  
5. import android.view.View;  
6. publicclass ObjectAnimActivity extends Activity  
7. {  
8.     @Override
9.     protectedvoid onCreate(Bundle savedInstanceState)  
10.     {  
11.         super.onCreate(savedInstanceState);  
12.         setContentView(R.layout.xml_for_anim);  
13.     }  
14.     publicvoid rotateyAnimRun(View view)  
15.     {  
16.          ObjectAnimator//
17.          .ofFloat(view, "rotationX", 0.0F, 360.0F)//
18.          .setDuration(500)//
19.          .start();  
20.     }  
21. }  

效果：

是不是一行程式碼就能實現簡單的動畫~~

對於ObjectAnimator

1、提供了ofInt、ofFloat、ofObject，這幾個方法都是設定動畫作用的元素、作用的屬性、動畫開始、結束、以及中間的任意個屬性值。

當對於屬性值，只設置一個的時候，會認為當然物件該屬性的值為開始（getPropName反射獲取），然後設定的值為終點。如果設定兩個，則一個為開始、一個為結束~~~

動畫更新的過程中，會不斷呼叫setPropName更新元素的屬性，所有使用ObjectAnimator更新某個屬性，必須得有getter（設定一個屬性值的時候）和setter方法~

2、如果你操作物件的該屬性方法裡面，比如上例的setRotationX如果內部沒有呼叫view的重繪，則你需要自己按照下面方式手動呼叫。

1. anim.addUpdateListener(new AnimatorUpdateListener()  
2.         {  
3.             @Override
4.             publicvoid onAnimationUpdate(ValueAnimator animation)  
5.             {  
6. //              view.postInvalidate();
7. //              view.invalidate();
8.             }  
9.         });  

3、看了上面的例子，因為設定的操作的屬性只有一個，那麼如果我希望一個動畫能夠讓View既可以縮小、又能夠淡出（3個屬性scaleX,scaleY,alpha），只使用ObjectAnimator咋弄？

想法是不是很不錯，可能會說使用AnimatorSet啊，這一看就是一堆動畫塞一起執行，但是我偏偏要用一個ObjectAnimator例項實現呢~下面看程式碼：

1. publicvoid rotateyAnimRun(final View view)  
2. {  
3.     ObjectAnimator anim = ObjectAnimator//
4.             .ofFloat(view, "zhy", 1.0F,  0.0F)//
5.             .setDuration(500);//
6.     anim.start();  
7.     anim.addUpdateListener(new AnimatorUpdateListener()  
8.     {  
9.         @Override
10.         publicvoid onAnimationUpdate(ValueAnimator animation)  
11.         {  
12.             float cVal = (Float) animation.getAnimatedValue();  
13.             view.setAlpha(cVal);  
14.             view.setScaleX(cVal);  
15.             view.setScaleY(cVal);  
16.         }  
17.     });  
18. }  

把設定屬性的那個字串，隨便寫一個該物件沒有的屬性，就是不管~~咱們只需要它按照時間插值和持續時間計算的那個值，我們自己手動呼叫~

效果：

這個例子就是想說明一下，有時候換個思路不要被API所約束，利用部分API提供的功能也能實現好玩的效果~~~

比如：你想實現拋物線的效果，水平方向100px/s，垂直方向加速度200px/s*s ，咋實現呢~~可以自己用ObjectAnimator試試~

4、其實還有更簡單的方式，實現一個動畫更改多個效果：使用propertyValuesHolder

1. publicvoid propertyValuesHolder(View view)  
2.     {  
3.         PropertyValuesHolder pvhX = PropertyValuesHolder.ofFloat("alpha", 1f,  
4.                 0f, 1f);  
5.         PropertyValuesHolder pvhY = PropertyValuesHolder.ofFloat("scaleX", 1f,  
6.                 0, 1f);  
7.         PropertyValuesHolder pvhZ = PropertyValuesHolder.ofFloat("scaleY", 1f,  
8.                 0, 1f);  
9.         ObjectAnimator.ofPropertyValuesHolder(view, pvhX, pvhY,pvhZ).setDuration(1000).start();  
10.     }  

 4、ValueAnimator實現動畫

和ObjectAnimator用法很類似，簡單看一下用view垂直移動的動畫程式碼：

1. publicvoid verticalRun(View view)  
2.     {  
3.         ValueAnimator animator = ValueAnimator.ofFloat(0, mScreenHeight  
4.                 - mBlueBall.getHeight());  
5.         animator.setTarget(mBlueBall);  
6.         animator.setDuration(1000).start();  
7.     }  

給你的感覺是不是，坑爹啊，這和ValueAnimator有毛線區別~但是仔細看，你看會發現，沒有設定操作的屬性~~也就是說，上述程式碼是沒有任何效果的，沒有指定屬性~

這就是和ValueAnimator的區別之處：ValueAnimator並沒有在屬性上做操作，你可能會問這樣有啥好處？我豈不是還得手動設定？

好處：不需要操作的物件的屬性一定要有getter和setter方法，你可以自己根據當前動畫的計算值，來操作任何屬性，記得上例的那個【我希望一個動畫能夠讓View既可以縮小、又能夠淡出（3個屬性scaleX,scaleY,alpha）】嗎？其實就是這麼個用法~

例項：

佈局檔案：

1. <RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"
2.     xmlns:tools="http://schemas.android.com/tools"
3.     android:layout_width="match_parent"
4.     android:layout_height="match_parent"
5.     android:id="@+id/id_container"
6.     >
7.     <ImageView
8.         android:id="@+id/id_ball"
9.         android:layout_width="wrap_content"
10.         android:layout_height="wrap_content"
11.         android:src="@drawable/bol_blue"/>
12.     <LinearLayout
13.         android:layout_width="fill_parent"
14.         android:layout_height="wrap_content"
15.         android:layout_alignParentBottom="true"
16.         android:orientation="horizontal">
17.         <Button
18.             android:layout_width="wrap_content"
19.             android:layout_height="wrap_content"
20.             android:onClick="verticalRun"
21.             android:text="垂直"/>
22.         <Button
23.             android:layout_width="wrap_content"
24.             android:layout_height="wrap_content"
25.             android:onClick="paowuxian"
26.             android:text="拋物線"/>
27.     </LinearLayout>
28. </RelativeLayout>

左上角一個小球，底部兩個按鈕~我們先看一個自由落體的程式碼：

1. /** 
2.      * 自由落體 
3.      * @param view 
4.      */
5.     publicvoid verticalRun( View view)  
6.     {  
7.         ValueAnimator animator = ValueAnimator.ofFloat(0, mScreenHeight  
8.                 - mBlueBall.getHeight());  
9.         animator.setTarget(mBlueBall);  
10.         animator.setDuration(1000).start();  
11. //      animator.setInterpolator(value)
12.         animator.addUpdateListener(new AnimatorUpdateListener()  
13.         {  
14.             @Override
15.             publicvoid onAnimationUpdate(ValueAnimator animation)  
16.             {  
17.                 mBlueBall.setTranslationY((Float) animation.getAnimatedValue());  
18.             }  
19.         });  
20.     }  

與ObjectAnimator不同的就是我們自己設定元素屬性的更新~雖然多了幾行程式碼，但是貌似提高靈活性~

下面再來一個例子，如果我希望小球拋物線運動【實現拋物線的效果，水平方向100px/s，垂直方向加速度200px/s*s 】，分析一下，貌似只和時間有關係，但是根據時間的變化，橫向和縱向的移動速率是不同的，我們該咋實現呢？此時就要重寫TypeValue的時候了，因為我們在時間變化的同時，需要返回給物件兩個值，x當前位置，y當前位置：

程式碼：

1. /** 
2.      * 拋物線 
3.      * @param view 
4.      */
5.     publicvoid paowuxian(View view)  
6.     {  
7.         ValueAnimator valueAnimator = new ValueAnimator();  
8.         valueAnimator.setDuration(3000);  
9.         valueAnimator.setObjectValues(new PointF(0, 0));  
10.         valueAnimator.setInterpolator(new LinearInterpolator());  
11.         valueAnimator.setEvaluator(new TypeEvaluator<PointF>()  
12.         {  
13.             // fraction = t / duration
14.             @Override
15.             public PointF evaluate(float fraction, PointF startValue,  
16.                     PointF endValue)  
17.             {  
18.                 Log.e(TAG, fraction * 3 + "");  
19.                 // x方向200px/s ，則y方向0.5 * 10 * t
20.                 PointF point = new PointF();  
21.                 point.x = 200 * fraction * 3;  
22.                 point.y = 0.5f * 200 * (fraction * 3) * (fraction * 3);  
23.                 return point;  
24.             }  
25.         });  
26.         valueAnimator.start();  
27.         valueAnimator.addUpdateListener(new AnimatorUpdateListener()  
28.         {  
29.             @Override
30.             publicvoid onAnimationUpdate(ValueAnimator animation)  
31.             {  
32.                 PointF point = (PointF) animation.getAnimatedValue();  
33.                 mBlueBall.setX(point.x);  
34.                 mBlueBall.setY(point.y);  
35.             }  
36.         });  
37.     }  

可以看到，因為ofInt,ofFloat等無法使用，我們自定義了一個TypeValue，每次根據當前時間返回一個PointF物件，（PointF和Point的區別就是x,y的單位一個是float,一個是int;RectF,Rect也是）PointF中包含了x,y的當前位置～然後我們在監聽器中獲取，動態設定屬性：

效果圖：

有木有兩個鐵球同時落地的感覺~~對，我應該搞兩個球~~ps:物理公式要是錯了，就當沒看見哈

自定義TypeEvaluator傳入的泛型可以根據自己的需求，自己設計個Bean。

好了，我們已經分別講解了ValueAnimator和ObjectAnimator實現動畫；二者區別；如何利用部分API，自己更新屬性實現效果；自定義TypeEvaluator實現我們的需求；但是我們並沒有講如何設計插值，其實我覺得把，這個插值預設的那一串實現類夠用了~~很少，會自己去設計個超級變態的~嗯~所以：略。

5、監聽動畫的事件

對於動畫，一般都是一些輔助效果，比如我要刪除個元素，我可能希望是個淡出的效果，但是最終還是要刪掉，並不是你透明度沒有了，還佔著位置，所以我們需要知道動畫如何結束。

所以我們可以新增一個動畫的監聽:

1. publicvoid fadeOut(View view)  
2.     {  
3.         ObjectAnimator anim = ObjectAnimator.ofFloat(mBlueBall, "alpha", 0.5f);  
4.         anim.addListener(new AnimatorListener()  
5.         {  
6.             @Override
7.             publicvoid onAnimationStart(Animator animation)  
8.             {  
9.                 Log.e(TAG, "onAnimationStart");  
10.             }  
11.             @Override
12.             publicvoid onAnimationRepeat(Animator animation)  
13.             {  
14.                 // TODO Auto-generated method stub
15.                 Log.e(TAG, "onAnimationRepeat");  
16.             }  
17.             @Override
18.             publicvoid onAnimationEnd(Animator animation)  
19.             {  
20.                 Log.e(TAG, "onAnimationEnd");  
21.                 ViewGroup parent = (ViewGroup) mBlueBall.getParent();  
22.                 if (parent != null)  
23.                     parent.removeView(mBlueBall);  
24.             }  
25.             @Override
26.             publicvoid onAnimationCancel(Animator animation)  
27.             {  
28.                 // TODO Auto-generated method stub
29.                 Log.e(TAG, "onAnimationCancel");  
30.             }  
31.         });  
32.         anim.start();  
33.     }  

這樣就可以監聽動畫的開始、結束、被取消、重複等事件~但是有時候會覺得，我只要知道結束就行了，這麼長的程式碼我不能接收，那你可以使用AnimatorListenerAdapter

1. anim.addListener(new AnimatorListenerAdapter()  
2. {  
3.     @Override
4.     publicvoid onAnimationEnd(Animator animation)  
5.     {  
6.         Log.e(TAG, "onAnimationEnd");  
7.         ViewGroup parent = (ViewGroup) mBlueBall.getParent();  
8.         if (parent != null)  
9.             parent.removeView(mBlueBall);  
10.     }  
11. });  

AnimatorListenerAdapter繼承了AnimatorListener介面，然後空實現了所有的方法~

效果圖：

animator還有cancel()和end()方法：cancel動畫立即停止，停在當前的位置；end動畫直接到最終狀態。

6、AnimatorSet的使用

例項：

佈局檔案:

1. <RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"
2.     xmlns:tools="http://schemas.android.com/tools"
3.     android:layout_width="match_parent"
4.     android:layout_height="match_parent"
5.     android:id="@+id/id_container"
6.     >
7.     <ImageView
8.         android:id="@+id/id_ball"
9.         android:layout_width="wrap_content"
10.         android:layout_height="wrap_content"
11.         android:layout_centerInParent="true"
12.         android:src="@drawable/bol_blue"/>
13.     <LinearLayout
14.         android:layout_width="fill_parent"
15.         android:layout_height="wrap_content"
16.         android:layout_alignParentBottom="true"
17.         android:orientation="horizontal">
18.         <Button
19.             android:layout_width="wrap_content"
20.             android:layout_height="wrap_content"
21.             android:onClick="togetherRun"
22.             android:text="簡單的多動畫Together"/>
23.         <Button
24.             android:layout_width="wrap_content"
25.             android:layout_height="wrap_content"
26.             android:onClick="playWithAfter"
27.             android:text="多動畫按次序執行"/>
28.     </LinearLayout>
29. </RelativeLayout>

繼續玩球~

程式碼：

1. package com.example.zhy_property_animation;  
2. import android.animation.AnimatorSet;  
3. import android.animation.ObjectAnimator;  
4. import android.app.Activity;  
5. import android.os.Bundle;  
6. import android.view.View;  
7. import android.view.animation.LinearInterpolator;  
8. import android.widget.ImageView;  
9. publicclass AnimatorSetActivity extends Activity  
10. {  
11.     private ImageView mBlueBall;  
12.     @Override
13.     protectedvoid onCreate(Bundle savedInstanceState)  
14.     {  
15.         super.onCreate(savedInstanceState);  
16.         setContentView(R.layout.anim_set);  
17.         mBlueBall = (ImageView) findViewById(R.id.id_ball);  
18.     }  
19.     publicvoid togetherRun(View view)  
20.     {  
21.         ObjectAnimator anim1 = ObjectAnimator.ofFloat(mBlueBall, "scaleX",  
22.                 1.0f, 2f);  
23.         ObjectAnimator anim2 = ObjectAnimator.ofFloat(mBlueBall, "scaleY",  
24.                 1.0f, 2f);  
25.         AnimatorSet animSet = new AnimatorSet();  
26.         animSet.setDuration(2000);  
27.         animSet.setInterpolator(new LinearInterpolator());  
28.         //兩個動畫同時執行
29.         animSet.playTogether(anim1, anim2);  
30.         animSet.start();  
31.     }  
32.     publicvoid playWithAfter(View view)  
33.     {  
34.         float cx = mBlueBall.getX();  
35.         ObjectAnimator anim1 = ObjectAnimator.ofFloat(mBlueBall, "scaleX",  
36.                 1.0f, 2f);  
37.         ObjectAnimator anim2 = ObjectAnimator.ofFloat(mBlueBall, "scaleY",  
38.                 1.0f, 2f);  
39.         ObjectAnimator anim3 = ObjectAnimator.ofFloat(mBlueBall,  
40.                 "x",  cx ,  0f);  
41.         ObjectAnimator anim4 = ObjectAnimator.ofFloat(mBlueBall,  
42.                 "x", cx);  
43.         /** 
44.          * anim1，anim2,anim3同時執行 
45.          * anim4接著執行 
46.          */
47.         AnimatorSet animSet = new AnimatorSet();  
48.         animSet.play(anim1).with(anim2);  
49.         animSet.play(anim2).with(anim3);  
50.         animSet.play(anim4).after(anim3);  
51.         animSet.setDuration(1000);  
52.         animSet.start();  
53.     }  
54. }  

寫了兩個效果：

第一：使用playTogether兩個動畫同時執行，當然還有playSequentially依次執行~~

第二：如果我們有一堆動畫，如何使用程式碼控制順序，比如1，2同時；3在2後面；4在1之前等~就是效果2了

有一點注意：animSet.play().with();也是支援鏈式程式設計的，但是不要想著狂點，比如animSet.play(anim1).with(anim2).before(anim3).before(anim5); 這樣是不行的，系統不會根據你寫的這一長串來決定先後的順序，所以麻煩你按照上面例子的寫法，多寫幾行：

效果圖：

好了，由於篇幅~~關於屬性動畫還有點知識：

1、xml檔案建立屬性動畫

2、佈局動畫

3、View的animate方法等。

那就考慮寫到下一篇了，不過核心的功能就這些了~~

對了，如果使用11以下的SDK ，請匯入nineoldandroids動畫庫，用法基本完全一致~