
目錄
- 一: 動畫的分類
- 二:解析
- 幀動畫
-
- 補間動畫
- 屬性講解
- interpolator插值器
- 屬性動畫
- ValueAnimator
- ObjectAnimator
一: 動畫的分類
- 幀動畫
- 補間動畫
- 屬性動畫
二:解析
1. 幀動畫
(1)定義
這些圖片是將一些列的drawable組合在一起,進行連續(xù)的播放, 類似于以前電影源用膠卷進行動畫播放
(2)有圖有真相

(3)準備圖片
看著是不是還行,哈哈,下面說一下實現(xiàn),首先準備幾個圖片,百度吧,啥都有,還有美女動圖,哈哈,準備好圖片以后就開始我們的項目咯
(4)創(chuàng)建XML 配置文件
- 在res下創(chuàng)建一個drawable文件夾,在其中創(chuàng)建一個anim.xml
- 在 <animation-list>標簽中將一系列的圖片組合在一起
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
<!-- oneshot 是否只播放一次 -->
<item
android:drawable="@drawable/pic_01"
android:duration="200" />
<!-- duration 延時時間 單位毫秒 -->
<item
android:drawable="@drawable/pic_02"
android:duration="200" />
<item
android:drawable="@drawable/pic_03"
android:duration="200" />
<item
android:drawable="@drawable/pic_04"
android:duration="200" />
<item
android:drawable="@drawable/pic_05"
android:duration="200" />
<item
android:drawable="@drawable/pic_06"
android:duration="200" />
<item
android:drawable="@drawable/pic_07"
android:duration="200" />
</animation-list>
(5) 如何在代碼中使用
//開始動畫
private void init_startAnim() {
anim = (AnimationDrawable) getResources().getDrawable(R.drawable.anim);
img.setBackgroundDrawable(anim);//img 是我們放在布局文件中的ImageView
anim.start();
}
//停止動畫
private void init_stopAnim() {
if (anim != null) {
anim.stop();
}
}
2. 補間動畫
本文很多參考這篇文章,有興趣的小伙伴,可以點擊詳細查看
(1) 定義
指的View可以是TextView,Button等等 可以讓指定的View進行縮放,旋轉(zhuǎn),位移,透明度的變化 (對前面的4個效果可以組合實用)
(2)屬性講解
| 屬性名稱 | 作用 |
|---|---|
| Alpha | 透明度 |
| Rotate | 旋轉(zhuǎn) |
| Canle | 縮放 |
| Translate | 位移 |
| Set | 組合 |
先有個概念,后續(xù)會對每個屬性詳細講解。。。
(3)使用
- 創(chuàng)建
res/anim的文件夾 , 在anim中定義指定標簽的布局文件 - 在動態(tài)代碼中加載補間動畫
-
找到指定的View播放動畫
還有比我還細心的嘛
anim_test中的屬性
<?xml version="1.0" encoding="utf-8"?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
android:duration="1500"
android:fillAfter="true"
android:fromAlpha="1.0"
android:repeatCount="infinite"
android:toAlpha="0.1" />
動畫屬性的介紹,這里很重要
(4) 屬性講解
Animaton屬性講解(上訴的動畫都有這些屬性,是父類)
| 屬性名稱 | 作用 | 備注 |
|---|---|---|
| duration | 動畫執(zhí)行的時間 | 以毫秒為單位 |
| fillEnabled | 動畫結(jié)束時,是否還原到開始動畫前的狀態(tài) | true或者false |
| fillBefore | 與fillEnabled相同 | 無 |
| fillAfter | 動畫結(jié)束時,是否將保持動畫最后時的狀態(tài) | true或者false |
| repeatMode | 重復類型 | reverse:表示倒序回訪,restart:表示重新放一遍,這個屬性必須與repeatCount聯(lián)合使用,因為牽扯到重復,即重復播放時的播放類型。 |
| repeatCount | 動畫重復的次數(shù) | infinite:表示無限循環(huán) |
| interpolator | 設(shè)定的插值器,它主要用來為動畫設(shè)置一些特殊的效果,比方說:加速運動、減速運動、動畫結(jié)束的時候彈起等等。 | 下面會詳細介紹 |
alpha屬性詳解
| 屬性名稱 | 作用 | 備注 |
|---|---|---|
| fromAlpha | 動畫開始時的透明度 | 變化范圍為0.0-1.0,0.0表示完全透明,1.0表示完全不透明 |
| toAlpha | 動畫結(jié)束時的透明度 | 同上 |
rotate屬性詳解
| 屬性名稱 | 作用 | 備注 |
|---|---|---|
| fromDegrees | 動畫開始時旋轉(zhuǎn)的角度位置 | float類型;正值代表順時針方向度數(shù),負值代碼逆時針方向度數(shù) |
| toDegrees | 動畫結(jié)束時旋轉(zhuǎn)到的角度位置 | 同上 |
| pivotX | 旋轉(zhuǎn)點X軸坐標 | 排版問題,請看下面的備注 |
| pivotY | 旋轉(zhuǎn)點Y軸坐標 | 同上 |
pivotX:float類型,可以是數(shù)值、百分數(shù)、百分數(shù)p三種樣式,比如50、50%、50%p; 當為數(shù)值時,表示在當前View的左上角,即原點處加上50px,做為旋轉(zhuǎn)點X坐標,如果是50%;表示在當前控件的左上角加上自己寬度的50%做為旋轉(zhuǎn)點X坐標;如果是50%p,那么就是表示在當前控件的左上角加上父控件寬度的50%做為旋轉(zhuǎn)點X坐標
canle屬性詳解
| 屬性名稱 | 作用 | 備注 |
|---|---|---|
| fromXScale | 起始的X方向上相對自身的縮放比例 | 型float,比如1.0代表自身無變化,0.5代表起始時縮小一倍,2.0代表放大一倍 |
| toXScale | 結(jié)尾的X方向上相對自身的縮放比例 | 類型float |
| fromYScale | 起始的Y方向上相對自身的縮放比例 | 類型float |
| toYScale | 結(jié)尾的Y方向上相對自身的縮放比例 | 類型float |
| pivotX | 縮放起點X軸坐標 | 可以是數(shù)值、百分數(shù)、百分數(shù)p |
| pivotY | 縮放起點Y軸坐標 | 取值及意義與pivotX一樣 |
Translate屬性詳解
| 屬性名稱 | 作用 | 備注 |
|---|---|---|
| fromXDelta | 起始點X軸坐標 | 可以是數(shù)值、百分數(shù)、百分數(shù)p 三種樣式 |
| fromYDelta | 起始點Y坐標 | 同上 |
| toXDelta | 結(jié)束點X坐標 | 無 |
| toYDelta | 結(jié)束點Y坐標 | 無 |
Set屬性詳解
他沒有特殊的屬性,因為他的作用只是將所有屬性融合在一起
例如
<?xml version="1.0" encoding= "utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true">
<alpha
android:fromAlpha= "0.0"
android:toAlpha= "1.0"
android:duration= "3000" />
<scale
android:fromXScale= "0.0"
android:toXScale= "1.0"
android:fromYScale= "0.0"
android:toYScale= "1.0"
android:pivotX= "50%"
android:pivotY= "50%"
android:duration= "3000" />
<rotate
android:fromDegrees= "0"
android:toDegrees= "720"
android:pivotX= "50%"
android:pivotY= "50%"
android:duration= "3000"/>
<translate
android:startOffset= "3000"
android:fromXDelta= "0"
android:fromYDelta= "0"
android:toXDelta= "85"
android:toYDelta= "0"
android:duration= "1000" />
<alpha
android:startOffset= "4000"
android:fromAlpha= "1.0"
android:toAlpha= "0.0"
android:duration= "1000" />
</set>
interpolator插值器
這篇文章對interpolator,講解的比較深入
interpolaotor定義了動畫變化的速率,它允許基礎(chǔ)動畫(alpha, scale, translate, rotate)加速,減速,重復變化等等。在補間動畫中,我們一般只定義關(guān)鍵幀(首幀和尾幀),然后由系統(tǒng)自動生成中間幀,生成中間幀的這個過程可以成為“插值”。插值器定義了動畫變化的速率,提供不同的函數(shù)定義變化值相對于時間的變化規(guī)則,可以定義各種各樣的非線性變化函數(shù),比如加速、減速等。下面是幾種常見的插值器:
| Interpolator對象 | 功能作用 | 屬性講解 |
|---|---|---|
AccelerateDecelerateInterpolator @android:anim/accelerate_decelerate_interpolator
|
先加速再減速 | 無 |
AccelerateInterpolator @android:anim/accelerate_interpolator
|
加速 |
android:factor 浮點值,加速速率,默認為1; android:tension浮點值,起始點后退的張力、拉力數(shù),默認為2 |
AnticipateInterpolator @android:anim/anticipate_interpolator
|
先回退一小步然后加速前進 | |
AnticipateOvershootInterpolator @android:anim/anticipate_overshoot_interpolator
|
先回退一小步然后加速前進,超出終點一小步后再回到終點 |
android:tension 同上; android:extraTension 浮點值,拉力的倍數(shù),默認為1.5(2 * 1.5) |
BounceInterpolator @android:anim/bounce_interpolator
|
最后階段彈球效果 | 無 |
CycleInterpolator @android:anim/cycle_interpolator
|
周期運動 |
android:cycles整數(shù)值,循環(huán)的個數(shù),默認為1 |
DecelerateInterpolator @android:anim/decelerate_interpolator
|
減速 |
android:factor 浮點值,減速的速率,默認為1 |
LinearInterpolator @android:anim/linear_interpolator
|
勻速 | 無 |
OvershootInterpolator @android:anim/overshoot_interpolator
|
快速到達終點并超出一小步最后回到終點 |
tension浮點值,超出終點后的張力、拉力,默認為2 |
插值器的使用
<?xml version="1.0" encoding="utf-8"?>
<translate
xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/bounce_interpolator"
android:fromXDelta="0"
android:fromYDelta="0"
android:toXDelta="200"
android:toYDelta="300"
android:duration="5000">
</translate>
animation.setInterpolator(new OvershootInterpolator());
(5)代碼中如何使用補間動畫
Animation animation = AnimationUtils.loadAnimation(MainActivity.this,R.anim.rotate);
ivGirl.startAnimation(animation);
3. 屬性動畫
推薦這文章,講的真的挺好的
(1)定義
通過改變?nèi)魏螌ο蟮膶傩?在屬性改變的過程當中產(chǎn)生的動畫 (3.0以后提出的)
比如:顏色 字體的顏色是紅色 最后最后的顏色是綠色 (屬性動畫體現(xiàn)該變化效果) 更改控件的寬度高度等等,和補間動畫相比他是改變了Object的屬性,而補間動畫不會改變View的屬性
ValueAnimator
private void init_ValueAnimator() {
ValueAnimator valueAnimator = ValueAnimator.ofFloat(0,100);
valueAnimator.setDuration(200);
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
float value = (Float) animation.getAnimatedValue();
img.setTranslationX(value);
}
});
valueAnimator.start();
}
ObjectAnimator
private void init_ObjectAnimator() {
ObjectAnimator oa = ObjectAnimator.ofFloat(img, "rotationY", 0f, 360f);
oa.setDuration(3000);//設(shè)置時間
oa.start();// 播放動畫
}
