Android 補間動畫

補間動畫：經過使用 Animation 對單張圖片執行一系列轉換來建立動畫。

在 XML 中定義的動畫，用於對圖形執行旋轉、淡出、移動和拉伸等轉換。

動畫文件放在res/anim/，該文件名將用做資源 ID。

移動示例

先用一個例子創建直觀的認識。新建一個動畫xml，實現從左到右的效果。
move_hor_1.xml

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

    <translate
        android:duration="400"
        android:startOffset="200"
        android:toXDelta="100%" />
</set>

要使用這個動畫，須要用到AnimationUtils.loadAnimation(getContext(), R.anim.move_hor_1);來加載動畫。獲得對象mAnimation
交給View.startAnimation(mAnimation);來啓動。

上面的動畫例子效果圖

仔細看一下動畫xml裏的內容

• set裏有2個translate
• translate表示移動動做
  • duration是這個動做的執行時長（毫秒）
  • toXDelta表示橫行移動
  • startOffset表示動畫開始執行多久後再執行這個動做

實際上，第二個translate週期是400毫秒，它「等了」200毫米纔開始執行。
把View從左邊移動到了右邊。

縮放示例

除了位移，還能夠執行縮放效果。

能夠看到示例種先放大再縮小回去。主要是用了android:repeatMode="reverse"和android:repeatCount="1"。

完整動畫xml以下

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:duration="600"
        android:fromXScale="1"
        android:fromYScale="1"
        android:pivotX="50%"
        android:pivotY="50%"
        android:repeatCount="1"
        android:repeatMode="reverse"
        android:toXScale="1.35"
        android:toYScale="1.35" />
</set>

scale裏面咱們遇到了幾個元素pivotX，repeatCount，repeatMode

• android:pivotX 在對象縮放時要保持不變的 X 座標；pivotY同理。
• android:repeatCount 動畫的重複次數。設爲 "-1" 表示無限次重複，也可設爲正整數。
  • 例如，值 "1" 表示動畫在初次播放後重復播放一次，所以動畫總共播放兩次。默認值爲 "0"，表示不重複。
• android:repeatMode 動畫播放到結尾處的行爲。android:repeatCount 必須設置爲正整數或 "-1"，該屬性纔有效。
  • 設置爲 "reverse" 可以讓動畫在每次迭代時反向播放，
  • 設置爲 "repeat" 則可以讓動畫每次從頭開始循環播放。

多個動畫元素的例子

一個<set>集合裏能夠包含多個元素。

錄製gif的出來發現快結束時總有一個抖動，是錄製的問題。

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:shareInterpolator="false">
    <rotate
        android:duration="500"
        android:fromDegrees="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="360" />

    <translate
        android:duration="500"
        android:fromXDelta="0%"
        android:toXDelta="50%" />

    <alpha
        android:duration="500"
        android:fromAlpha="1"
        android:toAlpha="0.5" />

    <set
        android:interpolator="@android:anim/decelerate_interpolator"
        android:startOffset="500">
        <rotate
            android:duration="400"
            android:fromDegrees="360"
            android:pivotX="100%"
            android:pivotY="50%"
            android:toDegrees="0" />

        <translate
            android:duration="400"
            android:fromXDelta="0%"
            android:toXDelta="-50%" />

        <alpha
            android:duration="400"
            android:fromAlpha="0.5"
            android:toAlpha="1" />

    </set>
</set>

<set>裏放置着多個元素，能夠把<set>放進<set>裏。
咱們分紅出發和回來兩個動做

出發：

第一個<rotate>是從本身的中心位置開始。
<translate>水平向右走了50%。

回來：

後面<rotate>的pivotX須要考慮到出發時水平移動了50%，所以pivotX取值100%。

而<translate>從0%走到-50%便可。

動畫xml元素

下面總結一下各個屬性

