Touch feedback(触摸反馈)和 Reveal eff

2017-09-29  本文已影响141人  yyg

触摸反馈:

在Android L5.0中加入了触摸反馈动画。
其中最明显,最具代表性的就是波纹动画,比如当点击按钮或条目时会从点击的位置产生类似于波纹的扩散效果。

波纹效果(Ripple):

当你使用了Material主题后,波纹动画会自动应用在所有的控件上,我们当然可以来设置其属性来调整到我们需要的效果。

可以通过如下代码设置波纹的背景:

使用效果如下:

效果图效果图

设置颜色

我们也可以通过设置xml属性来调节动画颜色,从而可以适应不同的主题:
android:colorControlHighlight:设置波纹颜色
android:colorAccent:设置checkbox等控件的选中颜色

比如下面这个比较粉嫩的主题,就需要修改动画颜色来匹配:

效果图效果图

Circular Reveal:

Circular Reveal是一个Android L新增的动画效果,但我始终不知道如何翻译这个名字,圆形揭示?

使用方法:

应用ViewAnimationUtils.createCircularReveal()方法可以去创建一个RevealAnimator动画

ViewAnimationUtils.createCircularReveal源码如下:

public static Animator createCircularReveal(View view,  
        int centerX,  int centerY, float startRadius, float endRadius) {  
    return new RevealAnimator(view, centerX, centerY, startRadius, endRadius);  
}  

源码非常简单,就是通过createCircularReveal方法根据5个参数来创建一个RevealAnimator动画对象。

这五个参数分别是:

根据下面的效果图和代码可以很容易的了解这几个参数的作用:

Image.pngImage.png
final View oval = this.findViewById(R.id.oval);  
oval.setOnClickListener(new View.OnClickListener() {  
    @Override  
    public void onClick(View v) {  
        Animator animator = ViewAnimationUtils.createCircularReveal(  
                oval,  
                oval.getWidth()/2,  
                oval.getHeight()/2,  
                oval.getWidth(),  
                0);  
        animator.setInterpolator(new AccelerateDecelerateInterpolator());  
        animator.setDuration(2000);  
        animator.start();  
    }  
});  
  
final View rect = this.findViewById(R.id.rect);  
  
rect.setOnClickListener(new View.OnClickListener() {  
    @Override  
    public void onClick(View v) {  
        Animator animator = ViewAnimationUtils.createCircularReveal(  
                rect,  
                0,  
                0,  
                0,  
                (float) Math.hypot(rect.getWidth(), rect.getHeight()));  
        animator.setInterpolator(new AccelerateInterpolator());  
        animator.setDuration(2000);  
        animator.start();  
    }  
});  
上一篇 下一篇

猜你喜欢

热点阅读