Android 動畫

合理的動畫是一款優秀 App 不可缺乏的一部分,Android 也爲開發者提供了全套動畫實現的 API。關於 Android 動畫分類大體可分爲如下三類:補間動畫(Tween Animation),幀動畫(Frame Animation),及 Android 3.0(API 10)之後新增的屬性動畫(Property Animation)。下面對其分別作一下介紹。html

1、分類

  1. Tween Animation:補間動畫,是指經過對場景裏的對象不斷作圖像變換(平移、縮放、旋轉)產生動畫效果,便是一種漸變更畫;java

  2. Frame Animation:幀動畫,是指按照必定的幀率順序播放一組事先作好的圖像,是一種畫面轉換動畫;android

  3. Property Animation:屬性動畫,是指在設定的時間和速率下完成對象的屬性由一個值變成另外一個值的過程,它也是一種漸變更畫。shell

注:屬性動畫是 Android 3.0 (API 10)之後新增的特性。如需兼容之前版本,則須要添加 nineoldandroid 動畫兼容包。ide

2、補間動畫(Tween Animation)

Tween Animation定義在xml文件中。能夠對view實現一系列的轉換,例如:移動、漸變、伸縮、旋轉。補間動畫只能應用於 View 對象,並且只支持一部分屬性,如支持縮放旋轉而不支持背景顏色的改變。並且對於 Tween Animation,並不改變屬性的值,它只是改變了View對象繪製的位置。函數

下面先來看看Android提供的動畫類型。Android的animation由四種類型組成佈局

在XML文件中:動畫

  • alpha        漸變透明度動畫效果ui

  • scale         漸變尺寸伸縮動畫效果url

  • translate    畫面轉換位置移動動畫效果

  • rotate        畫面轉移旋轉動畫效果

在Java 源碼中定義了相應的類,可使用這些類的方法來獲取和操做相應的屬性:

  • AlphaAnimation        漸變透明度動畫效果

  • ScaleAnimation         漸變尺寸伸縮動畫效果

  • TranslateAnimation   畫面轉換位置移動動畫效果

  • RotateAnimation       畫面轉移旋轉動畫效果

一、公共特徵

XML 文件路徑:

res/anim/filename.xml        // 小寫文件名將做爲資源的ID

資源引用:

  • 在 Java 中:R.anim.filename

  • 在 XML 中:@[package:]anim.filename

XML 結構:

<?xml version="1.0" encoding="utf-8"?>  
<set xmlns:androidsetxmlns:android="http://schemas.android.com/apk/res/android"  
    android:interpolator="@[package:]anim/interpolator_resource"  
    android:shareInterpolator=["true" | "false"]>  
    <alpha />  
    <scale />  
    <translate />  
    <rotate />  
    <set>  
        ...  
    </set>  
</set>