<?xml version="1.0" encoding="utf-8"?>
    <set xmlns:android="http://schemas.android.com/apk/res/android"
        android:interpolator="@[package:]anim/interpolator_resource"
        android:shareInterpolator=["true" | "false"] >
        <alpha
            android:fromAlpha="float"
            android:toAlpha="float" />
        <scale
            android:fromXScale="float"
            android:toXScale="float"
            android:fromYScale="float"
            android:toYScale="float"
            android:pivotX="float"
            android:pivotY="float" />
        <translate
            android:fromXDelta="float"
            android:toXDelta="float"
            android:fromYDelta="float"
            android:toYDelta="float" />
        <rotate
            android:fromDegrees="float"
            android:toDegrees="float"
            android:pivotX="float"
            android:pivotY="float" />
        <set>
            ...
        </set>
    </set>

set

容納其餘動畫元素（ 、 或其餘 元素）的容器。表明 AnimatorSet。
能夠放置多個動畫元素，組合在一塊兒。每一個set可定義本身的 ordering 屬性。

• android:interpolator 插值器資源。 要應用於動畫的 Interpolator。 該值必須是對指定插值器的資源的引用（而不是插值器類名稱）。可以使用平臺提供的默認插值器資源，也可建立本身的插值器資源。
• android:shareInterpolator 布爾值。若是要在全部子元素中共用同一插值器，則爲「true」。

alpha

淡入或淡出動畫。對應AlphaAnimation類。

• android:fromAlpha 浮點數。起始不透明度偏移，0.0 表示透明，1.0 表示不透明。
• android:toAlpha 浮點數。結束不透明度偏移，0.0 表示透明，1.0 表示不透明。

scale

縮放動畫，調整大小的動畫；對應ScaleAnimation。
指定 pivotX 和 pivotY，來指定View向外（或向內）擴展的中心點。
例如，若是這兩個值爲 0、0（左上角），則全部擴展均向右下方向進行。

• android:fromXScale 浮點數。起始 X 尺寸偏移，其中 1.0 表示不變。
• android:toXScale 浮點數。結束 X 尺寸偏移，其中 1.0 表示不變。
• android:fromYScale 浮點數。起始 Y 尺寸偏移，其中 1.0 表示不變。
• android:toYScale 浮點數。結束 Y 尺寸偏移，其中 1.0 表示不變。
• android:pivotX 浮點數。在對象縮放時要保持不變的 X 座標。
• android:pivotY 浮點數。在對象縮放時要保持不變的 Y 座標。

translate

移動動畫。垂直或水平移動。或者水平和垂直移動一塊兒。對應TranslateAnimation。
支持採用如下三種格式之一的如下屬性：從 -100 到 100 的以「％」結尾的值，表示相對於自身的百分比；從 -100 到 100 的以「％p」結尾的值，表示相對於其父項的百分比；不帶後綴的浮點值，表示絕對值。

屬性：

• android:fromXDelta float或百分比。起始 X 偏移。表示方式：相對於正常位置的像素數（例如 "5"），相對於元素寬度的百分比（例如 "5%"），或相對於父項寬度的百分比（例如 "5%p"）。
• android:toXDelta float或百分比。結束 X 偏移。表示方式同fromXDelta
• android:fromYDelta float或百分比。起始 Y 偏移。表示方式：相對於正常位置的像素數（例如 "5"），相對於元素高度的百分比（例如 "5%"），或相對於父項高度的百分比（例如 "5%p"）。
• android:toYDelta float或百分比。結束 Y 偏移。表示方式同fromYDelta

rotate

旋轉動畫。對應RotateAnimation。

屬性：

• android:fromDegrees浮點數。起始角度位置，以度爲單位。
• android:toDegrees浮點數。結束角度位置，以度爲單位。
• android:pivotXfloat或百分比。旋轉中心的 X 座標。表示方式：相對於對象左邊緣的像素數（例如 "5"），相對於對象左邊緣的百分比（例如 "5%"），或相對於父級容器左邊緣的百分比（例如 "5%p"）。
• android:pivotYfloat或百分比。旋轉中心的 Y 座標。表示方式：相對於對象上邊緣的像素數（例如 "5"），相對於對象上邊緣的百分比（例如 "5%"），或相對於父級容器上邊緣的百分比（例如 "5%p"）。

參考

• Tween動畫指南 https://developer.android.com/guide/topics/resources/animation-resource#Tween
• res簡介 https://an.rustfisher.com/android/resource/resources_overview/