極客學(xué)院Animation教程講解的很詳細(xì)，點(diǎn)擊進(jìn)入哦
這里為學(xué)習(xí)的整理和補(bǔ)充O(∩_∩)O
前言
第一次學(xué)習(xí)的時候，沒有記筆記岁诉，也沒有敲代碼隧枫，結(jié)果再繼續(xù)學(xué)習(xí)高級進(jìn)階內(nèi)容時喉磁，整個人懵逼了~~~(>_<)~~谓苟，so，良心建議大家都敲一敲代碼协怒，這里精簡并豐富了極客學(xué)院的教程涝焙，大家一起進(jìn)步
1、使用插值器孕暇，又名加速器
valueAnimator.setInterpolator(new BounceInterpolator());
一行代碼就搞定啦仑撞，下邊才是重點(diǎn)@~@
2、自定義插值器
直接代碼O(∩_∩)O
public class MyInterploator implements TimeInterpolator {
@Override
public float getInterpolation(float input) {
return 1-input;
}
}
然后調(diào)用該代碼：
ValueAnimator valueAnimator = ValueAnimator.ofInt(0, 400);
valueAnimator.setDuration(3000);
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
int curValue = (int) animation.getAnimatedValue();
view.layout(curValue, curValue, curValue + view.getWidth(), curValue + view.getHeight());
}});
valueAnimator.setInterpolator(new MyInterpolator());
valueAnimator.start();
會發(fā)現(xiàn)view從400->0的方向移動妖滔。那么WHY隧哮？下面細(xì)細(xì)道來~
-
首先看一下源碼中的解釋：
/**
A time interpolator defines the rate of change of an animation.
This allows animations to have non-linear motion, such as acceleration and deceleration.
*/
public interface TimeInterpolator {
/**
Maps a value representing the elapsed fraction of an animation to a value that represents
* the interpolated fraction. This interpolated value is then multiplied by the change in
* value of an animation to derive the animated value at the current elapsed animation time.
*
* @param input A value between 0 and 1.0 indicating our current point in the animation where 0 represents the start and 1.0 represents the end
* @return The interpolation value. This value can be more than 1.0 for interpolators which overshoot their targets, or less than 0 for interpolators that undershoot their targets.
*/
float getInterpolation(float input);
}
中文大意是說:
input參數(shù):
代表理論上當(dāng)前動畫的進(jìn)度，取值范圍是[0座舍，1]沮翔，0表示開始,1表示結(jié)束,從0勻速增加到1.
egg: 在上述代碼中，設(shè)置從0—>400曲秉，用時3000ms采蚀，那么在300ms的時候,input=300/3000=0.1,此時動畫本應(yīng)該在的位置=0+（400-0）*0.1=40。（表達(dá)式是：位置=開始值+（結(jié)束值-開始值）*進(jìn)度）返回值:
代表當(dāng)前動畫實(shí)際想要的進(jìn)度岸浑，大于1搏存，超過目標(biāo)值，小于1矢洲，小于開始值璧眠。
egg: 在上述代碼中，我們返回值為1-input读虏，這意味著動畫實(shí)際位置=0+(400-0)*(1-0.1)=360;因此责静，我們看到動畫是從400->0運(yùn)動的。
假如返回值為1.5的時候盖桥，動畫的實(shí)際位置=0+（400-0）*1.5=600灾螃，代入表達(dá)式，以此類推~
所以揩徊，我們只要通過input參數(shù)腰鬼，改變返回值，即控制動畫實(shí)際的進(jìn)度塑荒。切記熄赡，input的值一直是勻速增加的，300ms是0.1齿税，600ms是0.2彼硫，不會因?yàn)榉祷刂刀淖兊呐?/strong>
如果有點(diǎn)懵逼的話，那么我們根據(jù)AccelerateDecelerateInterpolator實(shí)際感受一下<(￣︶￣)↗[GO!]
-
AccelerateDecelerateInterpolator（先加速后減速）解析
首先上源碼??
/**
* An interpolator where the rate of change starts and ends slowly but accelerates through the middle.
*/
public class AccelerateDecelerateInterpolator extends BaseInterpolator implements NativeInterpolatorFactory {
public AccelerateDecelerateInterpolator() {
}
@SuppressWarnings({"UnusedDeclaration"})
public AccelerateDecelerateInterpolator(Context context, AttributeSet attrs) {
}
public float getInterpolation(float input) {
return (float)(Math.cos((input + 1) * Math.PI) / 2.0f) + 0.5f;
}
/** @hide */
@Override
public long createNativeInterpolator() {
return NativeInterpolatorFactoryHelper.createAccelerateDecelerateInterpolator();
}}
我們主要看這里：
public float getInterpolation(float input) {
return (float)(Math.cos((input + 1) * Math.PI) / 2.0f) + 0.5f;
//翻譯為數(shù)學(xué)表達(dá)式就是：0.5\*cos((input+1)\*π)+0.5
}
不知道cos函數(shù)大家還記得么？忘記的話拧篮，快快拾起數(shù)學(xué)吧词渤，灰常重要~
該圖是0.5*cos((input+1)*π)+0.5的函數(shù)圖像，input取值0->1串绩，可以看出：如果input為0的時候缺虐，返回值為0，input為0.5的時候赏参，返回值為0.5志笼。根據(jù)函數(shù)變化圖，可以看出返回值先由慢到快增長把篓，然后有增長速率又變慢的過程纫溃，這也是動畫變化的過程哦。
這里我只講解這一個插值器韧掩，如果有需要紊浩，可以進(jìn)入https://gold.xitu.io/entry/56f9e9a839b05700540ff6e7
該網(wǎng)址講解了多個插值器滴
后記
如果仍有疑惑的話，就自己多去試試吧疗锐，把input（理想進(jìn)度）作為X值坊谁，返回值（實(shí)際進(jìn)度）作為Y值，通過函數(shù)圖像繪制工具來繪制圖像滑臊，看看變化速率口芍，敲敲代碼，感受感受
最后雇卷，不得不說鬓椭，玩轉(zhuǎn)數(shù)學(xué)函數(shù)，玩轉(zhuǎn)插值器啊关划，有木有@~@
