RippleView水波纹，涟漪效果

最新推荐文章于 2024-09-27 10:36:57 发布

ruzhan123

最新推荐文章于 2024-09-27 10:36:57 发布

阅读量2.9k

点赞数

分类专栏： Android 文章标签：动画 android view 涟漪水波纹

本文链接：https://blog.csdn.net/Ru_Zhan/article/details/51812017

版权

这篇博客介绍了如何在Android中实现RippleView水波纹动画，包括自定义View，利用onDraw方法画圆，通过ValueAnimator进行动画处理，以及设置状态监听器和属性参数。详细步骤涵盖从设计思路到代码实现，最后展示动画效果。

摘要由CSDN通过智能技术生成

模仿水波纹，涟漪效果，可用于设备查找之类的特效

Demo下载：我的Github RippleView

其实这是一个很简单的自定义View，只需要一个类，然后对外提供状态回调接口和设置属性的方法即可。

下面要说设计思路了。

1，自定义一个View。

2，在onDraw方法里画圆，初始化画笔，半径多少，要画几个圆，实心圆还是空心圆，这些都要想好。

3，通过ValueAnimator 动画每一贞的回调改变圆半径，调用postInvalidate方法不断重绘，就能产生水波纹效果了。

4，设置状态监听器，设置注入方法，在该使用的地方回调一把出去。

5，设置圆的属性参数的方法。

6，在外面使用。

水波纹自定义View，设计思路就是酱子。

接下来看代码详细的分析上述所说的步骤。

1，自定义一个View。


    public class RippleView extends View {
   

        public RippleView(Context context) {
            super(context);
            init();
        }

        public RippleView(Context context, AttributeSet attrs) {
            super(context, attrs);
            init();
        }

        public RippleView(Context context, AttributeSet attrs, int defStyleAttr) {
            super(context, attrs, defStyleAttr);
            init();
        }
    }

2，在onDraw方法里画圆，初始化画笔，半径多少，要画几个圆，实心圆还是空心圆，这些都要想好。

初始化画笔，半径。注意mChangeRadius为动画开始后不断改变的半径值，为了不断画更大的圆。


        private void init() {
            mRadius = dip2px(NORMAL_RADIUS);
            mChangeRadius = mRadius;

            //初始化实心内圆画笔
            mInPaint.setColor(getResources().getColor(R.color.white10));
            mInPaint.setAntiAlias(true);
            mInPaint.setStyle(Paint.Style.FILL);

            //初始化空心内圆画笔
            mInStrokePaint.setColor(getResources().getColor(R.color.white50));
            mInStrokePaint.setAntiAlias(true);
            mInStrokePaint.setStyle(Paint.Style.STROKE);
            mInStrokePaint.setStrokeWidth(dip2px(mStrokeWidth));

            //初始化空心外圆画笔
            mOutStrokePaint.setColor(getResources().getColor(R.color.white50));