一起Talk Android吧（第五百一十五回：绘制向外扩散的水波纹)

Posted 2023-03-08 talk_8

文章目录

• 整体思路
• 实现方法
• 示例代码

各位看官们大家好，上一回中咱们说的例子是"Java中的进制转换",这一回中咱们说的例子是"

绘制向外扩散的水波纹

"。闲话休提，言归正转， 让我们一起Talk android吧！

整体思路

我们使用自定义View的思路来实现水波纹，先画一个圆环，然后通过动画不断地放大圆环进而形成向外扩散的效果，在放大圆环的同时让圆环逐渐变透明，形成波纹消失
的效果。两种动画效果叠加在一起就形成了扩散的水波纹效果。

实现方法

1. 重写构造方法，在构造方法中初始化画笔相关参数；也可以把圆环的大小，半径，颜色做成自定义属性，通过属性来配置圆环的大小等信息；
2. 重写测量方法，主要是计算圆环的长度和宽度，我们在这里就不不重写该方法了，大家可以参考自定义View中的模板代码；
3. 重写绘制方法，在该方法中绘制一个圆环，绘制时计算圆环的位置（圆心），同时会使用圆环的半径和画笔；
4. 创建一个动画集，其中包含大小缩放和透明度渐变两个子动画；缩放时只放大，渐变时从不透明渐渐变透明；
5. 把自定义的波纹控件放到布局中，并且在给该控件绑定上一步中创建的动画集；

示例代码

介绍完实现方法，下面是示例代码，请大家参考：

public class WaveView extends View 
    private Paint mPaint;
    private int radius;

    public WaveView(Context context) 
        super(context);
        init();
    

    public WaveView(Context context, @Nullable AttributeSet attrs) 
        super(context, attrs);
        init();
    

    public WaveView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) 
        super(context, attrs, defStyleAttr);
        init();
    

    public WaveView(Context context, @Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) 
        super(context, attrs, defStyleAttr, defStyleRes);
        init();
    

    private void init() 
        mPaint = new Paint();
        mPaint.setColor(Color.BLUE);
        mPaint.setStyle(Paint.Style.STROKE);
        mPaint.setAntiAlias(true);
        mPaint.setStrokeWidth(24);
        radius = 100;
    

    @Override
    protected void onDraw(Canvas canvas) 
        super.onDraw(canvas);
        int x = getWidth()/2;
        int y = getHeight()/2;
        RectF rectF = new RectF(x-radius,y-radius,x+radius,y+radius);

        canvas.drawCircle(x,y,radius,mPaint);
//        canvas.drawArc(rectF,0,180,false,mPaint);
        startAnima();
    

    private void startAnima() 
        ObjectAnimator objectAnimator = ObjectAnimator.ofObject(this,"scale",null,2);
        objectAnimator.setDuration(2000);
        objectAnimator.start();
        invalidate();
    

看官们，关于"绘制向外扩散的水波纹"的例子咱们就介绍到这里，欲知后面还有什么例子，且听下回分解！