Android之水波纹点击效果(RippleView)

释放双眼,带上耳机,听听看~!

Android5.0后各种炫的效果纷纷出来,写这篇博客主要是讲的是按钮点击效果带有的水波纹(波浪式)。

当然我写的这个是自定义来实现的,在低版本(5.0一下)也可以实现点击效果。看看效果图:

上图可看出 点击有抖动效果和不抖动效果。

布局代码:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ripple="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.zq.waveeffects.MainActivity">
<!--其他属性自行测试-->
<com.zq.waveeffects.RippleView
android:id="@+id/more"
android:layout_width="?android:actionBarSize"
android:layout_height="?android:actionBarSize"
android:layout_margin="5dp"
ripple:rv_centered="true">
<ImageView
android:layout_width="88dp"
android:layout_height="88dp"
android:layout_gravity="center"
android:background="@android:color/holo_blue_dark"
android:padding="10dp"
android:src="https://blog.csdn.net/hdhhd/article/details/103085560/@android:drawable/ic_menu_edit" />
</com.zq.waveeffects.RippleView>
<com.zq.waveeffects.RippleView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="25dp"
android:layout_marginRight="25dp"
android:layout_marginTop="65dp"
ripple:rv_type="rectangle"
ripple:rv_zoom="true">
<!-- ripple:rv_type="doubleRipple"  控制类型
ripple:rv_zoom="true"  是否抖动
-->
<TextView
android:id="@+id/my_comment_submit"
android:layout_width="match_parent"
android:layout_height="55dp"
android:background="@drawable/border_red_roval_sign"
android:gravity="center"
android:text="效果1"
android:textColor="@android:color/white" />
</com.zq.waveeffects.RippleView>
<com.zq.waveeffects.RippleView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="25dp"
android:layout_marginRight="25dp"
android:layout_marginTop="15dp"
ripple:rv_type="simpleRipple"
ripple:rv_zoom="false">
<TextView
android:layout_width="match_parent"
android:layout_height="55dp"
android:background="@drawable/border_red_roval_sign"
android:gravity="center"
android:text="效果2"
android:textColor="@android:color/white" />
</com.zq.waveeffects.RippleView>
<com.zq.waveeffects.RippleView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="25dp"
android:layout_marginRight="25dp"
android:layout_marginTop="15dp"
ripple:rv_type="doubleRipple"
ripple:rv_zoom="false">
<TextView
android:layout_width="match_parent"
android:layout_height="55dp"
android:background="@drawable/border_red_roval_sign"
android:gravity="center"
android:text="效果3"
android:textColor="@android:color/white" />
</com.zq.waveeffects.RippleView>
</LinearLayout>

自定义的RippleView代码比较多,直接下载源码即可;

源码地址:https://github.com/traex/RippleEffect

人已赞赏
Android文章

android接入微信登录授权提示{"errcode":40125,"errmsg":"invalid appsecret, view more at 。。。解决办法

2020-2-29 8:25:00

Android文章

Android 底部导航栏 开源JPTabBar

2020-2-29 10:27:10

个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索