</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