轉：定義控件三部曲之動畫篇（一）——alpha、scale、translate、rotate、set的xml屬性及用法

前言：這幾天做客戶回訪，感觸很大，用戶只要是留反饋信息，總是一種恨鐵不成鋼的心態，想用你的app，卻是因為你的技術問題，讓他們不得不放棄，而你一個回訪電話卻讓他們盡釋前嫌，當最后把手機號留給他們以便隨時溝通的時候，總會發來一條條的鼓勵短信，讓我不自主的開始內疚。哎，多么可愛的用戶，多么無耐的現實。

相關文章：

《Android自定義控件三部曲文章索引》：http://blog.csdn.net/harvic880925/article/details/50995268

一、概述

Android的animation由四種類型組成：alpha、scale、translate、rotate，對應android官方文檔地址：《Animation Resources》

1、XML配置文件中

下面我們逐個講講每個標簽的屬性及用法。

2、動作文件存放位置

動作定義文件應該存放在res/anim文件夾下，訪問時采用R.anim.XXX.xml的方式，位置如圖：

二、scale標簽——調節尺寸

1、自有屬性

scale標簽是縮放動畫，可以實現動態調控件尺寸的效果，有下面幾個屬性：

下面看一個實例，當scale里的屬性這樣設置時，效果會怎樣呢：

（1）、pivotX取值數值時（50）

根據pivotX,pivotY的意義，控件的左上角即為控件的坐標原點，這里的起始點是在控件的原點的基礎上向X軸和Y軸各加上50px，做為起始點，如下圖中圖二所示

 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 圖一%20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20圖二    

（2）、pivotX取值百分數時（50%）下面再看看當pivotX、pivotY取百分數的時候，起始點又在哪里？

上面我們講了，pivotX的值，當取50%時，表示在原點坐標的基礎上加上的自己寬度的50%，看看效果：

 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 圖一%20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20圖二

   （3）、pivotX取值50%p時

效果圖，及起始點坐標圖如下所示：

2、從Animation類繼承的屬性

對于android:duration，就不再講解了，就是動畫的持續時長，以毫秒為單位，下面看看android:fillAfter和android:fillBefore

(1)android:fillAfter:保持動畫結束的狀態

（2）android:fillBefore  還原初始化狀態

[html] view plain copy <?xml version="1.0" encoding="utf-8"?>  <scale xmlns:android="http://schemas.android.com/apk/res/android"      android:fromXScale="0.0"      android:toXScale="1.4"      android:fromYScale="0.0"      android:toYScale="1.4"      android:pivotX="50%"      android:pivotY="50%"      android:duration="700"       android:fillBefore="true"      />   %20 %20 %20 %20 %20 %20 %20 %20android:fillBefore="true"%20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20android:fillEnable="true"

   

上面順便列出了，當僅設定fillEanble為true時的效果，這兩個的標簽的效果完全相同。

（3）、android:repeatMode="restart /reverse"  設定回放類型

[html] view plain copy <?xml version="1.0" encoding="utf-8"?>  <scale xmlns:android="http://schemas.android.com/apk/res/android"      android:fromXScale="0.0"      android:toXScale="1.4"      android:fromYScale="0.0"      android:toYScale="1.4"      android:pivotX="50%"      android:pivotY="50%"      android:duration="700"       android:fillBefore="true"      android:repeatCount="1"      android:repeatMode="restart"  />   %20 %20 %20 %20androidRepeatMode設為restart%20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20  androidRepeatMode設為reverse       

三、alpha標簽——調節透明度

1、自身屬性

android:fromAlpha   動畫開始的透明度，從0.0 --1.0 ，0.0表示全透明，1.0表示完全不透明android:toAlpha       動畫結束時的透明度，也是從0.0 --1.0 ，0.0表示全透明，1.0表示完全不透明使用示例：[html] view plain copy <?xml version="1.0" encoding="utf-8"?>  <alpha xmlns:android="http://schemas.android.com/apk/res/android"      android:fromAlpha="1.0"      android:toAlpha="0.1"      android:duration="3000"      android:fillBefore="true">  </alpha>  

2、從Animation類繼承的屬性

