自定义View--颜色选择器

</pre>这是一个基本的颜色选择器，可以选取9种颜色，选中后回调监听的方法，把选中的颜色的RGB值返回<p></p><p>首先看一下效果图</p><p></p><p>没显示</p><p><img src="https://img-blog.csdn.net/20141229203500133" alt="" width="299" height="315" /></p><p></p><p>弹出之后的效果</p><p><img src="https://img-blog.csdn.net/20141229203510710" alt="" width="300" /></p><p></p><p>点击后的效果 </p><p><img src="https://img-blog.csdn.net/20141229203523828" alt="" width="300" /></p><p> </p><p>下面我来说一下代码的实现</p><p>首先绘制一个显示颜色选项的View，我定义的是  ColorListView</p><p></p><pre name="code" class="html">import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Point;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;


public class ColorListView extends View {
	private int width = 100;	//每一个色块的长度
	private int row = 3;		//行
	private int col = 3;		//列
	private int boderColor = Color.parseColor("#b1eede"); // 边框颜色
	private int boderWidth = 6; // 边框的宽度
	private int padding = 6; // 灰色的填充
	Rect rect = new Rect();	
	private int colors[] = new int[9];		//颜色


	private boolean isClick = false;		//判断是不是点击事件
	private Point point = new Point(-1, -1);	//保存点击所在的色块的左上角坐标
	
	private Paint paint = new Paint();		//画笔


	private onColorSelectListener listener;	//回掉接口
	private int index = -1;					//记录当前点击的色块


	public ColorListView(Context context, AttributeSet attrs, int defStyle) {
		super(context, attrs, defStyle);
		initColors();
	}


	public ColorListView(Context context, AttributeSet attrs) {
		super(context, attrs);
		initColors();
	}


	public ColorListView(Context context) {
		super(context);
		initColors();
	}


	/**
	 * 返回当前选中的颜色
	 * @return
	 */
	public int getColor() {
		if(index<0||index>colors.length)
			return -1;
		return colors[index];
	}


	/**
	 * 设置回掉接口
	 * @param listener
	 */
	public void setOnColorSelectListener(onColorSelectListener listener) {
		this.listener = listener;
	}


	/**
	 * 初始化颜色
	 * 
	 */
	private void initColors() {
		colors[0] = Color.RED; // 红色
		colors[1] = Color.rgb(255, 125, 0); // 橙色
		colors[2] = Color.YELLOW;
		colors[3] = Color.GREEN;
		colors[4] = Color.BLUE;
		colors[5] = Color.rgb(0, 255, 255); // 靛
		colors[6] = Color.rgb(255, 0, 255); // 紫
		colors[7] = Color.BLACK;
		colors[8] = Color.WHITE;
	}




	@Override
	protected void onDraw(Canvas canvas) {
		super.onDraw(canvas);


		//把所有的色块画出了
		this.drawColorRects(width, padding, boderWidth, boderColor, row, col,
				colors, canvas, paint);


		// 如果不为空
		if (point.x != -1) {
			canvas.save();
			canvas.translate(point.x + boderWidth, point.y + boderWidth);
			this.drawSquare(width - boderWidth - boderWidth, padding,
					Color.parseColor("#FFDAB9"), canvas, paint);
			canvas.restore();
		}
	}


	/**
	 * 画正方形的边框
	 * 
	 * @param rectWidth
	 *            边长
	 * @param boderWidth
	 *            边框宽度
	 */
	private void drawSquare(int rectWidth, int boderWidth, int boderColor,
			Canvas canvas, Paint paint) {
		canvas.save();
		Rect rect = new Rect();
		rect.set(0, 0, rectWidth, boderWidth);
		paint.setColor(boderColor);
		// 上边
		canvas.drawRect(rect, paint);


		// 下边
		canvas.translate(0, rectWidth - boderWidth);
		canvas.drawRect(rect, paint);


		// 左边
		canvas.rotate(-90f);
		rect.set(0, 0, rectWidth - 2 * boderWidth, boderWidth);
		canvas.drawRect(rect, paint);


		// 右边
		canvas.translate(0, rectWidth - boderWidth);
		canvas.drawRect(rect, paint);
		canvas.restore();
	}


