Android備忘錄《View動畫(補間動畫)》

Ansong發表於2018-06-20

介紹

  • View動畫是通過對場景裡的物件不斷做影像變換(平移,旋轉,縮放,透明度)從而產生動畫效果,它是一種漸進式動畫,並且View動畫支援自定義動畫。
  • 作用於View(Button,TextView...),Activity和Fragment切換效果,檢視組(ViewGroup)中子元素的出場效果(ListView子元素出場效果)
  • xml檔案實現方式,可讀性、複用性好。/java方式實現,動態實現動畫。
  • 補間動畫只能夠作用在檢視View上,即只可以對一個Button、TextView、甚至是LinearLayout、或者其它繼承自View的元件進行動畫操作,但無法對非View的物件進行動畫操作有些情況下的動畫效果只是檢視的某個屬性 &物件而不是整個檢視;如,現需要實現檢視的顏色動態變化,那麼就需要操作檢視的顏色屬性從而實現動畫效果,而不是針對整個檢視進行動畫操作
  • 沒有改變View的屬性,只是改變視覺效果,補間動畫只是改變了View的視覺效果,而不會真正去改變View的屬性。如,將螢幕左上角的按鈕 通過補間動畫 移動到螢幕的右下角點選當前按鈕位置(螢幕右下角)是沒有效果的,因為實際上按鈕還是停留在螢幕左上角,補間動畫只是將這個按鈕繪製到螢幕右下角,改變了視覺效果而已。
  • 動畫效果單一,補間動畫只能實現平移、旋轉、縮放、透明度這些簡單的動畫需求,一旦遇到相對複雜的動畫效果,即超出了上述4種動畫效果,那麼補間動畫則無法實現。即在功能、可擴充套件性有較大侷限性

View動畫種類及實現

  • 平移動畫(Translate)對應TranslateAnimation類,translate標籤

xml實現方式:res/anim的資料夾裡建立動畫效果.xml檔案

<?xml version="1.0" encoding="utf-8"?>
// 採用<translate /> 標籤表示平移動畫
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    // 以下引數是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:fromXDelta="0" // 檢視在水平方向x 移動的起始值
    android:toXDelta="500" // 檢視在水平方向x 移動的結束值
    android:fromYDelta="0" // 檢視在豎直方向y 移動的起始值
    android:toYDelta="500" // 檢視在豎直方向y 移動的結束值
/>
    
//java程式碼中使用xml定義的動畫
Button mButton = (Button) findViewById(R.id.Button);
Animation translateAnimation = AnimationUtils.loadAnimation(this, R.anim.view_animation);
mButton.startAnimation(translateAnimation);
複製程式碼

java程式碼實現動畫

Button mButton = (Button) findViewById(R.id.Button);
Animation translateAnimation = new TranslateAnimation(0,500,0,500);
// 步驟2:建立平移動畫的物件:平移動畫對應的Animation子類為TranslateAnimation
// 引數分別是:
// 1. fromXDelta :檢視在水平方向x 移動的起始值
// 2. toXDelta :檢視在水平方向x 移動的結束值
// 3. fromYDelta :檢視在豎直方向y 移動的起始值
// 4. toYDelta:檢視在豎直方向y 移動的結束值

translateAnimation.setDuration(3000);
// 固定屬性的設定都是在其屬性前加“set”,如setDuration()
mButton.startAnimation(translateAnimation);
複製程式碼
  • 縮放動畫(scale)對應ScaleAnimation類,scale標籤

xml實現方式:

<?xml version="1.0" encoding="utf-8"?>
// 採用<scale/> 標籤表示是縮放動畫
<scale  xmlns:android="http://schemas.android.com/apk/res/android"
    // 以下引數是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
    // 兩個50%表示動畫從自身中間開始
/>

java程式碼中使用xml動畫
Button mButton = (Button) findViewById(R.id.Button);
Animation rotateAnimation = AnimationUtils.loadAnimation(this, R.anim.view_animation);
//建立 動畫物件 並傳入設定的動畫效果xml檔案
mButton.startAnimation(scaleAnimation);
複製程式碼

在Java程式碼中實現:

