自定义view实现水波荡漾的效果

一、不多说，先上图

二、创建RingView继承View

实现带参数的构造方法：

Ⅰ、RingView(Context context, AttributeSet attrs)

Ⅱ、重写onDraw(Canvas canvas)

package net.dxs.ringview;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;

public class RingView extends View {
	private Context ctx;
	private Paint paint;
	
	public RingView(Context context, AttributeSet attrs) {
		super(context, attrs);
		this.ctx = context;
		
		this.paint = new Paint();
		this.paint.setAntiAlias(true);//消除锯齿
		this.paint.setStyle(Paint.Style.STROKE);//绘制空心圆
	}
	
	/**
	 * 默认半径
	 */
	public int radius = 83;
	/**
	 * 默认圆环宽度
	 */
	public int ring = 15;
	
	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);
		int content = getWidth()/2;//半径
		int innerCircle = dip2px(ctx,radius); //设置内圆半径
		int ringWidth = dip2px(ctx,ring);  //设置圆环宽度
		
		paint.setARGB(255, 255, 0, 0);
		paint.setStrokeWidth(ringWidth);
		
		canvas.drawCircle(content, content, innerCircle, paint);
	}

	/**
	 * 根据手机的分辨率从 dp 的单位 转成为 px(像素)
	 */
	public static int dip2px(Context context, float dpValue) {
		final float scale = context.getResources().getDisplayMetrics().density;
		return (int) (dpValue * scale + 0.5f);
	}
}

三、调用

使用handler实现回调

package net.dxs.ringview;

import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.os.SystemClock;
import android.view.MotionEvent;

public class RingViewActivity extends Activity {
	
	private RingView ringView;
	
	private Handler handler = new Handler(){
		public void handleMessage(android.os.Message msg) {
			int r = msg.what * 8;
			ringView.radius = r;
			ringView.ring = (15 - msg.what)*2;
			ringView.invalidate();//  invalidate方法   常用来刷新视图，，会触发 onDraw()方法 的执行
		};
	};

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		ringView = (RingView) findViewById(R.id.ringView);
		init();
	}
	
	private void init() {
		new Thread(){
			public void run() {
				while (true) {
					for (int i = 3; i < 10; i++) {
						handler.sendEmptyMessage(i);
						SystemClock.sleep(100);
					}
				}
			};
		}.start();
	}
}

四、布局文件

在帧布局中添加自定义view

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@android:color/white"
    android:orientation="vertical" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="flash 效果演示-水波荡漾"
        android:textSize="20sp" />

    <FrameLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" >

        <net.dxs.ringview.RingView
            android:id="@+id/ringView"
            android:layout_width="280dp"
            android:layout_height="280dp" >
        </net.dxs.ringview.RingView>
    </FrameLayout>

</LinearLayout>