前言
在看网易云音乐播放器的时候,觉得它在选择音乐时候的波纹效果很好看,就想要模仿这种效果。然后在网上找了一下这方面的文章,最后被我发现了ripple,用ripple就能很好地实现这种波纹效果。所以用这篇文章记录下ripple的实现,如果发现我的代码有问题,欢迎大家指出。
实现的效果
ripple的使用
首先在res目录下新建一个drawable-v21的目录,然后在里面新建一个drawable文件ripple_style_one.xml,如图
ripple_style_one.xml
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="@android:color/darker_gray"> <!-- 点击时波纹的颜色 -->
<item android:drawable="@android:color/white"/> <!-- 没有点击时的颜色 -->
</ripple>
在该文件中可以设置点击时的波纹颜色,然后在控件的background中设置该drawable文件就可以了
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="纯波纹"
android:clickable="true"
android:textSize="22sp"
android:paddingStart="30dp"
android:paddingEnd="30dp"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:focusable="true"
android:background="@drawable/ripple_style_one"/>
除了单独使用ripple外,ripple还可以和selector结合起来,使用方法如下
ripple_style_two.xml
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="@android:color/darker_gray"> <!-- 波纹颜色 -->
<item> <!-- item中可以包含selector -->
<selector>
<item android:state_pressed="true"
android:drawable="@android:color/darker_gray"/> <!-- 按下屏幕后显示的颜色 -->
<item android:drawable="@android:color/white"/> <!-- 没有操作时的颜色 -->
</selector>
</item>
</ripple>
同样在控件的background中设置该drawable文件
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="波纹搭配selector"
android:clickable="true"
android:textSize="22sp"
android:paddingStart="30dp"
android:paddingEnd="30dp"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:focusable="true"
android:background="@drawable/ripple_style_two"/>
OK,做完这些再运行就会出现文章开头处给出的效果。
注意
- 设置了ripple的drawable文件必须放在drawable-v21文件夹中,如果放在drawable文件夹中会报错。
- drawable-v21文件夹存放的xml文件在API 21(5.0版本)以上才可使用,也就是说低于该版本的手机不能使用这种波纹效果。
- 在设置RecyclerView的item的水波纹点击效果的时候,如果item的布局在CardView中,不能在CardView中设置水波纹效果,不然会没有效果。应在对应的线性布局或相对布局中设置。