android:duration        動畫持續時間，以毫秒為單位 android:fillAfter          如果設置為true，控件動畫結束時，將保持動畫最后時的狀態android:fillBefore       如果設置為true,控件動畫結束時，還原到開始動畫前的狀態android:fillEnabled    與android:fillBefore 效果相同，都是在動畫結束時，將控件還原到初始化狀態android:repeatCount 重復次數android:repeatMode 重復類型，有reverse和restart兩個值，reverse表示倒序回放，restart表示重新放一遍，必須與repeatCount一起使用才能看到效果。因為這里的意義是重復的類型，即回放時的動作。android:interpolator  設定插值器，其實就是指定的動作效果，比如彈跳效果等，不在這小節中講解，后面會單獨列出一單講解。與scale標簽意義一樣，就不再綴述。

四、rotate標簽——旋轉

1、自身屬性

android:fromDegrees     開始旋轉的角度位置，正值代表順時針方向度數，負值代碼逆時針方向度數android:toDegrees         結束時旋轉到的角度位置，正值代表順時針方向度數，負值代碼逆時針方向度數android:pivotX               縮放起點X軸坐標，可以是數值、百分數、百分數p 三種樣式，比如 50、50%、50%p，具體意義已在scale標簽中講述，這里就不再重講android:pivotY               縮放起點Y軸坐標，可以是數值、百分數、百分數p 三種樣式，比如 50、50%、50%p[html] view plain copy <?xml version="1.0" encoding="utf-8"?>  <rotate xmlns:android="http://schemas.android.com/apk/res/android"      android:fromDegrees="0"      android:toDegrees="-650"      android:pivotX="50%"      android:pivotY="50%"      android:duration="3000"      android:fillAfter="true">        </rotate>  圍繞自身從0度逆時針旋轉650度%20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 圍繞自身從0度順時針旋轉650度

android:fromDegrees="0"%20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20android:fromDegrees="0"

android:toDegrees="-650"%20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 %20 android:toDegrees="650"

     

2、從Animation類繼承的屬性

android:duration        動畫持續時間，以毫秒為單位 android:fillAfter          如果設置為true，控件動畫結束時，將保持動畫最后時的狀態android:fillBefore       如果設置為true,控件動畫結束時，還原到開始動畫前的狀態android:fillEnabled    與android:fillBefore 效果相同，都是在動畫結束時，將控件還原到初始化狀態android:repeatCount 重復次數android:repeatMode 重復類型，有reverse和restart兩個值，reverse表示倒序回放，restart表示重新放一遍，必須與repeatCount一起使用才能看到效果。因為這里的意義是重復的類型，即回放時的動作。android:interpolator  設定插值器，其實就是指定的動作效果，比如彈跳效果等，不在這小節中講解，后面會單獨列出一單講解。與scale標簽意義一樣，就不再綴述。

五、translate標簽 —— 平移

1、自身屬性

android:fromXDelta     起始點X軸坐標，可以是數值、百分數、百分數p 三種樣式，比如 50、50%、50%p，具體意義已在scale標簽中講述，這里就不再重講android:fromYDelta    起始點Y軸從標，可以是數值、百分數、百分數p 三種樣式；android:toXDelta         結束點X軸坐標android:toYDelta        結束點Y軸坐標[html] view plain copy <?xml version="1.0" encoding="utf-8"?>  <translate xmlns:android="http://schemas.android.com/apk/res/android"      android:fromXDelta="0"       android:toXDelta="-80"      android:fromYDelta="0"      android:toYDelta="-80"      android:duration="2000"      android:fillBefore="true">  </translate>  

2、從Animation類繼承的屬性

android:duration        動畫持續時間，以毫秒為單位 android:fillAfter          如果設置為true，控件動畫結束時，將保持動畫最后時的狀態android:fillBefore       如果設置為true,控件動畫結束時，還原到開始動畫前的狀態android:fillEnabled    與android:fillBefore 效果相同，都是在動畫結束時，將控件還原到初始化狀態android:repeatCount 重復次數android:repeatMode 重復類型，有reverse和restart兩個值，reverse表示倒序回放，restart表示重新放一遍，必須與repeatCount一起使用才能看到效果。因為這里的意義是重復的類型，即回放時的動作。android:interpolator  設定插值器，其實就是指定的動作效果，比如彈跳效果等，不在這小節中講解，后面會單獨列出一單講解。與scale標簽意義一樣，就不再綴述。

六、set標簽——定義動作合集

前面我們講解了各個標簽動畫的意義及用法，但他們都是獨立對控件起作用，假設我現在想上面的textView控件做一個動畫——從小到大，旋轉出場，而且透明度也要從0變成1，即下面的這個效果，該怎么辦？

這就需要對指定的控件定義動作合集，Set標簽就可以將幾個不同的動作定義成一個組；

屬性：

