创建 Material Design 的真实动画

3,195 阅读1分钟

material design 规范中,一个重要方面在于如何在“动作”完整的展现物体的各个真实的特性,譬如优雅、简约、美观和神奇的无缝的用户体验,下面的动画将帮助大家理解这些理念。

动画

推荐一个网站: inloop.github.io/interpolato…

填入函数,即可立即查看效果



1 if(x<=0.5){
2     4*x*x*x
3 }else{
4     4*(x-1)*(x-1)*(x-1) + 1
5 }

动画

以此自定义Interpolator,Interpolator 时间插值类,定义动画变换的速度。Interpolator接口,继承自TimeInterpolator,TimeInterpolator时间插值器允许动画进行非线性运动变换,如加速和限速等,该接口中只有接口中有一个方法 float getInterpolation(float input) 这个方法。传入的值是一个 0.0~1.0的值,返回值可以小于0.0也可以大于1.0。

/**
 * Created by hanks on 2016/3/7.
 */
public class MaterialInterpolator implements Interpolator {
    @Override public float getInterpolation(float x) {
        if(x<=0.5){
           return 4*x*x*x;
        }else{
            return 4*(x-1)*(x-1)*(x-1) + 1;
        }
    }
}

MaterialInterpolator

Lollipop在 android.R.interpolator 中加入了几个 interpolator,包括fast_out_linear_in , fast_out_slow_in,和linear_out_slow_in :对于产生逼真的物理效果至关重要。现在我们可以通过使用兼容包中的 FastOutLinearInInterpolator, FastOutSlowInInterpolator , LinearOutSlowInInterpolator 类来达到同样的效果。 除此之外,我们还可以使用 PathInterpolatorCompat 来制造二次方或三次方的贝塞尔曲线动画。

文章来自: hanks.xyz