特別提醒:本文參考摘自【工匠若水 http://blog.csdn.net/yanbober/article/details/46481171 】 及【Carson_Ho:http://www.lxweimin.com/p/2412d00a0ce4 】 強烈建議讀者進入原博客查看學習。
1、Android動畫簡介
1.1 分類
Android系統提供了很多豐富的API去實現UI的2D與3D動畫,最主要的劃分可以分為如下幾類:
Drawable Animation: 這種動畫(也叫Frame動畫、幀動畫)其實可以劃分到視圖動畫的類別,專門用來一個一個的顯示Drawable的resources,就像放幻燈片一樣。
View Animation: 視圖動畫在古老的Android版本系統中就已經提供了,只能被用來設置View的動畫。
**Property Animation: **屬性動畫只對Android 3.0(API 11)以上版本的Android系統才有效,這種動畫可以設置給任何Object,包括那些還沒有渲染到屏幕上的對象。這種動畫是可擴展的,可以讓你自定義任何類型和屬性的動畫。
1.2 每種動畫的特點及區別
Drawable Animation:幀動畫沒有什么好說的,就是把幾張圖片按一定間隔順序顯示出來,就像播放幻燈片一樣,實際開發中用處不大。
View Animation:View動畫只能夠為View添加動畫,如果想為非View對象添加動畫須自己實現;且View動畫支持的種類很少;尤其是他改變的是View的繪制效果,View的屬性沒有改變,其位置與大小都不變; View動畫代碼量少,使用簡單方便。
**Property Animation: **屬性動畫彌補了View動畫的缺陷,可以為一個對象的任意屬性添加動畫,對象自己的屬性會被真的改變;當對象的屬性變化的時候,屬性動畫會自動刷新屏幕;屬性動畫改變的是對象的真實屬性,而且屬性動畫不止用于View,還可以用于任何對象。
2、補間動畫相關介紹
2.1 View動畫概述
視圖動畫,也叫Tween(補間)動畫可以在一個視圖容器內執行一系列簡單變換(位置、大小、旋轉、透明度)。譬如,如果你有一個TextView對象,您可以移動、旋轉、縮放、透明度設置其文本,當然,如果它有一個背景圖像,背景圖像會隨著文本變化。
補間動畫通過XML或Android代碼定義,建議使用XML文件定義,因為它更具可讀性、可重用性。
2.2 View動畫的分類
根據不同的動畫效果,補間動畫分為4種動畫:
- 平移動畫(Translate)
- 縮放動畫(scale)
- 旋轉動畫(rotate)
- 透明度動畫(alpha)
如下是視圖動畫相關的類繼承關系:
java類名 | xml關鍵字 | 描述信息 |
---|---|---|
AlphaAnimation | <alpha> | 放置在res/anim/目錄下漸變透明度動畫效果 |
RotateAnimation | <rotate> | 放置在res/anim/目錄下畫面轉移旋轉動畫效果 |
ScaleAnimation | <scale> | 放置在res/anim/目錄下漸變尺寸伸縮動畫效果 |
TranslateAnimation | <translate> | 放置在res/anim/目錄下畫面轉換位置移動動畫效果 |
AnimationSet | <set> | 放置在res/anim/目錄下一個持有其它動畫元素alpha、scale、translate、rotate或者其它set元素的容器 |
3、具體屬性詳解
3.1 Animation屬性詳解
通過上文中的類繼承關系,可以看出來Animation抽象類是所有補間動畫類的基類,所以基類會提供一些通用的動畫屬性方法,如下我們就來詳細看看這些屬性:
xml屬性 | java方法 | 解釋 |
---|---|---|
android:detachWallpaper | setDetachWallpaper(boolean) | 是否在壁紙上運行 |
android:duration | setDuration(long) | 動畫持續時間,毫秒為單位 |
android:fillAfter | setFillAfter(boolean) | 控件動畫結束時是否保持動畫最后的狀態 |
android:fillBefore | setFillBefore(boolean) | 控件動畫結束時是否還原到開始動畫前的狀態 |
android:fillEnabled | setFillEnabled(boolean) | 與android:fillBefore效果相同 |
android:interpolator | setInterpolator(Interpolator) | 設定插值器(指定的動畫效果,譬如回彈等) |
android:repeatCount | setRepeatCount(int) | 重復次數 |
android:repeatMode | setRepeatMode(int) | 重復類型有兩個值,reverse表示倒序回放,restart表示從頭播放 |
android:startOffset | setStartOffset(long) | 調用start函數之后等待開始運行的時間,單位為毫秒 |
android:zAdjustment | setZAdjustment(int) | 表示被設置動畫的內容運行時在Z軸上的位置(top/bottom/normal),默認為normal |
也就是說,無論我們補間動畫的哪一種都已經具備了這種屬性,也都可以設置使用這些屬性中的一個或多個。
3.2 Alpha屬性詳解
xml屬性 | java方法 | 解釋 |
---|---|---|
android:fromAlpha | AlphaAnimation(float fromAlpha, …) | 動畫開始的透明度(0.0到1.0,0.0是全透明,1.0是不透明) |
android:toAlpha | AlphaAnimation(…, float toAlpha) | 動畫結束的透明度,同上 |
3.3 Rotate屬性詳解
xml屬性 | java方法 | 解釋 |
---|---|---|
android:fromDegrees | RotateAnimation(float fromDegrees, …) | 旋轉開始角度,正代表順時針度數,負代表逆時針度數 |
android:toDegrees | RotateAnimation(…, float toDegrees, …) | 旋轉結束角度,正代表順時針度數,負代表逆時針度數 |
android:pivotX | RotateAnimation(…, float pivotX, …) | 縮放起點X坐標(數值、百分數、百分數p,譬如50表示以當前View左上角坐標加50px為初始點、50%表示以當前View的左上角加上當前View寬高的50%做為初始點、50%p表示以當前View的左上角加上父控件寬高的50%做為初始點) |
android:pivotY | RotateAnimation(…, float pivotY) | 縮放起點Y坐標,同上規律 |
3.4 Scale屬性詳解
xml屬性 | java方法 | 解釋 |
---|---|---|
android:fromXScale | ScaleAnimation(float fromX, …) | 初始X軸縮放比例,1.0表示無變化 |
android:toXScale | ScaleAnimation(…, float toX, …) | 結束X軸縮放比例 |
android:fromYScale | ScaleAnimation(…, float fromY, …) | 初始Y軸縮放比例 |
android:toYScale | ScaleAnimation(…, float toY, …) | 結束Y軸縮放比例 |
android:pivotX | ScaleAnimation(…, float pivotX, …) | 縮放起點X軸坐標(數值、百分數、百分數p,譬如50表示以當前View左上角坐標加50px為初始點、50%表示以當前View的左上角加上當前View寬高的50%做為初始點、50%p表示以當前View的左上角加上父控件寬高的50%做為初始點) |
android:pivotY | ScaleAnimation(…, float pivotY) | 縮放起點Y軸坐標,同上規律 |
3.5 Translate屬性詳解
xml屬性 | java方法 | 解釋 |
---|---|---|
android:fromXDelta | TranslateAnimation(float fromXDelta, …) | 起始點X軸坐標(數值、百分數、百分數p,譬如50表示以當前View左上角坐標加50px為初始點、50%表示以當前View的左上角加上當前View寬高的50%做為初始點、50%p表示以當前View的左上角加上父控件寬高的50%做為初始點) |
android:fromYDelta | TranslateAnimation(…, float fromYDelta, …) | 起始點Y軸從標,同上規律 |
android:toXDelta | TranslateAnimation(…, float toXDelta, …) | 結束點X軸坐標,同上規律 |
android:toYDelta | TranslateAnimation(…, float toYDelta) | 結束點Y軸坐標,同上規律 |
3.6 AnimationSet詳解
AnimationSet繼承自Animation,是上面四種的組合容器管理類,沒有自己特有的屬性,他的屬性繼承自Animation,所以特別注意,當我們對set標簽使用Animation的屬性時會對該標簽下的所有子控件都產生影響。
4、基本使用詳解
- 補間動畫的使用方式分為兩種:在XML 代碼 / Java 代碼里設置
1、前者優點:動畫描述的可讀性更好
2、后者優點:動畫效果可動態創建
4.1 Animation一些比較實用的方法介紹:
Animation類的方法 | 解釋 |
---|---|
reset() | 重置Animation的初始化 |
cancel() | 取消Animation動畫 |
start() | 開始Animation動畫 |
setAnimationListener(AnimationListener listener) | 給當前Animation設置動畫監聽 |
hasStarted() | 判斷當前Animation是否開始 |
hasEnded() | 判斷當前Animation是否結束 |
- 既然補間動畫只能給View使用,那就來看看View中和動畫相關的幾個常用方法吧,如下:
View類的常用動畫操作方法 | 解釋 |
---|---|
startAnimation(Animation animation) | 對當前View開始設置的Animation動畫 |
clearAnimation() | 取消當View在執行的Animation動畫 |
4.2 平移動畫(Translate)
- 效果圖大致如下:
4.2.1 方式一:xml文件設置
- 步驟一:創建xml動畫文件(必須放到 res/anim 文件夾下)
translate_animation.xml文件如下:
<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3000"
android:fromXDelta="0"
android:fromYDelta="0"
android:toXDelta="500"
android:toYDelta="500">
</translate>
<!--// 以下參數是4種動畫效果的公共屬性,即都有的屬性
共有屬性在xml中設置時要設置在set中
android:duration="3000" // 動畫持續時間(ms),必須設置,動畫才有效果
android:startOffset ="1000" // 動畫延遲開始時間(ms)
android:fillBefore = “true” // 動畫播放完后,視圖是否會停留在動畫開始的狀態,默認為true
android:fillAfter = “false” // 動畫播放完后,視圖是否會停留在動畫結束的狀態,優先于fillBefore值,默認為false
android:fillEnabled= “true” // 是否應用fillBefore值,對fillAfter值無影響,默認為true
android:repeatMode= “restart” // 選擇重復播放動畫模式,restart代表正序重放,reverse代表倒序回放,默認為restart|
android:repeatCount = “0” // 重放次數(所以動畫的播放次數=重放次數+1),為infinite時無限重復
android:interpolator = @[package:]anim/interpolator_resource // 插值器,即影響動畫的播放速度,下面會詳細講
// 以下參數是平移動畫特有的屬性
android:fromXDelta="0" // 視圖在水平方向x 移動的起始值
android:toXDelta="500" // 視圖在水平方向x 移動的結束值
android:fromYDelta="0" // 視圖在豎直方向y 移動的起始值
android:toYDelta="500" // 視圖在豎直方向y 移動的結束值-->
- 步驟2:在Java代碼中創建 Animation 對象并播放動畫
MainActivity.java文件如下:
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button bt_translate = (Button) findViewById(R.id.bt_translate);
//創建動畫
Animation translateAnimation = AnimationUtils.loadAnimation(this, R.anim.translate_animation);
//開始動畫
bt_translate.startAnimation(translateAnimation);
}
}
4.2.2 方式二:java代碼中設置
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button bt_translate = (Button) findViewById(R.id.bt_translate);
//創建動畫(參數就是TranslateAnimation特有的屬性)
TranslateAnimation translateAnimation = new TranslateAnimation(0, 500, 0, 500);
//設置時長
translateAnimation.setDuration(3000);
//開始動畫
bt_translate.startAnimation(translateAnimation);
}
}
4.3 縮放動畫(Scale)
- 效果圖大致如下:
4.3.1 方式一:xml文件設置
- 步驟一:創建xml動畫文件(必須放到 res/anim 文件夾下)
scale_animation.xml文件如下:
<?xml version="1.0" encoding="utf-8"?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3000"
android:fromXScale="0.0"
android:fromYScale="0.0"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="2.0"
android:toYScale="2">
</scale>
<!--// 以下參數是4種動畫效果的公共屬性,即都有的屬性
android:duration="3000" // 動畫持續時間(ms),必須設置,動畫才有效果
android:startOffset ="1000" // 動畫延遲開始時間(ms)
android:fillBefore = “true” // 動畫播放完后,視圖是否會停留在動畫開始的狀態,默認為true
android:fillAfter = “false” // 動畫播放完后,視圖是否會停留在動畫結束的狀態,優先于fillBefore值,默認為false
android:fillEnabled= “true” // 是否應用fillBefore值,對fillAfter值無影響,默認為true
android:repeatMode= “restart” // 選擇重復播放動畫模式,restart代表正序重放,reverse代表倒序回放,默認為restart|
android:repeatCount = “0” // 重放次數(所以動畫的播放次數=重放次數+1),為infinite時無限重復
android:interpolator = @[package:]anim/interpolator_resource // 插值器,即影響動畫的播放速度,下面會詳細講
// 以下參數是縮放動畫特有的屬性
android:fromXScale="0.0" // 動畫在水平方向X的起始縮放倍數
// 0.0表示收縮到沒有;1.0表示正常無伸縮
// 值小于1.0表示收縮;值大于1.0表示放大
android:toXScale="2" //動畫在水平方向X的結束縮放倍數
android:fromYScale="0.0" //動畫開始前在豎直方向Y的起始縮放倍數
android:toYScale="2" //動畫在豎直方向Y的結束縮放倍數
android:pivotX="50%" // 縮放軸點的x坐標
android:pivotY="50%" // 縮放軸點的y坐標
// 軸點 = 視圖縮放的中心點
// pivotX pivotY,可取值為數字,百分比,或者百分比p
// 設置為數字時(如50),軸點為View的左上角的原點在x方向和y方向加上50px的點。在Java代碼里面設置這個參數的對應參數是Animation.ABSOLUTE。
// 設置為百分比時(如50%),軸點為View的左上角的原點在x方向加上自身寬度50%和y方向自身高度50%的點。在Java代碼里面設置這個參數的對應參數是Animation.RELATIVE_TO_SELF。
// 設置為百分比p時(如50%p),軸點為View的左上角的原點在x方向加上父控件寬度50%和y方向父控件高度50%的點。在Java代碼里面設置這個參數的對應參數是Animation.RELATIVE_TO_PARENT-->
- 步驟二:在Java代碼中創建Animation對象并播放動畫
MainActivity.java代碼如下:
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button bt_translate = (Button) findViewById(R.id.bt_translate);
//創建動畫
Animation scaleAnimation=AnimationUtils.loadAnimation(this,R.anim.scale_animation);
//開始動畫
bt_translate.startAnimation(scaleAnimation);
}
}
4.3.2 方式二:java代碼中設置
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button bt_translate = (Button) findViewById(R.id.bt_translate);
//創建動畫(參數就是ScaleAnimation特有的屬性)
ScaleAnimation scaleAnimation = new ScaleAnimation(0, 2, 0, 2,
Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
// 參數說明:
// 1. fromX :動畫在水平方向X的結束縮放倍數
// 2. toX :動畫在水平方向X的結束縮放倍數
// 3. fromY :動畫開始前在豎直方向Y的起始縮放倍數
// 4. toY:動畫在豎直方向Y的結束縮放倍數
// 5. pivotXType:縮放軸點的x坐標的模式
// 6. pivotXValue:縮放軸點x坐標的相對值
// 7. pivotYType:縮放軸點的y坐標的模式
// 8. pivotYValue:縮放軸點y坐標的相對值
// pivotXType = Animation.ABSOLUTE:縮放軸點的x坐標 = View左上角的原點 在x方向 加上 pivotXValue數值的點(y方向同理)
// pivotXType = Animation.RELATIVE_TO_SELF:縮放軸點的x坐標 = View左上角的原點 在x方向 加上 自身寬度乘上pivotXValue數值的值(y方向同理)
// pivotXType = Animation.RELATIVE_TO_PARENT:縮放軸點的x坐標 = View左上角的原點 在x方向 加上 父控件寬度乘上pivotXValue數值的值 (y方向同理)
//設置時長
scaleAnimation.setDuration(3000);
//開始動畫
bt_translate.startAnimation(scaleAnimation);
}
}
4.4 旋轉動畫(Rotate)
-
效果圖大致如下:
944365-20f34d5aa917478a.gif
4.4.1 方式一:xml文件中設置
- 步驟一:創建xml動畫文件(必須放到 res/anim 文件夾下)
rotate_animation.xml文件如下:
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3000"
android:fromDegrees="0"
android:toDegrees="270"
android:pivotX="50%"
android:pivotY="0">
</rotate>
<!-- // 以下參數是4種動畫效果的公共屬性,即都有的屬性
android:duration="3000" // 動畫持續時間(ms),必須設置,動畫才有效果
android:startOffset ="1000" // 動畫延遲開始時間(ms)
android:fillBefore = “true” // 動畫播放完后,視圖是否會停留在動畫開始的狀態,默認為true
android:fillAfter = “false” // 動畫播放完后,視圖是否會停留在動畫結束的狀態,優先于fillBefore值,默認為false
android:fillEnabled= “true” // 是否應用fillBefore值,對fillAfter值無影響,默認為true
android:repeatMode= “restart” // 選擇重復播放動畫模式,restart代表正序重放,reverse代表倒序回放,默認為restart|
android:repeatCount = “0” // 重放次數(所以動畫的播放次數=重放次數+1),為infinite時無限重復
android:interpolator = @[package:]anim/interpolator_resource // 插值器,即影響動畫的播放速度,下面會詳細講
// 以下參數是旋轉動畫特有的屬性
android:fromDegrees="0" // 動畫開始時 視圖的旋轉角度(正數 = 順時針,負數 = 逆時針)
android:toDegrees="270" // 動畫結束時 視圖的旋轉角度(正數 = 順時針,負數 = 逆時針)
android:pivotX="50%" // 旋轉軸點的x坐標
android:pivotY="0" // 旋轉軸點的y坐標
// 軸點 = 視圖縮放的中心點
// pivotX pivotY,可取值為數字,百分比,或者百分比p
// 設置為數字時(如50),軸點為View的左上角的原點在x方向和y方向加上50px的點。在Java代碼里面設置這個參數的對應參數是Animation.ABSOLUTE。
// 設置為百分比時(如50%),軸點為View的左上角的原點在x方向加上自身寬度50%和y方向自身高度50%的點。在Java代碼里面設置這個參數的對應參數是Animation.RELATIVE_TO_SELF。
// 設置為百分比p時(如50%p),軸點為View的左上角的原點在x方向加上父控件寬度50%和y方向父控件高度50%的點。在Java代碼里面設置這個參數的對應參數是Animation.RELATIVE_TO_PARENT
// 兩個50%表示動畫從自身中間開始,具體如下圖-->
- 步驟二:在java代碼中創建Animation對象并播放動畫
MainActivity.java代碼如下:
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button bt_translate = (Button) findViewById(R.id.bt_translate);
//創建動畫
Animation rotateAnimation = AnimationUtils.loadAnimation(this, R.anim.rotate_animation);
//開始動畫
bt_translate.startAnimation(rotateAnimation);
}
}
4.4.2 方式二:java代碼中設置
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button bt_translate = (Button) findViewById(R.id.bt_translate);
//創建動畫(參數就是RotateAnimation特有的屬性)
RotateAnimation rotateAnimation = new RotateAnimation(0, 270, Animation.RELATIVE_TO_SELF, 0.5f,
Animation.RELATIVE_TO_SELF, 0.5f);
// 參數說明:
// 1. fromDegrees :動畫開始時 視圖的旋轉角度(正數 = 順時針,負數 = 逆時針)
// 2. toDegrees :動畫結束時 視圖的旋轉角度(正數 = 順時針,負數 = 逆時針)
// 3. pivotXType:旋轉軸點的x坐標的模式
// 4. pivotXValue:旋轉軸點x坐標的相對值
// 5. pivotYType:旋轉軸點的y坐標的模式
// 6. pivotYValue:旋轉軸點y坐標的相對值
// pivotXType = Animation.ABSOLUTE:旋轉軸點的x坐標 = View左上角的原點 在x方向 加上 pivotXValue數值的點(y方向同理)
// pivotXType = Animation.RELATIVE_TO_SELF:旋轉軸點的x坐標 = View左上角的原點 在x方向 加上 自身寬度乘上pivotXValue數值的值(y方向同理)
// pivotXType = Animation.RELATIVE_TO_PARENT:旋轉軸點的x坐標 = View左上角的原點 在x方向 加上 父控件寬度乘上pivotXValue數值的值 (y方向同理)
//設置時長
rotateAnimation.setDuration(3000);
//開始動畫
bt_translate.startAnimation(rotateAnimation);
}
}
4.5 透明度動畫(Alpha)
-
效果圖大致如下:
944365-bdd51d4125069243.gif
4.5.1 方式一:xml文件中設置
- 步驟一:創建xml動畫文件(必須放到 res/anim 文件夾下)
alpha_animation.xml文件如下:
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="3000"
android:fromAlpha="0"
android:toAlpha="1.0" >
</alpha>
<!--// 以下參數是4種動畫效果的公共屬性,即都有的屬性
android:duration="3000" // 動畫持續時間(ms),必須設置,動畫才有效果
android:startOffset ="1000" // 動畫延遲開始時間(ms)
android:fillBefore = “true” // 動畫播放完后,視圖是否會停留在動畫開始的狀態,默認為true
android:fillAfter = “false” // 動畫播放完后,視圖是否會停留在動畫結束的狀態,優先于fillBefore值,默認為false
android:fillEnabled= “true” // 是否應用fillBefore值,對fillAfter值無影響,默認為true
android:repeatMode= “restart” // 選擇重復播放動畫模式,restart代表正序重放,reverse代表倒序回放,默認為restart|
android:repeatCount = “0” // 重放次數(所以動畫的播放次數=重放次數+1),為infinite時無限重復
android:interpolator = @[package:]anim/interpolator_resource // 插值器,即影響動畫的播放速度,下面會詳細講
// 以下參數是透明度動畫特有的屬性
android:fromAlpha="1.0" // 動畫開始時視圖的透明度(取值范圍: -1 ~ 1)
android:toAlpha="0.0"http:// 動畫結束時視圖的透明度(取值范圍: -1 ~ 1)-->
- 步驟二:在java代碼中創建Animation對象并播放動畫
MainActivity.java代碼如下:
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button bt_translate = (Button) findViewById(R.id.bt_translate);
//創建動畫
Animation alphaAnimation = AnimationUtils.loadAnimation(this,R.anim.alpha_animation);
//開始動畫
bt_translate.startAnimation(alphaAnimation);
}
}
4.5.2 方式二:java代碼中設置
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button bt_translate = (Button) findViewById(R.id.bt_translate);
//創建動畫(參數就是AlphaAnimation特有的屬性)
AlphaAnimation alphaAnimation = new AlphaAnimation(0.0f, 1.0f);
// 參數說明:
// 1. fromAlpha:動畫開始時視圖的透明度(取值范圍: -1 ~ 1)
// 2. toAlpha:動畫結束時視圖的透明度(取值范圍: -1 ~ 1)
//設置時長
alphaAnimation.setDuration(3000);
//開始動畫
bt_translate.startAnimation(alphaAnimation);
}
}
4.6 組合動畫(set)
上文講的都是單個動畫效果;而實際中很多需求都需要同時使用平移、縮放、旋轉 & 透明度4種動畫,即組合動畫
特別注意:當我們對set標簽使用Animation的屬性時會對該標簽下的所有子控件都產生影響。
-
效果圖大致如下:
944365-92c62cfb465f67e3.gif
4.6.1 方式一:xml文件中設置
- 步驟一:創建xml動畫文件(必須放到 res/anim 文件夾下)
set_animation.xml文件如下:
<?xml version="1.0" encoding="utf-8"?>
<!--// 組合動畫同樣具備公共屬性
android:duration="3000" // 動畫持續時間(ms),必須設置,動畫才有效果
android:startOffset ="1000" // 動畫延遲開始時間(ms)
android:fillBefore = “true” // 動畫播放完后,視圖是否會停留在動畫開始的狀態,默認為true
android:fillAfter = “false” // 動畫播放完后,視圖是否會停留在動畫結束的狀態,優先于fillBefore值,默認為false
android:fillEnabled= “true” // 是否應用fillBefore值,對fillAfter值無影響,默認為true
android:repeatMode= “restart” // 選擇重復播放動畫模式,restart代表正序重放,reverse代表倒序回放,默認為restart|
android:repeatCount = “0” // 重放次數(所以動畫的播放次數=重放次數+1),為infinite時無限重復
android:interpolator = @[package:]anim/interpolator_resource // 插值器,即影響動畫的播放速度,后文會詳細講
// 組合動畫獨特的屬性
android:shareinterpolator = “true”
// 表示組合動畫中的動畫是否和集合共享同一個差值器
// 如果集合不指定插值器,那么子動畫需要單獨設置
// 組合動畫播放時是全部動畫同時開始
// 如果想不同動畫不同時間開始就要使用android:startOffset屬性來延遲單個動畫播放時間
-->
<set xmlns:android="http://schemas.android.com/apk/res/android">
// 設置旋轉動畫,語法同單個動畫
<rotate
android:duration="1000"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:repeatCount="infinite"
android:repeatMode="restart"
android:toDegrees="360" />
// 設置平移動畫,語法同單個動畫
<translate
android:duration="10000"
android:fromXDelta="-50%p"
android:fromYDelta="0"
android:startOffset="1000"
android:toXDelta="50%p"
android:toYDelta="0" />
// 設置透明度動畫,語法同單個動畫
<alpha
android:duration="3000"
android:fromAlpha="1.0"
android:startOffset="7000"
android:toAlpha="0.0" />
// 設置縮放動畫,語法同單個動畫
<scale
android:duration="1000"
android:fromXScale="1.0"
android:fromYScale="1.0"
android:pivotX="50%"
android:pivotY="50%"
android:startOffset="4000"
android:toXScale="0.5"
android:toYScale="0.5" />
<!--//特別注意:
1. 在組合動畫里scale縮放動畫設置的repeatCount(重復播放)和fillBefore(播放完后,視圖是否會停留在動畫開始的狀態)是無效的。
2. 所以如果需要重復播放或者回到原位的話需要在set標簽里設置
3. 但是由于此處rotate旋轉動畫里已設置repeatCount為infinite,所以動畫不會結束,也就看不到重播和回復原位-->
</set>
- 步驟二:在java代碼中創建Animation對象并播放動畫
MainActivity.java代碼如下:
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button bt_translate = (Button) findViewById(R.id.bt_translate);
//創建動畫
Animation setAnimation=AnimationUtils.loadAnimation(this,R.anim.set_animation);
//開始動畫
bt_translate.startAnimation(setAnimation);
}
}
4.6.2 方式二:java代碼中設置
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button bt_translate = (Button) findViewById(R.id.bt_translate);
//創建集合動畫
AnimationSet setAnimation = new AnimationSet(true);
// 特別說明以下情況:
// 因為在下面的旋轉動畫設置了無限循環(RepeatCount = INFINITE)
// 所以動畫不會結束,而是無限循環
// 所以組合動畫的下面兩行設置是無效的
setAnimation.setRepeatMode(Animation.RESTART);
setAnimation.setRepeatCount(1);// 設置了循環一次,但無效
// 子動畫1:旋轉動畫
Animation rotate = new RotateAnimation(0, 360, Animation.RELATIVE_TO_SELF, 0.5f,
Animation.RELATIVE_TO_SELF, 0.5f);
rotate.setDuration(1000);
rotate.setRepeatMode(Animation.RESTART);
rotate.setRepeatCount(Animation.INFINITE);
// 子動畫2:平移動畫
Animation translate = new TranslateAnimation(TranslateAnimation.RELATIVE_TO_PARENT,-0.5f,
TranslateAnimation.RELATIVE_TO_PARENT,0.5f,
TranslateAnimation.RELATIVE_TO_SELF,0
,TranslateAnimation.RELATIVE_TO_SELF,0);
translate.setDuration(10000);
// 子動畫3:透明度動畫
Animation alpha = new AlphaAnimation(1,0);
alpha.setDuration(3000);
alpha.setStartOffset(7000);
// 子動畫4:縮放動畫
Animation scale1 = new ScaleAnimation(1,0.5f,1,0.5f,Animation.RELATIVE_TO_SELF,0.5f,
Animation.RELATIVE_TO_SELF,0.5f);
scale1.setDuration(1000);
scale1.setStartOffset(4000);
//將子動畫添加到組合動畫中
setAnimation.addAnimation(alpha);
setAnimation.addAnimation(rotate);
setAnimation.addAnimation(translate);
setAnimation.addAnimation(scale1);
//開始動畫
bt_translate.startAnimation(setAnimation);
}
}
5、視圖動畫注意事項
特別特別注意:補間動畫執行之后并未改變View的真實布局屬性值。切記這一點,譬如我們在Activity中有一個Button在屏幕上方,我們設置了平移動畫移動到屏幕下方然后保持動畫最后執行狀態呆在屏幕下方,這時如果點擊屏幕下方動畫執行之后的Button是沒有任何反應的,而點擊原來屏幕上方沒有Button的地方卻響應的是點擊Button的事件。
6、動畫監聽
Animation類通過監聽動畫開始 / 結束 / 重復時刻來進行一系列操作,如跳轉頁面等等
通過在 java 代碼里setAnimationListener()方法設置,如下:
//動畫監聽
animation.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
//該方法動畫開始時執行
}
@Override
public void onAnimationEnd(Animation animation) {
//該方法動畫結束時執行
}
@Override
public void onAnimationRepeat(Animation animation) {
//該動畫重復時執行
}
});
6、插值器 & 估值器
具體請看文章Android 動畫:你真的會使用插值器與估值器嗎?(含詳細實例教學)
7、應用場景
7.1 標準的動畫效果
補間動畫常用于視圖View的一些標準動畫效果:平移、旋轉、縮放 & 透明度;
除了常規的動畫使用,補間動畫還有一些特殊的應用場景。
7.2 特殊的應用場景
- Activity 的切換效果
- Fragement 的切換效果
- 視圖組(ViewGroup)中子元素的出場效果