set標簽自已是沒有屬性的，他的屬性都是從Animation繼承而來，但當它們用于Set標簽時，就會對Set標簽下的所有子控件都產生作用。

屬性有：（從Animation類繼承的屬性）

android:duration        動畫持續時間，以毫秒為單位 android:fillAfter          如果設置為true，控件動畫結束時，將保持動畫最后時的狀態android:fillBefore       如果設置為true,控件動畫結束時，還原到開始動畫前的狀態android:fillEnabled    與android:fillBefore 效果相同，都是在動畫結束時，將控件還原到初始化狀態android:repeatCount 重復次數android:repeatMode 重復類型，有reverse和restart兩個值，reverse表示倒序回放，restart表示重新放一遍，必須與repeatCount一起使用才能看到效果。因為這里的意義是重復的類型，即回放時的動作。android:interpolator  設定插值器，其實就是指定的動作效果，比如彈跳效果等，不在這小節中講解，后面會單獨列出一單講解。與scale標簽意義一樣，就不再綴述。

上面這個效果，所對應的XML代碼為：

[html] view plain copy <?xml version="1.0" encoding="utf-8"?>  <set xmlns:android="http://schemas.android.com/apk/res/android"      android:duration="3000"      android:fillAfter="true">          <alpha       android:fromAlpha="0.0"      android:toAlpha="1.0"/>        <scale      android:fromXScale="0.0"      android:toXScale="1.4"      android:fromYScale="0.0"      android:toYScale="1.4"      android:pivotX="50%"      android:pivotY="50%"/>        <rotate      android:fromDegrees="0"      android:toDegrees="720"      android:pivotX="50%"      android:pivotY="50%"/>           </set>  

七、實例——如何將動畫XML文件應用于控件中

上面我僅僅是列出了每個標簽及其屬性的意義及應用之后的效果演示，但上面是如何將定義動畫的xml應用到textView控件中的卻遲遲沒說，這一小節，就以scale動畫為例，講述如何將定義好的scle動作添加到指定控件中。

先看最終效果圖：

1、新建工程、新建scale動畫文件（scaleanim.xml）

新建一個工程，并且在res文件夾下，新建一個anim文件夾，然后再新建一個scaleanim.xml文件，結構如圖所示：

scaleanim.xml的代碼為：（從TextView中心點，從0放大到1.4倍，反復一次，最后還原到初始化狀態）

[html] view plain copy <?xml version="1.0" encoding="utf-8"?>  <scale xmlns:android="http://schemas.android.com/apk/res/android"      android:fromXScale="0.0"      android:toXScale="1.4"      android:fromYScale="0.0"      android:toYScale="1.4"      android:pivotX="50%"      android:pivotY="50%"      android:duration="700"       android:fillBefore="true"      android:repeatCount="1"      android:repeatMode="restart"  />  

2、XML布局文件

[html]%20view%20plain%20copy%20<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.harvic.animation_demo.MainActivity" >        <Button android:id="@+id/btn_animation"          android:layout_width="match_parent"          android:layout_height="wrap_content"          android:layout_margin="10dpublic class MainActivity extends Activity {        Button scaleBtn ;      Animation scaleAnimation;            TextView tv;      @Override      PRotected void onCreate(Bundle savedInstanceState) {          super.onCreate(savedInstanceState);          setContentView(R.layout.activity_main);                    scaleAnimation = AnimationUtils.loadAnimation(this, R.anim.scaleanim);          scaleBtn = (Button)findViewById(R.id.btn_animation);          tv =(TextView)findViewById(R.id.tv);                    scaleBtn.setOnClickListener(new View.OnClickListener() {                            @Override              public void onClick(View v) {                  // TODO Auto-generated method stub                  tv.startAnimation(scaleAnimation);              }          });                }    }  （1）通過scaleAnimation = AnimationUtils.loadAnimation(this, R.anim.scaleanim);從XML文件中獲取動畫

（2）利用startAnimation將動畫傳遞給指定控件顯示。

至此，本文就結束了，下篇將講述有關插值器的相關屬性及意義。

下面就是源碼下載了，源碼中包含兩部分內容：

1、Harvic_animation_demo工程：是第七部分的實例源碼；

2、tryAlpha_xml工程：是前六節動作代碼的集合，包含了前六小節里的所有代碼及動畫定義。

源碼下載地址：http://download.csdn.net/detail/harvic880925/8032579

請大家尊重原創者版權，轉載請標明出處：http://blog.csdn.net/harvic880925/article/details/39996643 謝謝！