Android中的動畫效果學習

Tween動畫中，我們可以通過Tween動畫去使得視圖實現視圖放大，縮小，旋轉，漸變等等功能；這個動畫類在android.view.animation包下面，

主要為我們提供以下的一些常用方法：（【注】以下對於些類的解釋說明，是我看文檔自己翻譯的，可能有些地方不准確，也算是自己作為學習英語的機會，還請大家見諒一下哈）

  Animation   這是動畫的抽象類，其他的幾個實現的動畫類繼承這個類

  AnimationSet這是動畫的屬性的集合類

  AnimationUtils   這個類是定義動畫工具類

  AlphaAnimation    這個類可以對動畫的透明度進行控制

  RotateAnimation   這個類可以對動畫的旋轉的位置進行控制
  ScaleAnimation   這個類可以對動畫的大小進行控制

 TranslateAnimation  這個類可以對動畫位置進行控制

下面是Twwen動畫的一些常用動畫實現類的說明

AlphaAnimation 類（漸變調整透明度）常用的構造方法
AlphaAnimation(float fromAlpha, float toAlpha)   
參數說明：

                      float fromAlpha ：動畫剛開始的透明度   ,  

                       float toAlpha：動畫結束的透明度  取值范圍是(0.0到1.0,；0.0代表不透明，1.0代表完全透明)

            RoateAnimation 類 (動畫旋轉)   常用的構造方法     
           RotateAnimation(float fromDegrees, float toDegrees)，
           RotateAnimation(float fromDegrees, float toDegrees, float pivotX, float pivotY)，
           RotateAnimation(float fromDegrees, float toDegrees, int pivotXType, float pivotXValue, int pivotYType, float pivotYValue)
           參數說明:fromDegrees：開始旋轉的角度,.toDegrees:結束旋轉的角度
                            .pivotXType:在X坐標方向的伸縮的方式，pivotYType:在Y坐標方向的伸縮方式;
                             pivotXValue:在X坐標方向的伸縮值，pivotYValue:在Y坐標方向的伸縮值

            ScaleAnimation 類(動畫大小的控制類) 常用的構造方法
             ScaleAnimation(float fromX, float toX, float fromY, float toY)
             ScaleAnimation(float fromX, float toX, float fromY, float toY, float pivotX, float pivotY)
             ScaleAnimation(float fromX, float toX, float fromY, float toY, int pivotXType, float pivotXValue, int pivotYType, float pivotYValue)
             參數說明:fromX: 起始的X坐標,toX:結束的X坐標,fromY:起始的Y坐標,toY:結束的Y坐標
                            .pivotXType:在X坐標方向的伸縮的方式，pivotYType:在Y坐標方向的伸縮方式;                      
                             pivotXValue:在X坐標方向的伸縮值，pivotYValue:在Y坐標方向的伸縮值

           TranslateAnimation類(動畫位置控制) 常用的構造方法
           TranslateAnimation(float fromXDelta, float toXDelta, float fromYDelta, float toYDelta)
          參數說明: fromXDelta:起始的X坐標;toXDelta:結束的X坐標
                            fromYDelta:起始的Y坐標,toYDelta:結束的Y坐標
 

  要實現Twwen動畫的效果，有兩種辦法 第一個種是直接在代碼中進行設置，第二種是在XML文件進行配置；

  首先下看下直接編碼設置的辦法：

Demo源代碼如下:

