Android L限制Ripple水波纹范围大小

Ripple 简介

Android 5.0 之后 google 推出了 Material Design，Botton 默认的触摸反馈会有水波纹涟漪效果。而这种水波纹的效果实现主要依赖于。

以下会介绍 Ripple 的基本使用及关于控制水波纹范围的三种处理方法，仅作点明思路及学习笔记不作具体实现。

基本使用

该效果通常以 background 的形式呈现，在 XML 中可以引用以下两个系统自带属性：

- android:background="?android:attr/selectableItemBackground" 有边界波纹

- android:background="?android:attr/··" 超出边界波纹。该波纹由父布局绘制及限制边界 (API 21 提供)

以selectableItemBackground为例看下系统属性的实现原理，发现该属性的定义最终指向 @drawable/item_background_material,

查看该 Drawable 文件内容为：

android:color="?attr/colorControlHighlight">

selectableItemBackgroundBorderless 所对应 Drawable 内容为："http://schemas.android.com/apk/res/android"android:color="?attr/colorControlHighlight"/>

XML 控制

特点：简单，用于固定的 view 的处理，但灵活性不高。

目前网络上的资料偏向于如何在 xml 的 item 下做文章，如在 ripple 中添加 shape 来限制范围，验证效果反而有各种小坑 (谁验谁知道)。殊不知官方早已提供解决方案。"http://schemas.android.com/apk/res/android"

android:color="?android:attr/colorControlHighlight"

android:radius="@dimen/ripple_radius"/>

自定义 RippleDrawable

特点：可以动态控制，灵活性超级高，但对应的处理复杂度和难度也较高。

设置水波纹点击效果的本质其实就是设置一个 background，最为灵活的方法当然是自定义 ripple，然后对目标 View 直接 setBackground 即可.

RippleDrawable 继承于 Drawable

自定义时可以继承 RippleDrawable 也可以直接继承 Drawable，两者的本质分别是实现setRadius()和实现 setHotspotBounds()，殊途同归，均可以达到动态限制波纹大小的效果。系统的虚拟键 NavigationBar 就是使用的后者。

折中方案

特点：简单，灵活适中，易上手

以selectableItemBackgroundBorderless超出边界范围为基础，以 setHotspotBounds()的方式动态控制其波纹范围。

以下提供的是个简易工具 demo，调用时传入对应的 viewxxx.setBackground(RippleUtils.getRippleDrawable(context,targetView))，也可以自己定义增加一个控制 ripple 范围的方法：/**

* Created by vito on 16-11-1.

*/

publicclassRippleUtils{

privatestaticRippleDrawablemRipple;

privatestaticDrawablemTileBackground;

privatestaticDrawablenewTileBackground(Contextcontext){

finalint[]attrs=newint[]{

android.R.attr.selectableItemBackgroundBorderless

};

finalTypedArrayta=context.obtainStyledAttributes(attrs);

finalDrawabled=ta.getDrawable(0);

ta.recycle();

returnd;

}

privatestaticvoidsetRipple(RippleDrawabletileBackground,Viewv){

mRipple=tileBackground;

updateRippleSize(v);

}

//以view的中心为圆心，宽的1/4为半径的ripple范围

privatestaticvoidupdateRippleSize(Viewv){

// center the touch feedback on the center of the icon, and dial it down a bit

if(v.getWidth()!=0){

finalintcx=v.getWidth()/2;

finalintcy=v.getHeight()/2;

finalintrad=(int)(v.getWidth()*.25f);

Log.d("ripple","updateRippleSize: rad="+rad);

mRipple.setHotspotBounds(cx-rad,cy-rad,cx+rad,cy+rad);

}else{

// TODO: 17-1-9

}

}

//对外接口

publicstaticRippleDrawablegetRippleDrawable(Contextcontext,Viewview){

mTileBackground=newTileBackground(context);

if(mTileBackgroundinstanceofRippleDrawable){

setRipple((RippleDrawable)mTileBackground,view);

}

returnmRipple;

}

}

来源: