第二十六講：Android之Animation

標籤：android   style   blog   http   io   color   ar   使用   java   

懶惰象生鏽一樣，比操勞更能消耗身體；經常用的鑰匙，總是亮閃閃的。 —— 富蘭克林

本講內容：Animation 動畫

一、Android中動畫的實現分兩種方式，一種方式是補間動畫 Tween Animation，就是說你定義一個開始和結束，中間的部分由程式運算得到。另一種叫逐幀動畫 Frame Animation，就是說一幀一幀的連起來播放就變成了動畫。和放電影的機制很相似，下面我們逐個學習。

下面引用官方文檔

從圖我們可以知道Animation的直接子類有AlphaAnimation、AnimationSet、RotateAnimation、ScaleAnimation、TranslateAnimation。其中AnimationSet包含一系列的Animation。

二、Tween動畫是操作某個控制項讓其展現出旋轉()、漸層、移動、縮放的這麼一種轉換過程。我們可以以XML形式定義動畫，也可以編碼實現。

三、Tween Animation共同的節點屬性

屬性[類型]	功能	備忘
Duration[long]	動畫期間	毫秒為單位
fillAfter [boolean]	當設定為true	動畫執行後，控制項將停留在執行結束的狀態
fillBefore[boolean]	當設定為true	動畫執行後，控制項將停留在執行之前的狀態
repeatCount[int]	動畫的重複次數
RepeatMode[int]	定義重複的行為	1：重新開始  2：plays backward
startOffset[long]	動畫執行之前的等待時間	毫秒為單位

四、alpha  漸層透明度動畫效果（範圍在0.0和1.0之間，分別代表透明和完全不透明）

android:fromAlpha="1.0"	代表起始alpha值	浮點值，範圍在0.0和1.0之間
android:toAlpha="0.0"	代表結尾alpha值	浮點值，範圍也在0.0和1.0之間。
android:duration="500"	動畫期間	毫秒為單位

五、scale 漸層尺寸伸縮動畫效果（浮點值，比如1.0代表自身無變化，0.5代表起始時縮小一倍，2.0代表放大一倍）

android:fromXScale	起始的X方向上相對自身的縮放比例	浮點值，範圍在0.0和1.0之間
android:toXScale	結尾的X方向上相對自身的縮放比例
android:fromYScale	起始的Y方向上相對自身的縮放比例
android:toYScale	結尾的Y方向上相對自身的縮放比例
android:pivotX	縮放的中軸點X座標	如果想表示中軸點為映像的中心，
android:pivotY	縮放的中軸點Y座標	可以把兩個屬性值定義成0.5或者50%。

android:pivotX屬性代表旋轉中心的X座標值，android:pivotY屬性代表旋轉中心的Y座標值，
這兩個屬性也有三種表示方式，
數字方式代表相對於自身左邊緣的像素值，（絕對位置定位）Ainmation.ABSOLUTE
num%方式代表相對於自身左邊緣或頂邊緣的百分比，（相對於控制項本身定位）Ainmation.RELATIVE_TO_SELF
num%p方式代表相對於父容器的左邊緣或頂邊緣的百分比。（相對於父控制項） Ainmation.RELATIVE_TO_PARENF

六、translate  畫面轉換位置移動動畫效果（代表一個水平、垂直的位移）

android:fromXDelta	起始X方向的位置	浮點數、num%、num%p
android:toXDelta	結尾X方向上的位置
android:fromYScale	起始Y方向上的位置
android:toYDelta	結尾Y方向上的位置

以上四個屬性都支援三種表示方式：浮點數、num%、num%p

數字方式代表相對於自身左邊緣的像素值，（絕對位置定位）
num%方式代表相對於自身左邊緣或頂邊緣的百分比，（相對於控制項本身定位）100%表示移動自己的1倍距離
num%p方式代表相對於父容器的左邊緣或頂邊緣的百分比。（相對於父控制項）

七、rotate  畫面轉移旋轉動畫效果

android:fromDegrees	代表起始角度	浮點值，單位：度
android:toDegrees	代表結尾角度	浮點值，單位：度
android:pivotX	旋轉中心的X座標
android:pivotY	表旋轉中心的Y座標值

我們通過一個例子感受一下，代碼的講解都寫在注釋裡了

下面是res/layout/activity_main.xml 布局檔案：

<LinearLayout 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:orientation="vertical"    tools:context="com.example.text.MainActivity$PlaceholderFragment" > <ImageView         android:id="@+id/image"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:src="@drawable/ic_launcher"        android:layout_weight="1"/>   <Button        android:id="@+id/translate"        android:layout_width="match_parent"       android:layout_height="wrap_content"       android:text="測試translate動畫效果" />   <Button        android:id="@+id/alpha"        android:layout_width="match_parent"       android:layout_height="wrap_content"       android:text="測試alpha動畫效果" />   <Button        android:id="@+id/rotate"        android:layout_width="match_parent"       android:layout_height="wrap_content"       android:text="測試rotate動畫效果" />   <Button        android:id="@+id/scale"        android:layout_width="match_parent"       android:layout_height="wrap_content"       android:text="測試scale動畫效果" />    </LinearLayout>

下面是MainActivity.java主介面檔案：

public class MainActivity extends Activity implements OnClickListener {private Button translate;private Button alpha;private Button rotate;private Button scale;private ImageView image;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);image = (ImageView) findViewById(R.id.image);translate = (Button) findViewById(R.id.translate);alpha = (Button) findViewById(R.id.alpha);rotate = (Button) findViewById(R.id.rotate);scale = (Button) findViewById(R.id.scale);translate.setOnClickListener(this);alpha.setOnClickListener(this);rotate.setOnClickListener(this);scale.setOnClickListener(this);}@Overridepublic void onClick(View v) {// 建立一個AnimationSet對象AnimationSet animationSet = new AnimationSet(true);switch (v.getId()) {case R.id.alpha:// 建立一個AlphaAnimation對象AlphaAnimation alphaAnimation = new AlphaAnimation(1, 0);// 設定動畫執行的時間（單位：毫秒）alphaAnimation.setDuration(1000);// 將AlphaAnimation對象添加到AnimationSet當中animationSet.addAnimation(alphaAnimation);// 使用ImageView的startAnimation方法開始執行動畫image.startAnimation(animationSet);break;case R.id.translate:TranslateAnimation translateAnimation = new TranslateAnimation(Animation.RELATIVE_TO_SELF, 0f, Animation.RELATIVE_TO_SELF,0.5f, Animation.RELATIVE_TO_SELF, 0f,Animation.RELATIVE_TO_SELF, 1.0f);translateAnimation.setDuration(1000);animationSet.addAnimation(translateAnimation);image.startAnimation(animationSet);break;case R.id.rotate:RotateAnimation rotateAnimation = new RotateAnimation(0, 360,Animation.RELATIVE_TO_PARENT, 1f,Animation.RELATIVE_TO_PARENT, 0f);rotateAnimation.setDuration(5000);animationSet.addAnimation(rotateAnimation);image.startAnimation(animationSet);break;case R.id.scale:ScaleAnimation scaleAnimation = new ScaleAnimation(1, 0.1f, 1,0.1f, Animation.RELATIVE_TO_SELF, 0.5f,Animation.RELATIVE_TO_SELF, 0.5f);animationSet.addAnimation(scaleAnimation);animationSet.setStartOffset(1000);animationSet.setDuration(2000);image.startAnimation(animationSet);break;}}}

下面是運行結果：

本講到這裡，謝謝大家！

第二十六講：Android之Animation