默認狀況下,因此的動畫指令都是同時發生的,爲了讓他們按序列發生,須要設置一個特殊的屬性 startOffset 。動畫的指令定義了你想要發生什麼樣的轉換,當他們發生了,應該執行多長時間,轉換能夠是連續的也可使同時的。例如,你讓文本內容從左邊移動到右邊,而後旋轉180度,或者在移動的過程當中同時旋轉,沒個轉換須要設置一些特殊的參數(開始和結束的大小尺寸的大小變化,開始和結束的旋轉角度等等,也能夠設置些基本的參數(例如,開始時間與週期),若是讓幾個轉換同時發生,能夠給它們設置相同的開始時間,若是按序列的話,計算開始時間加上其週期。

公共屬性:

屬性 [類型] 功能 備註
duration [long] 動畫持續時間 單位:毫秒
fillAfter [boolean] 當爲true,該畫面在動畫結束後被應用
fillBefore [boolean] 當爲true,該畫面在動畫開始前被應用
interpolator 指定一個動畫的插入器 accelerate_decelerate_interpolator
加速-減速 動畫插入器
accelerate_interpolator
加速-動畫插入器
decelerate_interpolator
減速- 動畫插入器
repeatCount [int] 動畫的重複次數
repeatMode [int] 定義重複的行爲 1:從新開始  2:plays backward
startOffset [long] 本次動畫 start 開始執行的偏移時長
zAdjustment [int] 定義動畫的Z Order的改變 -1:最下層;0:不變;1:最上層

注:元素屬性值中使用%(in percentage relative to the object's top edge),%p(in percentage relative to the parent container's top edge )的單位。

用法:

// 獲取 Animation 對象
Animation animation = AnimationUtils.loadAnimation(getContext(), R.anim.tween_anim);
// 開始動畫
view.startAnimation(animation);

注:startAnimation 必須爲觸發調用,不能在 onCreate 中調用。

二、漸變更畫(AlphaAnimation)

樣例:

<alpha
    android:fromAlpha="0.1"
    android:toAlpha="1.0"
    android:duration="3000" />

私有屬性:

屬性 [類型] 功能 備註
fromAlpha [float] 動畫開始時的Alpha值 取值範圍 [0.0, 1.0], 單位:float
toAlpha [float] 動畫結束時的Alpha值 0.0 徹底透明; 1.0 徹底不透明

三、伸縮動畫(ScaleAnimation)

樣例:

<scale
    android:interpolator="@android:anim/accelerate_decelerate_interpolator"
    android:fromXScale="0.0"
    android:toXScale="1.4"
    android:fromYScale="0.0"
    android:toYScale="1.4"
    android:pivotX="50%"
    android:pivotY="50%"
    android:fillAfter="false"
    android:startOffset="700"
    android:duration="700"
    android:repeatCount="10" />

私有屬性:

屬性 [類型] 功能 備註
fromXScale [float] 動畫開始時 X 軸縮放值 取值範圍 [0.0, 8.0], 單位:float
fromYScale [float] 動畫開始時 Y 軸縮放值 > 1.0 表示放大; < 1.0 表示縮小
toXScale [float] 動畫結束時 X 軸縮放值 0.0 表示縮小到無
toYScale [float] 動畫結束時 Y 軸縮放值 1.0 表示原大小無縮放
pivotX [float]
動畫做用中心 X 軸相對位置 取值[0%, 100%] 或 [0%p, 100%p]
pivotY [float] 動畫做用中心 Y 軸相對位置 其區別,見上部分注意事項。

四、移動動畫(TranslateAnimation)

樣例:

<translate
    android:fromXDelta="30"
    android:toXDelta="-80"
    android:fromYDelta="30"
    android:toYDelta="300"
    android:duration="2000" />

私有屬性:

屬性 [類型] 功能 備註
fromXDelta [int, float] 動畫開始時 X 軸的位置 int 單位像素
fromYDelta [int, float] 動畫開始時 Y 軸的位置 相對於控件起始位置(0, 0)
toXDelta [int, float] 動畫結束時 X 軸的位置 float 單位百分比
toYDelta [int, float] 動畫結束時 Y 軸的位置 取值、用法見上

五、旋轉動畫(RotateAnimation)

樣例:

<rotate
    android:interpolator="@android:anim/accelerate_decelerate_interpolator"
    android:fromDegrees="0"
    android:toDegrees="+350"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="3000" />

私有屬性:

屬性 [類型] 功能 備註
fromDegress [int] 動畫開始時的旋轉角度 角度差 > 0,順時針旋轉
toDegress [int] 動畫結束時的旋轉角度 角度差 < 0,逆時針旋轉
pivotX [float] 動畫做用中心 X 的相對位置 取值[0%, 100%] 或 [0%p, 100%p]
pivotY [float] 動畫做用中心 Y 的相對位置 其區別,見上部分注意事項。

3、幀動畫(FrameAnimation)

與影視動畫或電影類似,Android 幀動畫(FrameAnimation)也是一系列的圖片按事先定好的速率順序顯示而造成的動畫效果。幀動畫也能夠在 XML 中定義。

XML 文件路徑

res/drawable/filename.xml        // 小寫文件名將做爲資源的ID

資源引用

  • 在 Java 中:R.drawable.filename

  • 在 XML 中:@[package:]drawable.filename

XML 結構

<?xml version="1.0" encoding="utf-8"?>  
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"  
    android:oneshot="false">  
    <item android:drawable="@drawable/rocket_thrust1" android:duration="200" />  
    <item android:drawable="@drawable/rocket_thrust2" android:duration="200" />  
    <item android:drawable="@drawable/rocket_thrust3" android:duration="200" />  
</animation-list>

XML必須以 animation-list 做爲根節點。其結構簡單,就不對元素和屬性單獨作解釋了,如真需瞭解詳情請參閱官方幫助文檔 —— Animation Resources

用法

首先將 drawable 資源設置爲背景,而後再獲取並播放,

ImageView rocketImage = (ImageView) findViewById(R.id.rocket_image);  
rocketImage.setBackgroundResource(R.drawable.rocket_thrust);  
  
rocketAnimation = (AnimationDrawable) rocketImage.getBackground();  
rocketAnimation.start();

注意事項

  • 要在代碼中調用 ImageView 的 setBackgroundResource 方法,若是直接在 XML 佈局文件中設置其 src 屬性當觸發動畫時會 ForceClose ;

  • 在動畫 start 以前要先 stop,否則在第一次動畫以後會停在最後一幀,這樣動畫就只會觸發一次;

  • 正如SDK中所提到的,不要在 onCreate 中調用 start,由於 AnimationDrawable 尚未徹底跟 Window 相關聯,若是想要界面顯示時就開始動畫的話,能夠在 onWindowFoucsChanged 中調用 start 。

4、屬性動畫(PropertyAnimation)

Property Animation 定義在xml文件中用以在一段時間內改變對象的某個或某些屬性值,與Tween Animation不一樣,它不光展示對象的繪製圖,他會實實在在改變對象的屬性。

一、屬性動畫(PropertyAnimation)

XML 文件路徑:

res/animator/filename.xml        // 小寫文件名將做爲資源的ID

資源引用:

  • 在 Java 中:R.animator.filename

  • 在 XML 中:@[package:]animator.filename

XML 結構:

<set
  android:ordering=["together" | "sequentially"]>

    <objectAnimator
        android:propertyName="string"
        android:duration="int"
        android:valueFrom="float | int | color"
        android:valueTo="float | int | color"
        android:startOffset="int"
        android:repeatCount="int"
        android:repeatMode=["repeat" | "reverse"]
        android:valueType=["intType" | "floatType"]/>

    <animator
        android:duration="int"
        android:valueFrom="float | int | color"
        android:valueTo="float | int | color"
        android:startOffset="int"
        android:repeatCount="int"
        android:repeatMode=["repeat" | "reverse"]
        android:valueType=["intType" | "floatType"]/>

    <set>
        ...
    </set>
</set>

如需瞭解屬性詳情請參閱官方幫助文檔 —— Animation Resources

用法:

AnimatorSet set = (AnimatorSet) AnimatorInflater.loadAnimator(myContext,
    R.anim.property_animator);
set.setTarget(myObject);
set.start();

二、插值器(Interpolator)

爲了理解插值器(Interpolator)的用處,咱們在此要複習一下動畫的原理。簡單而言,動畫是基於人的視覺原理,當多張圖像幻燈片同樣連續播放,播放速度>=24幀每秒(FPS)時所造成的動景錯覺。動畫中分關鍵幀和補間幀,關鍵幀能明顯表達一種特定意義的畫面,關鍵幀與關鍵幀之間須要平滑過分,這些過分畫面就叫作補間幀。

Android 補間動畫(Tween Animation)顧名思義是由 start 定義的開始關鍵幀,end 定義的結束關鍵幀,中間由插值器完成的補間幀所造成的簡單動畫形式。插值器就是一個造成補間幀的函數,時間是這個函數的輸入,view 屬性值是這個函數的輸出。所以插值器不能決定動畫的開始形態和結束形態,但它決定動畫的變幻的路徑和速率。

根據上面的介紹,咱們就很容易明白插值器在補間動畫(Tween Animation)和屬性動畫(Property Animation)中獲得普遍應用。

系統自帶插值器:

Interpolator class Resource ID 備註
AccelerateDecelerateInterpolator @android:anim/accelerate_decelerate_interpolator 加速減速
AccelerateInterpolator @android:anim/accelerate_interpolator 加速
AnticipateInterpolator @android:anim/anticipate_interpolator 退小步往前衝
AnticipateOvershootInterpolator @android:anim/anticipate_overshoot_interpolator 退小步衝過頭退回
BounceInterpolator @android:anim/bounce_interpolator 球落地彈動效果
CycleInterpolator @android:anim/cycle_interpolator 週期重複
DecelerateInterpolator @android:anim/decelerate_interpolator 減速
LinearInterpolator @android:anim/linear_interpolator 勻速
OvershootInterpolator @android:anim/overshoot_interpolator 衝過頭再退回

用戶自定義插值器:

XML 文件路徑

res/anim/filename.xml        // 小寫文件名將做爲資源的ID

資源引用

  • 在 XML 中:@[package:]anim.filename

XML 結構

<?xml version="1.0" encoding="utf-8"?>
<InterpolatorName xmlns:android="http://schemas.android.com/apk/res/android"
    android:attribute_name="value"/>

如需瞭解更多詳情請參閱官方幫助文檔 —— Animation Resources

相關文章
相關標籤/搜索