	/***
	 * 绘制一个色块
	 * @param rectWidth  色块的边长
	 * @param padding	 灰色填充
	 * @param boderWidth	色块的边框宽
	 * @param boderColor	边框的颜色
	 * @param rectColor		
	 * @param canvas
	 * @param paint
	 */
	private void drawColorRect(int rectWidth, int padding, int boderWidth,
			int boderColor, int rectColor, Canvas canvas, Paint paint) {
		
		this.drawSquare(rectWidth, boderWidth, boderColor, canvas, paint);


		Rect rect = new Rect();


		// 画背景
		rect.set(boderWidth, boderWidth, rectWidth - boderWidth, rectWidth
				- boderWidth);
		paint.setColor(Color.GRAY);
		canvas.drawRect(rect, paint);
		// 画色块
		rect.set(0, 0, rectWidth - (padding + boderWidth) * 2, rectWidth
				- (padding + boderWidth) * 2);
		paint.setColor(rectColor);
		canvas.save();
		canvas.translate(padding + boderWidth, padding + boderWidth);
		canvas.drawRect(rect, paint);
		canvas.restore();
	}


	@Override
	protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
		super.onMeasure(widthMeasureSpec, heightMeasureSpec);
		setMeasuredDimension(width * row, width * col);
	}


	
	private void drawColorRects(int rectWidth, int padding, int borderWidth,
			int borderColor, int row, int col, int colors[], Canvas canvas,
			Paint paint) {
		canvas.save();
		for (int i = 0; i < row; i++) {
			canvas.save();
			canvas.translate(-rectWidth, 0);
			for (int j = 0; j < col; j++) {
				canvas.translate(rectWidth, 0);
				drawColorRect(rectWidth, padding, borderWidth, borderColor,
						colors[i * row + j], canvas, paint);
			}
			canvas.restore();
			canvas.translate(0, rectWidth);
		}
		canvas.restore();
	}


	@Override
	public boolean onTouchEvent(MotionEvent event) {
		switch (event.getAction()) {
		case MotionEvent.ACTION_DOWN:
			isClick = true;
			point.x = -1;
			break;
		case MotionEvent.ACTION_MOVE:
			isClick = false;
			point.x = -1;
			return false;
		case MotionEvent.ACTION_UP:
			if (isClick) {
				isClick = false;
				int x = (int) event.getX();
				int y = (int) event.getY();


				// 如果不在范围内
				float temp = x % width;
				if (temp < (padding + boderWidth)
						|| temp > width - (padding + boderWidth))
					return false;


				temp = y % width;
				if (temp < (padding + boderWidth)
						|| temp > width - (padding + boderWidth))
					return false;


				point = new Point((x / width) * width, (y / width) * width);


				index = x / width + (y / width) * col;
				if (listener != null) {
					listener.onColorSelect(colors[index]);
				}
				invalidate();
			}
		}
		return true;
	}


	public interface onColorSelectListener {
		/**
		 * 返回color
		 * 
		 * @param color
		 */
		public void onColorSelect(int color);
	}
}

主要实现时，首先编写一个画一个色块的方法，然后用for循环，绘制出3x3的色块，最后在onMeasure方法设置view的大小

点击监听方面，主要是改写onTouchEvent方法，因为如果是action_down事件就到action_up事件，就是一次点击事件，

然后取出的点击的X,Y,判断范围，如果刚好是色块里面，就刷新页面，并且复制Point

然后，用PopupWindow,把这View弹出

import android.content.Context;
import android.graphics.drawable.ColorDrawable;
import android.view.View;
import android.view.ViewGroup;
import android.widget.PopupWindow;

import com.yky.android.ColorListView.onColorSelectListener;

public class ColorPopuWindow {
	private PopupWindow mWindow;
	private ColorListView mColorView;

	public void setOnColorSelectListener(onColorSelectListener listener) {
		mColorView.setOnColorSelectListener(listener);
	}
	
	private void init(Context context) {
		mColorView = new ColorListView(context);
		mWindow = new PopupWindow(context);
		mWindow = new PopupWindow(mColorView,
				ViewGroup.LayoutParams.WRAP_CONTENT,
				ViewGroup.LayoutParams.WRAP_CONTENT);
		mWindow.setOutsideTouchable(true);
		ColorDrawable cd = new ColorDrawable(-0000);  
		mWindow.setBackgroundDrawable(cd);  
	}
	
	public ColorPopuWindow(Context context) {
		init(context);
	}
	
	public void showAtView(View batch){
		mWindow.showAsDropDown(batch);
	}
}

就是这样了，源码在

http://download.csdn.net/detail/a1a1a1a1s/8313005