自定義控制元件三部曲之動畫篇(二)——Interpolator插值器
前言:雖然我不太能欣賞的了帕爾哈提的音樂,但我確實很欣賞他的人生態度,專心做自己,不想名利得失,有一天,你想要的東西都會來。其實我覺得,人生最可怕的就是停止不前,只要一直前行,總有一天會到達人生巔峰。
相關文章:
一、概述
Interpolator屬性是Animation類的一個XML屬性,所以alpha、scale、rotate、translate、set都會繼承得到這個屬性。Interpolator被譯為插值器,其實我不大能從字面上理解為什麼會這樣譯,其實他是一個指定動畫如何變化的東東,跟PS裡的動作有點類似:隨便拿來一張圖片,應用一個動作,圖片就會指定變化。
Interpolator的系統值有下面幾個:
意義如下:
- AccelerateDecelerateInterpolator 在動畫開始與介紹的地方速率改變比較慢,在中間的時候加速
- AccelerateInterpolator 在動畫開始的地方速率改變比較慢,然後開始加速
- AnticipateInterpolator 開始的時候向後然後向前甩
- AnticipateOvershootInterpolator 開始的時候向後然後向前甩一定值後返回最後的值
- BounceInterpolator 動畫結束的時候彈起
- CycleInterpolator 動畫迴圈播放特定的次數,速率改變沿著正弦曲線
- DecelerateInterpolator 在動畫開始的地方快然後慢
- LinearInterpolator 以常量速率改變
- OvershootInterpolator 向前甩一定值後再回到原來位置
二、scale標籤
下面先看看Scale標籤應用插值器後,都會變成什麼樣。
先看下XML程式碼:(從控制元件中心點,從0放大到1.4倍,保持結束時的狀態)
下面一個個看看,每個xml值對應的scale動畫是怎樣的。<?xml version="1.0" encoding="utf-8"?> <scale xmlns:android="http://schemas.android.com/apk/res/android" 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:duration="700" android:fillAfter="true" />
AccelerateInterpolator DecelerateInterpolator
在動畫開始的地方速率改變比較慢,然後開始加速 在動畫開始的地方快然後慢
AnticipateInterpolator AnticipateOvershootInterpolator
開始的時候向後然後向前甩 開始的時候向後然後向前甩一定值後返回最後的值
BounceInterpolator CycleInterpolator
動畫結束的時候彈起 動畫迴圈播放特定的次數,速率改變沿著正弦曲線
LinearInterpolator OvershootInterpolator
以常量速率改變 向前甩一定值後再回到原來位置
三、rotate標籤
下面先看看rotate標籤應用插值器後,都會變成什麼樣。
先看下XML程式碼:(從控制元件中心點,從0放大到1.4倍,保持結束時的狀態)
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:duration="700"
android:fillAfter="true"
/>
AccelerateDecelerateInterpolator 在動畫開始與介紹的地方速率改變比較慢,在中間的時候加速 AccelerateInterpolator DecelerateInterpolator
在動畫開始的地方速率改變比較慢,然後開始加速 在動畫開始的地方快然後慢
AnticipateInterpolator AnticipateOvershootInterpolator
開始的時候向後然後向前甩 開始的時候向後然後向前甩一定值後返回最後的值
BounceInterpolator CycleInterpolator
動畫結束的時候彈起 動畫迴圈播放特定的次數,速率改變沿著正弦曲線
LinearInterpolator OvershootInterpolator
以常量速率改變 向前甩一定值後再回到原來位置
四、alpha標籤
下面先看看alpha標籤應用插值器後,都會變成什麼樣。
將透明度從0變成1.0,使用不同的插值器看看有什麼不同(因為只是透明度的變化,所以基本看不出來有什麼不同)<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromAlpha="0.0"
android:toAlpha="1.0"
android:duration="3000"
android:fillAfter="true"
/>
AccelerateDecelerateInterpolator 在動畫開始與介紹的地方速率改變比較慢,在中間的時候加速 AccelerateInterpolator DecelerateInterpolator
在動畫開始的地方速率改變比較慢,然後開始加速 在動畫開始的地方快然後慢
AnticipateInterpolator AnticipateOvershootInterpolator
開始的時候向後然後向前甩 開始的時候向後然後向前甩一定值後返回最後的值
BounceInterpolator CycleInterpolator
動畫結束的時候彈起 動畫迴圈播放特定的次數,速率改變沿著正弦曲線
LinearInterpolator OvershootInterpolator
以常量速率改變 向前甩一定值後再回到原來位置
五、translate標籤
下面先看看translate標籤應用插值器後,都會變成什麼樣。
把控制元件從(0,0)平移到(-200,-200)的位置,保持結束時狀態不變,使用不同插值器。<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/accelerate_decelerate_interpolator"
android:fromXDelta="0"
android:toXDelta="-200"
android:fromYDelta="0"
android:toYDelta="-200"
android:duration="2000"
android:fillAfter="true"
/>
AccelerateDecelerateInterpolator 在動畫開始與介紹的地方速率改變比較慢,在中間的時候加速
AccelerateInterpolator DecelerateInterpolator
在動畫開始的地方速率改變比較慢,然後開始加速 在動畫開始的地方快然後慢
AnticipateInterpolator AnticipateOvershootInterpolator
開始的時候向後然後向前甩 開始的時候向後然後向前甩一定值後返回最後的值
BounceInterpolator CycleInterpolator
動畫結束的時候彈起 動畫迴圈播放特定的次數,速率改變沿著正弦曲線
LinearInterpolator OvershootInterpolator
以常量速率改變 向前甩一定值後再回到原來位置
這篇文章到這就結束了,因為動畫比較多,可能看的會有點暈,下面我會給出上面效果所對應的原始碼,大家可以執行一下。
如果我的文章能幫到您,請加關注,謝謝。