创建 Material Design 的真实动画

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

动画

推荐一个网站: https://inloop.github.io/interpolator/

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

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

动画

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

1
2
3
4
5
6
7
8
9
10
11
12
/**
* 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 来制造二次方或三次方的贝塞尔曲线动画。

更多 Interpolator

图片
图片
github

文章来自: https://hanks.pub