1. package com.android.animation;  
2.   
3. import com.android.R;  
4.   
5. import android.app.Activity;  
6. import android.os.Bundle;  
7. import android.view.View;  
8. import android.view.View.OnClickListener;  
9. import android.view.animation.AlphaAnimation;  
10. import android.view.animation.Animation;  
11. import android.view.animation.RotateAnimation;  
12. import android.view.animation.ScaleAnimation;  
13. import android.view.animation.TranslateAnimation;  
14. import android.widget.Button;  
15. import android.widget.ImageView;  
16.   
17. public class Demo_Animation extends Activity {  
18.   
19.     // 定義四個按鈕，分別對用四種動畫效果操作   
20.     private Button alpha, roate, scale, translate;  
21.   
22.     // 聲明ImageView組件   
23.     private ImageView animation_test;  
24.   
25.     @Override  
26.     protected void onCreate(Bundle savedInstanceState) {  
27.         super.onCreate(savedInstanceState);  
28.         setContentView(R.layout.animation);  
29.   
30.         animation_test = (ImageView) this.findViewById(R.id.test_animation);  
31.         alpha = (Button) this.findViewById(R.id.alpha);  
32.         roate = (Button) this.findViewById(R.id.roate);  
33.         scale = (Button) this.findViewById(R.id.scale);  
34.         translate = (Button) this.findViewById(R.id.translate);  
35.   
36.         // 為按鈕組件添加監聽事件   
37.         alpha.setOnClickListener(new OnClickListener() {  
38.   
39.             @Override  
40.             public void onClick(View v) {  
41.   
42.                 // 創建漸變的 AlphaAnimation（）構造方法中 參數要加 f 因為是浮點型的   
43.                 Animation alphaAnimation = new AlphaAnimation(0.0f, 1.0f);  
44.                 // 設置畫面漸變的時間 單位:毫秒 本實例設置為3 s   
45.                 alphaAnimation.setDuration(3000);  
46.                 // 為圖片添加效果，開始動畫   
47.                 animation_test.setAnimation(alphaAnimation);  
48.             }  
49.         });  
50.   
51.         roate.setOnClickListener(new OnClickListener() {  
52.   
53.             /** 
54.              * 其中有設置旋轉的伸縮的方法 有 
55.              *  
56.              * @author jiangqq ①：Animation.RELATIVE_TO_SELF 
57.              * @author jiangqq ②：Animation.RELATIVE_TO_PARENT 
58.              * @author jiangqq ③：Animation.ABSOLUTE 
59.              */  
60.             @Override  
61.             public void onClick(View v) {  
62.                 // 設置旋轉   
63.                 Animation roateAnimation = new RotateAnimation(0f, +180f,  
64.                         Animation.RELATIVE_TO_SELF, 1.0f,  
65.                         Animation.RELATIVE_TO_SELF, 1.0f);  
66.                 // 設置畫面漸變的時間 單位:毫秒 本實例設置為3 s   
67.                 roateAnimation.setDuration(3000);  
68.                 // 為圖片添加效果，開始動畫   
69.                 animation_test.setAnimation(roateAnimation);  
70.             }  
71.         });  
72.   
73.         scale.setOnClickListener(new OnClickListener() {  
74.   
75.             /** 
76.              * 其中沿X軸與Y軸的伸縮方式的三種模式 在上面roate監聽類方法中有說明了 
77.              */  
78.             @Override  
79.             public void onClick(View v) {  
80.                 Animation scaleAnimation = new ScaleAnimation(0.0f, 1.0f, 0.0f,  
81.                         1.0f, Animation.RELATIVE_TO_SELF, 1.5f,  
82.                         Animation.RELATIVE_TO_SELF, 1.5f);  
83.                 // 設置畫面漸變的時間 單位:毫秒 本實例設置為3 s   
84.                 scaleAnimation.setDuration(3000);  
85.                 // 為圖片添加效果，開始動畫   
86.                 animation_test.setAnimation(scaleAnimation);  
87.             }  
88.         });  
89.         translate.setOnClickListener(new OnClickListener() {  
90.   
91.             /** 
92.              * 位置變化 
93.              */  
94.             @Override  
95.             public void onClick(View v) {  
96.                 Animation translateAnimation = new TranslateAnimation(0.0f,  
97.                         15.0f, 0.0f, 15.0f);  
98.                 // 設置畫面漸變的時間 單位:毫秒 本實例設置為3 s   
99.                 translateAnimation.setDuration(3000);  
100.                 // 為圖片添加效果，開始動畫   
101.                 animation_test.setAnimation(translateAnimation);  
102.             }  
103.         });  
104.     }  
105. }  

1. </pre><p></p><p><span style="font-size:16px;">布局文件如下：</span></p><p><span style="font-size:16px;">  </span></p><p><span style="font-size:16px;"></span></p><p><span style="font-size:16px;"></span></p><pre name="code" class="html"><?xml version="1.0" encoding="utf-8"?>  
2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
3.     android:layout_width="match_parent"  
4.     android:layout_height="match_parent"  
5.     android:orientation="vertical" >  
6.   
7.     <ImageView  
8.         android:id="@+id/test_animation"  
9.         android:layout_width="wrap_content"  
10.         android:layout_height="wrap_content"  
11.         android:src="@drawable/animation_test" />  
12.   
13.     <LinearLayout  
14.         xmlns:android="http://schemas.android.com/apk/res/android"  
15.         android:layout_width="match_parent"  
16.         android:layout_height="match_parent"  
17.         android:layout_marginTop="20dip" >  
18.   
19.         <Button  
20.             android:id="@+id/alpha"  
21.             android:layout_width="wrap_content"  
22.             android:layout_height="wrap_content"  
23.             android:text="alpha" />  
24.   
25.         <Button  
26.             android:id="@+id/roate"  
27.             android:layout_width="wrap_content"  
28.             android:layout_height="wrap_content"  
29.             android:text="roate" />  
30.   
31.         <Button  
32.             android:id="@+id/scale"  
33.             android:layout_width="wrap_content"  
34.             android:layout_height="wrap_content"  
35.             android:text="scale" />  
36.   
37.         <Button  
38.             android:id="@+id/translate"  
39.             android:layout_width="wrap_content"  
40.             android:layout_height="wrap_content"  
41.             android:text="translate" />  
42.     </LinearLayout>  
43.   
44. </LinearLayout>