前言
插值器(Interpolator)和估值器(TypeEvaluator)是实现复杂动画效果的关键,本文主要介绍插值器的使用和如何自定义插值器。
定义
Android实现动画效果中的一个辅助接口
作用:设置 属性值 从初始值过渡到结束值 的变化规律
如加速,减速运动
即非线性运动
应用场景
适用于非线性运动动画效果上
非线性运动:即运动速度不是一成不变的,加速、减速均属于非线性运动
默认插值器
系统为我们默认实现了九个插值器分别为:
名称 | XML用法 | 代码用法 |
---|---|---|
动画加速运行 | @android:anim/accelerate_interpolator | AccelerateInterpolator |
快速完成动画,超出后再回到结束样式 | @android:anim/overshoot_interpolator | OvershootInterpolator |
先加速在减速 | @android:anim/accelerate_decelerate_interpolator | AccelerateDecelerateInterpolator |
先退出再加速前进 | @android:anim/anticipate_interpolatr | AnticipateInterpolator |
先退出再加速前进,超出终点后在返回终点 | @android:anim/anticipate_overshoot | AnticipateOvershootInterpolator |
最后阶段弹球效果 | @andorid:anim/bounce_interpolator | BounceInterpolator |
周期运动 | @android:anim/cycle_interpolator | CycleInterpolator |
减速运动 | @android:anim/decelerate_interpolator | DecelerateInterpolator |
匀速运动 | @android:anim/linear_interpolator | LinearInterpolator |
效果展示
动画加速运行(默认效果)
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(tv, "translationX", 0f, 300f);
objectAnimator.setDuration(3000);
objectAnimator.setStartDelay(1000);
objectAnimator.setInterpolator(new AccelerateInterpolator());
objectAnimator.start();
效果
快速完成动画,超出后再回到结束样式
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(tv, "translationX", 0f, 300f);
objectAnimator.setDuration(3000);
objectAnimator.setStartDelay(1000);
objectAnimator.setInterpolator(new OvershootInterpolator());
objectAnimator.start();
效果
先加速再减速
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(tv, "translationX", 0f, 300f);
objectAnimator.setDuration(3000);
objectAnimator.setStartDelay(1000);
objectAnimator.setInterpolator(new AccelerateDecelerateInterpolator());
objectAnimator.start();
效果
先退后在加速前进
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(tv, "translationX", 0f, 300f);
objectAnimator.setDuration(3000);
objectAnimator.setStartDelay(1000);
objectAnimator.setInterpolator(new AnticipateInterpolator());
objectAnimator.start();
效果
先退后再加速前进,超出后在返回终点
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(tv, "translationX", 0f, 300f);
objectAnimator.setDuration(3000);
objectAnimator.setStartDelay(1000);
objectAnimator.setInterpolator(new AnticipateOvershootInterpolator());
objectAnimator.start();
效果
最后阶段弹球效果
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(tv, "translationX", 0f, 300f);
objectAnimator.setDuration(3000);
objectAnimator.setStartDelay(1000);
objectAnimator.setInterpolator(new BounceInterpolator());
objectAnimator.start();
周期运动
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(tv, "translationX", 0f, 300f);
objectAnimator.setDuration(3000);
objectAnimator.setStartDelay(1000);
objectAnimator.setInterpolator(new CycleInterpolator(3));
objectAnimator.start();
效果
减速
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(tv, "translationX", 0f, 300f);
objectAnimator.setDuration(3000);
objectAnimator.setStartDelay(1000);
objectAnimator.setInterpolator(new DecelerateInterpolator());
objectAnimator.start();
匀速
ObjectAnimator objectAnimator = ObjectAnimator.ofFloat(tv, "translationX", 0f, 300f);
objectAnimator.setDuration(3000);
objectAnimator.setStartDelay(1000);
objectAnimator.setInterpolator(new LinearInterpolator());
objectAnimator.start();
效果
自定义插值器
如果上述的插值器无法满足你的要求,你也可以自定义插值器,这里需要注意的是
如果是补间动画则实现Interpolator接口
属性动画则实现TimeInterpolator接口
下面是属性动画插值器的例子:
public class MyInterpolator implements TimeInterpolator {
//属性动画实现TimeInterpolator接口,重写getInterpolation方法
@Override
public float getInterpolation(float input) {
//input的取值范围是0-1,且input的变动时匀速变动
//根据你动画的变化速度需要返回fraction,返回的值即为动画完成的进度
//插值器input与估值器中fraction的关系
//input通过一定的方法转变为一个0-1的数值,该数值即为估值器中的fraction,即getInterpolation返回的值就是估值器中的fraction
return 0;
}
}
那么系统的插值器是如何实现的呢,我们以先减速后加速的AccelerateDecelerateInterpolator为例看一下系统的实现,源码如下:
@HasNativeInterpolator
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();
}
}
首先我们知道input在0-1间匀速增长,那么(input + 1) * Math.PI的取值范围为π到2π之间,而cos在π到2π之间是先负后正,取值范围为-1到1之间,除以2后的取值范围为-0.5到0.5之间而加上0.5的取值范围为0,1(即0-100%),但在变化的过程中前一半的变化越来越块,后一半的变化越来越慢,所以是一个先加速后减速的过程。
对比着系统的AccelerateDecelerateInterpolator,我们写一个先减速后加速的AccelerateDecelerateInterpolator出来
public class DecelerateAccelerateInterpolator implements TimeInterpolator {
@Override
public float getInterpolation(float input) {
// 使用正弦函数来实现先减速后加速的功能,逻辑如下:
// 因为正弦函数初始弧度变化值非常大,刚好和余弦函数是相反的
// 随着弧度的增加,正弦函数的变化值也会逐渐变小,这样也就实现了减速的效果。
// 当弧度大于π/2之后,整个过程相反了过来,现在正弦函数的弧度变化值非常小,渐渐随着弧度继续增加,变化值越来越大,弧度到π时结束,这样从0过度到π,也就实现了先减速后加速的效果
float result;
if (input<=0.5){
result = (float) Math.sin(input * Math.PI / 2);
}else{
result = (float) (2 - Math.sin(Math.PI * input)) / 2;
}
return result;
}
}
效果
以上就是插值器的全部内容。