Button mButton = (Button) findViewById(R.id.Button);
Animation rotateAnimation = new ScaleAnimation(0,2,0,2,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
// 步驟2:建立縮放動畫的物件 & 設定動畫效果:縮放動畫對應的Animation子類為RotateAnimation
// 引數說明:
// 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);
// 固定屬性的設定都是在其屬性前加“set”,如setDuration()
 mButton.startAnimation(scaleAnimation);
複製程式碼
  • 旋轉動畫(rotate)對應RotateAnimation類,rotate標籤

xml實現方式:

<?xml version="1.0" encoding="utf-8"?>
// 採用<rotate/> 標籤表示是旋轉動畫
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    // 以下引數是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:duration="1000"
    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中使用
Button mButton = (Button) findViewById(R.id.Button);
Animation scaleAnimation = AnimationUtils.loadAnimation(this, R.anim.view_animation);
//建立 動畫物件 並傳入設定的動畫效果xml檔案
mButton.startAnimation(scaleAnimation);
複製程式碼

Java實現方式:

Button mButton = (Button) findViewById(R.id.Button);
Animation rotateAnimation = new RotateAnimation(0,270,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f);
// 步驟2:建立旋轉動畫的物件 & 設定動畫效果:旋轉動畫對應的Animation子類為RotateAnimation
// 引數說明:
// 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);
// 固定屬性的設定都是在其屬性前加“set”,如setDuration()
mButton.startAnimation(rotateAnimation);
複製程式碼
  • 透明度動畫(alpha)對應AlphaAnimation類,alpha標籤

xml實現方式:

<?xml version="1.0" encoding="utf-8"?>
// 採用<alpha/> 標籤表示是透明度動畫
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    // 以下引數是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"// 動畫結束時檢視的透明度(取值範圍: -1 ~ 1)
/>

Java中使用
Button mButton = (Button) findViewById(R.id.Button);
Animation alphaAnimation = AnimationUtils.loadAnimation(this, R.anim.view_animation);
//建立 動畫物件 並傳入設定的動畫效果xml檔案
mButton.startAnimation(alphaAnimation);
複製程式碼

Java實現方式:

Button mButton = (Button) findViewById(R.id.Button);
Animation alphaAnimation = new AlphaAnimation(1,0);
// 步驟2:建立透明度動畫的物件 & 設定動畫效果:透明度動畫對應的Animation子類為AlphaAnimation
// 1. fromAlpha:動畫開始時檢視的透明度(取值範圍: -1 ~ 1)
// 2. toAlpha:動畫結束時檢視的透明度(取值範圍: -1 ~ 1)

alphaAnimation.setDuration(3000);
// 固定屬性的設定都是在其屬性前加“set”,如setDuration()
mButton.startAnimation(alphaAnimation);
複製程式碼
  • 組合動畫(set),AnimationSet類,set標籤

xml實現方式:

<?xml version="1.0" encoding="utf-8"?>
// 採用< Set/>標籤
<set xmlns:android="http://schemas.android.com/apk/res/android">
    //公共屬性
    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屬性來延遲單個動畫播放時間

// 設定旋轉動畫,語法同單個動畫
    <rotate
        android:duration="1000"
        android:fromDegrees="0"
        android:toDegrees="360"
        android:pivotX="50%"
        android:pivotY="50%"
        android:repeatMode="restart"
        android:repeatCount="infinite"/>

// 設定平移動畫,語法同單個動畫
    <translate
        android:duration="10000"
        android:startOffset = “1000”// 延遲該動畫播放時間
        android:fromXDelta="-50%p"
        android:fromYDelta="0"
        android:toXDelta="50%p"
        android:toYDelta="0" />

// 設定透明度動畫,語法同單個動畫
    <alpha
        android:startOffset="7000"
        android:duration="3000"
        android:fromAlpha="1.0"
        android:toAlpha="0.0" />

// 設定縮放動畫,語法同單個動畫
    <scale
        android:startOffset="4000"
        android:duration="1000"
        android:fromXScale="1.0"
        android:fromYScale="1.0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="0.5"
        android:toYScale="0.5" />

// 1. 在組合動畫裡scale縮放動畫設定的repeatCount(重複播放)和fillBefore(播放完後,檢視是否會停留在動畫開始的狀態)是無效的。
// 2. 所以如果需要重複播放或者回到原位的話需要在set標籤裡設定
// 3. 但是由於此處rotate旋轉動畫裡已設定repeatCount為infinite,所以動畫不會結束,也就看不到重播和回覆原位

</set>

Java中使用
Button mButton = (Button) findViewById(R.id.Button);
Animation translateAnimation = AnimationUtils.loadAnimation(this, R.anim.view_animation);
// 建立 動畫物件 並傳入設定的動畫效果xml檔案
mButton.startAnimation(translateAnimation);
複製程式碼

Java中實現:

Button mButton = (Button) findViewById(R.id.Button);
// 組合動畫設定
AnimationSet setAnimation = new AnimationSet(true);
// 步驟1:建立組合動畫物件(設定為true)

// 步驟2:設定組合動畫的屬性
// 特別說明以下情況
// 因為在下面的旋轉動畫設定了無限迴圈(RepeatCount = INFINITE)
// 所以動畫不會結束,而是無限迴圈
// 所以組合動畫的下面兩行設定是無效的
setAnimation.setRepeatMode(Animation.RESTART);
setAnimation.setRepeatCount(1);// 設定了迴圈一次,但無效

// 步驟3:逐個建立子動畫(方式同單個動畫建立方式,此處不作過多描述)

// 子動畫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);

// 步驟4:將建立的子動畫新增到組合動畫裡
setAnimation.addAnimation(alpha);
setAnimation.addAnimation(rotate);
setAnimation.addAnimation(translate);
setAnimation.addAnimation(scale1);

mButton.startAnimation(setAnimation);
複製程式碼

插值器

插值器是動畫的一個特別且重要的屬性,通過插值器可以讓動畫更接近於顯示物體的運動特性。插值器的本質是設定屬性值從初始值過度到結束值的變化規律。可以模擬(加速進行,現加速在減速...)

Android預設提供了九種插值器的實現,基本上可以滿足開發中的需求

動畫加速進行    @android:anim/accelerate_interpolator   AccelerateInterpolator
快速完成動畫,超出再回到結束樣式    @android:anim/overshoot_interpolator    OvershootInterpolator
先加速再減速    @android:anim/accelerate_decelerate_interpolator    AccelerateDecelerateInterpolator
先退後再加速前進    @android:anim/anticipate_interpolator    AnticipateInterpolator
先退後再加速前進,超出終點後再回終點    @android:anim/anticipate_overshoot_interpolator AnticipateOvershootInterpolator
最後階段彈球效果    @android:anim/bounce_interpolator   BounceInterpolator
週期運動    @android:anim/cycle_interpolator    CycleInterpolator
減速    @android:anim/decelerate_interpolator   DecelerateInterpolator
勻速    @android:anim/linear_interpolator   LinearInterpolator
複製程式碼

監聽動畫執行狀態

Animation.setAnimationListener(new Animation.AnimationListener() {
            @Override
            public void onAnimationStart(Animation animation) {
                // 動畫開始時回撥
            }

            @Override
            public void onAnimationEnd(Animation animation) {
                // 動畫結束時回撥
            }

            @Override
            public void onAnimationRepeat(Animation animation) {
                //動畫重複執行的時候回撥
            }
        });
複製程式碼

使用補間動畫修改Activity切換動畫

a.啟動動畫

Intent intent = new Intent (this,Acvtivity.class);
startActivity(intent);
overridePendingTransition(R.anim.enter_anim,R.anim.exit_anim);
// 採用overridePendingTransition(int enterAnim, int exitAnim)進行設定
// enterAnim:從Activity a跳轉到Activity b,進入b時的動畫效果資源ID
// exitAnim:從Activity a跳轉到Activity b,離開a時的動畫效果資源Id

// 特別注意
// overridePendingTransition()必須要在startActivity(intent)後被呼叫才能生效
複製程式碼

b.退出動畫

@Override
public void finish(){
    super.finish();
    
    overridePendingTransition(R.anim.enter_anim,R.anim.exit_anim);
// 採用overridePendingTransition(int enterAnim, int exitAnim)進行設定
// enterAnim:從Activity a跳轉到Activity b,進入b時的動畫效果資源ID
// exitAnim:從Activity a跳轉到Activity b,離開a時的動畫效果資源Id

// 特別注意
// overridePendingTransition()必須要在finish()後被呼叫才能生效
}
複製程式碼

對於引數 enterAnim&exitAnim的資源ID,系統有自帶的效果android.R.anim.xxx

// 淡入淡出的動畫效果      
overridePendingTransition(android.R.anim.fade_in, android.R.anim.fade_out);
// 從左向右滑動的效果
overridePendingTransition(android.R.anim.slide_in_left, android.R.anim.slide_out_right);
複製程式碼

自定義切換動畫

在Android提供的預設實現動畫滿足不了開發需求時(比如需要修改淡入淡出動畫時間長短、想多種動畫組合時),就需要使用補間動畫來自定義切換效果了。

現在實現一種Activity左右滑動推出進入並且伴隨漸隱漸顯的動畫效果 ,首先了解下Activity的位置資訊

Android備忘錄《View動畫(補間動畫)》

  • 以螢幕底邊為X軸,螢幕左邊為Y軸;
  • 當Activity在X軸 = -100%p時,剛好完全超出螢幕到左邊(位置1)
  • 當Activity在X軸 = 0%p時,剛好完全在螢幕內(位置2)
  • 當Activity在X軸 = 100%p時,剛好完全超出螢幕到右邊(位置3)

從中間滑到左邊,逐漸隱藏,即從位置2 - 位置1(out_to_left.xml)

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:duration="500"
        android:fromXDelta="0%p"
        android:toXDelta="-100%p"/>

    <alpha  
        android:duration="1500"  
        android:fromAlpha="1.0"  
        android:toAlpha="0.0" />  
</set>
複製程式碼

從右邊滑到中間,逐漸顯示,即從位置3 - 位置2(in_from_right.xml)

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:duration="500"
        android:fromXDelta="100%p"
        android:toXDelta="0%p"/>

    <alpha  
        android:duration="1500"  
        android:fromAlpha="0.0"  
        android:toAlpha="1.0" />  
</set>
複製程式碼

在程式碼中設定

Intent intent = new Intent(MainActivity.this, SecActivity.class);
startActivity(intent);
// 自定義的淡入淡出動畫效果      
overridePendingTransition(R.anim.fade_in, R.anim.fade_out);
複製程式碼

Fragment切換效果

系統自帶的動畫切換效果

FragmentTransaction fragmentTransaction = mFragmentManager.beginTransaction();
fragmentTransaction.setTransition(int transit);
// 通過setTransition(int transit)進行設定
// transit引數說明
// 1. FragmentTransaction.TRANSIT_NONE:無動畫
// 2. FragmentTransaction.TRANSIT_FRAGMENT_OPEN:標準的開啟動畫效果
// 3. FragmentTransaction.TRANSIT_FRAGMENT_CLOSE:標準的關閉動畫效果
// 標準動畫設定好後,在Fragment新增和移除的時候都會有。
複製程式碼

自定義動畫效果

// 採用`FragmentTransavtion`的 `setCustomAnimations()`進行設定

FragmentTransaction fragmentTransaction = mFragmentManager.beginTransaction();

fragmentTransaction.setCustomAnimations(R.anim.in_from_right,R.anim.out_to_left);

// 此處的自定義動畫效果同Activity,此處不再過多描述
複製程式碼

檢視組(ViewGroup)中子元素的出場效果

為ListView的 item 設定出場動畫

  • 步驟1:設定子元素的出場動畫

res/anim/view_animation.xml

<?xml version="1.0" encoding="utf-8"?>
// 此處採用了組合動畫
<set xmlns:android="http://schemas.android.com/apk/res/android" >
    android:duration="3000"
    <alpha
        android:duration="1500"
        android:fromAlpha="1.0"
        android:toAlpha="0.0" />

    <translate
        android:fromXDelta="500"
        android:toXDelta="0"/>
</set>
複製程式碼
  • 步驟2:設定 檢視組(ViewGroup)的動畫檔案

res/ anim /anim_layout.xml

<?xml version="1.0" encoding="utf-8"?>
// 採用LayoutAnimation標籤
<layoutAnimation xmlns:android="http://schemas.android.com/apk/res/android"
    android:delay="0.5"
    // 子元素開始動畫的時間延遲
    // 如子元素入場動畫的時間總長設定為300ms
    // 那麼 delay = "0.5" 表示每個子元素都會延遲150ms才會播放動畫效果
    // 第一個子元素延遲150ms播放入場效果;第二個延遲300ms,以此類推

    android:animationOrder="normal"
    // 表示子元素動畫的順序
    // 可設定屬性為:
    // 1. normal :順序顯示,即排在前面的子元素先播放入場動畫
    // 2. reverse:倒序顯示,即排在後面的子元素先播放入場動畫
    // 3. random:隨機播放入場動畫

    android:animation="@anim/view_animation"
    // 設定入場的具體動畫效果
    // 將步驟1的子元素出場動畫設定到這裡
/>
複製程式碼
  • 步驟3:為檢視組(ViewGroup)指定andorid:layoutAnimation屬性 指定的方式有兩種: XML / Java程式碼設定

在 XML 中指定

<?xml version="1.0" encoding="utf-8"?>
<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:background="#FFFFFF"
    android:orientation="vertical" >
    <ListView
        android:id="@+id/listView1"
        android:layoutAnimation="@anim/anim_layout"
        // 指定layoutAnimation屬性用以指定子元素的入場動畫
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</LinearLayout>
複製程式碼

在Java程式碼中指定

這樣就不用額外設定res/ anim /anim_layout.xml該xml檔案了

ListView lv = (ListView) findViewById(R.id.listView1);
Animation animation = AnimationUtils.loadAnimation(this,R.anim.anim_item);
// 載入子元素的出場動畫
LayoutAnimationController controller = new LayoutAnimationController(animation);
controller.setDelay(0.5f);
controller.setOrder(LayoutAnimationController.ORDER_NORMAL);
// 設定LayoutAnimation的屬性
lv.setLayoutAnimation(controller);
// 為ListView設定LayoutAnimation的屬性
複製程式碼

相關文章