Android开发-自定义View-AndroidStudio(十八)自定义水波纹(2)

转载请注明出处： http://blog.csdn.net/iwanghang/article/details/53992481
觉得博文有用，请点赞，请评论，请关注，谢谢！~


老规矩，先上GIF动态图，看个效果，如果符合你的项目或者确定你要了解的内容，再往下看吧：
然后我们就想了，是不是要每次触摸，都要来一次水波纹，自然要用到onTouchEvent，可是，因为前面的防止无限重绘的判断，这里出现了一个BUG，下面我会进行解决，并且简单美化一下水波纹效果。所以，本篇博文依然有2个GIF动态图。


WaveView.java：

package com.iwanghang.waveview;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.os.Handler;
import android.os.Message;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.widget.Toast;

/**
 * 水波纹
 */
public class WaveView extends View {

    private Paint paint;
    private int radio = 5; // 圆环半径
    private float downX = 200; // 按下屏幕坐标X
    private float downY = 200; // 按下屏幕坐标Y

    public WaveView(Context context, AttributeSet attrs) {
        super(context, attrs);
        initView();
    }

    // 1、创建画笔
    private void initView() {
        radio = 5;
        paint = new Paint();
        paint.setColor(Color.RED);
        paint.setAntiAlias(true); // 抗锯齿
        paint.setStyle(Paint.Style.STROKE); // 样式为圆环
        paint.setStrokeWidth(radio); // 圆环宽度为radio
    }

    // 2、开始绘制
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawCircle(downX,downY,radio,paint); // 重绘的圆环的内径A1
        if (paint.getAlpha()>0){ // 只有当透明度大于0 才继续给handler发消息 B3
            handler.sendEmptyMessageDelayed(0,50); // 每次重绘后，等待50毫秒，给handler发消息 B1
        }
    }

    // 3、让圆环动起来 实例化一个Handler
    private Handler handler = new Handler(){
        @Override
        public void handleMessage(Message msg) {
            // 每次handler接到消息都要invalidate()从而onDraw(); B2
            super.handleMessage(msg);
            radio += 5; // 这里的自增会影响每一次重绘的圆环的内径A1和圆环的宽度A2
            paint.setStrokeWidth(radio); // 重绘的圆环的宽度A2

            // 4、让圆环透明度递减
            int alpha = paint.getAlpha();
            alpha -= 5;
            if (alpha <= 0){
                alpha = 0;
            }
            paint.setAlpha(alpha);

            invalidate(); // onDraw();
        }
    };

    // 5、拦截触摸事件
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()){
            case MotionEvent.ACTION_DOWN:
                Toast.makeText(getContext(), "ACTION_DOWN", Toast.LENGTH_SHORT).show();
                downX = event.getX();
                downY = event.getY();
                initView(); // 重新初始化圆环
                break;
        }
        return super.onTouchEvent(event);
    }
}

最终效果，解决BUG，少些写一句invalidate()；

Wave.java：

package com.iwanghang.waveview;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.os.Handler;
import android.os.Message;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
import android.widget.Toast;

/**
 * 水波纹
 */
public class WaveView extends View {

    private Paint paint;
    private int radio = 5; // 圆环半径
    private float downX = 200; // 按下屏幕坐标X
    private float downY = 200; // 按下屏幕坐标Y
    private int colorMark = 0;
    private int myColor;

    public WaveView(Context context, AttributeSet attrs) {
        super(context, attrs);
        initView();
    }

    // 1、创建画笔
    private void initView() {
        radio = 5;
        paint = new Paint();
        intColorMark(); // 获取颜色
        paint.setColor(myColor);
        paint.setAntiAlias(true); // 抗锯齿
        paint.setStyle(Paint.Style.STROKE); // 样式为圆环
        paint.setStrokeWidth(radio/3); // 圆环宽度为radio
    }

    private void intColorMark() {
        colorMark += 1;
        if (colorMark == 1){
            myColor = Color.RED;
        }else if (colorMark == 2) {
            myColor = Color.BLUE;
        }else if (colorMark == 3) {
            myColor = Color.GREEN;
        }else {
            colorMark = 0;
            myColor = Color.BLACK;
        }
    }

    // 2、开始绘制
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawCircle(downX,downY,radio,paint); // 重绘的圆环的内径A1
        if (paint.getAlpha()>0){ // 只有当透明度大于0 才继续给handler发消息 B3
            handler.sendEmptyMessageDelayed(0,50); // 每次重绘后，等待50毫秒，给handler发消息 B1
        }
    }

    // 3、让圆环动起来 实例化一个Handler
    private Handler handler = new Handler(){
        @Override
        public void handleMessage(Message msg) {
            // 每次handler接到消息都要invalidate()从而onDraw(); B2
            super.handleMessage(msg);
            radio += 5; // 这里的自增会影响每一次重绘的圆环的内径A1和圆环的宽度A2
            paint.setStrokeWidth(radio/3); // 重绘的圆环的宽度A2

            // 4、让圆环透明度递减
            int alpha = paint.getAlpha();
            alpha -= 5;
            if (alpha <= 0){
                alpha = 0;
            }
            paint.setAlpha(alpha);

            invalidate(); // onDraw();
        }
    };

    // 5、拦截触摸事件
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()){
            case MotionEvent.ACTION_DOWN:
                Toast.makeText(getContext(), "ACTION_DOWN", Toast.LENGTH_SHORT).show();
                downX = event.getX();
                downY = event.getY();
                initView(); // 重新初始化圆环
                invalidate(); // onDraw();
                break;
        }
        return super.onTouchEvent(event);
    }
}

转载请注明出处： http://blog.csdn.net/iwanghang/article/details/53992481

欢迎移动开发爱好者交流
沈阳或周边城市公司有意开发Android，请与我联系
联系方式

微信：iwanghang
QQ：413711276
邮箱：iwanghang@qq.com

觉得博文有用，请点赞，请评论，请关注，谢谢！~