/*
* 这个demon演示了如何在画板上自由绘制图形,可以选择绘制的颜色,可以设置线条的浮雕和毛边效果
* 可以擦除,还实现了一种图像的整合模式。
*/
public class MainActivity extends Activity implements OnColorChangedListener {
private Paint mPaint;
// 设置笔刷的浮雕效果
private MaskFilter mEmboss;
// 设置笔刷的毛边效果
private MaskFilter mBlur;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(new MyView(this));
mPaint = new Paint();
mPaint.setAntiAlias(true);
mPaint.setDither(true);
mPaint.setColor(0xffff0000);
mPaint.setStyle(Paint.Style.STROKE);
// 设置结合处的样式为圆角
mPaint.setStrokeJoin(Paint.Join.ROUND);
// 设置画笔的笔触风格为圆形
mPaint.setStrokeCap(Paint.Cap.ROUND);
mPaint.setStrokeWidth(12);
mEmboss = new EmbossMaskFilter(new float[] { 1, 1, 1 }, 0.4f, 6, 3.5f);
mBlur = new BlurMaskFilter(8, BlurMaskFilter.Blur.NORMAL);
}
private class MyView extends View {
private Path mPath;
private Paint mBitmapPaint;
private Bitmap mBitmap;
private Canvas mCanvas;
public MyView(Context context) {
super(context);
mPath = new Path();
mBitmapPaint = new Paint(Paint.DITHER_FLAG);
}
// 当视图大小发生变化时重置画布
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
mBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
mCanvas = new Canvas(mBitmap);
}
@Override
protected void onDraw(Canvas canvas) {
canvas.drawColor(0xffaaaaaa);
canvas.drawBitmap(mBitmap, 0, 0, mBitmapPaint);
canvas.drawPath(mPath, mPaint);
}
float mx, my;
// 定义移动的幅度
private static final float TOUCH_TOLERANCE = 4;
private void touch_start(float x, float y) {
mPath.reset();
mPath.moveTo(x, y);
mx = x;
my = y;
}
private void touch_move(float x, float y) {
float dx = Math.abs(x - mx);
float dy = Math.abs(y - my);
if (dx >= TOUCH_TOLERANCE || dy >= TOUCH_TOLERANCE) {
/*
* 该方法用于绘制一条贝塞尔曲线(圆滑的弧线)前两个参数表示节点(控制点,用于控制
* 曲线的弯曲和弧度),后两个参数表示结束点的坐标,线段的开始点则为Path最近
* moveto的地方。这里将控制点与新坐标的中点作为结束点,下次再次调用该方法时
* 将新的坐标点作为控制点,控制点就位于起始点和结束点大约中央的位置。
*/
mPath.quadTo(mx, my, (mx + x) / 2, (my + y) / 2);
mx = x;
my = y;
}
}
private void touch_up() {
mPath.lineTo(mx, my);
// 绘制路径
mCanvas.drawPath(mPath, mPaint);
// 重置路径
mPath.reset();
}
@Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
touch_start(x, y);
invalidate();
break;
case MotionEvent.ACTION_MOVE:
touch_move(x, y);
invalidate();
break;
case MotionEvent.ACTION_UP:
touch_up();
invalidate();
break;
}
return true;
}
}
private static final int COLOR_MENU_ID = Menu.FIRST;
private static final int EMBOSS_MENU_ID = Menu.FIRST + 1;
private static final int BLUR_MENU_ID = Menu.FIRST + 2;
private static final int ERASE_MENU_ID = Menu.FIRST + 3;
private static final int SRCATOP_MENU_ID = Menu.FIRST + 4;
@Override
public boolean onCreateOptionsMenu(Menu menu) {
super.onCreateOptionsMenu(menu);
menu.add(0, COLOR_MENU_ID, 0, "Color");
menu.add(0, EMBOSS_MENU_ID, 0, "Emboss");
menu.add(0, BLUR_MENU_ID, 0, "Blur");
menu.add(0, ERASE_MENU_ID, 0, "Erase");
menu.add(0, SRCATOP_MENU_ID, 0, "SrcTop");
return true;
}
@Override
public boolean onPrepareOptionsMenu(Menu menu) {
super.onPrepareOptionsMenu(menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
mPaint.setXfermode(null);
mPaint.setAlpha(0xff);
switch (item.getItemId()) {
case COLOR_MENU_ID:
new ColorPickerDialog(this, this, mPaint.getColor()).show();
return true;
case EMBOSS_MENU_ID:
if(mPaint.getMaskFilter()!=mEmboss){
mPaint.setMaskFilter(mEmboss);
}else{
mPaint.setMaskFilter(null);
}
return true;
case BLUR_MENU_ID:
if(mPaint.getMaskFilter()!=mBlur){
mPaint.setMaskFilter(mBlur);
}else{
mPaint.setMaskFilter(null);
}
return true;
case ERASE_MENU_ID:
//设置整合模式
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
return true;
case SRCATOP_MENU_ID:
//该模式下只显示原图和新绘制的图形与原图相交的部分
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_ATOP));
mPaint.setAlpha(0x80);
return true;
}
return super.onOptionsItemSelected(item);
}
@Override
public void colorChanged(int color) {
mPaint.setColor(color);
}
}
ColorPickerDialog
/*
* 定义一个颜色选择器
*/
public class ColorPickerDialog extends Dialog {
// 定义一个接口用于监听颜色的变化
public interface OnColorChangedListener {
void colorChanged(int color);
}
private OnColorChangedListener mListener;
// 定义初始颜色
private int mInitialColor;
// 定义对话框的界面视图
private class ColorPickerView extends View {
// 定义画外圆的画笔
private Paint mPaint;
// 定义内圆的画笔
private Paint mCenterPaint;
private int[] mColors;
private OnColorChangedListener mColorChangedListener;
public ColorPickerView(Context context, OnColorChangedListener l,
int color) {
super(context);
// 在构造方法中初始化定义的各个类
mColorChangedListener = l;
mColors = new int[] { 0xffff0000, 0xffff00ff, 0xff0000ff,
0xff00ffff, 0xff00ff00, 0xffffff00, 0xffff0000 };
// 以0,0为圆心进行扫描渐变,后面我们会将画布移至圆心
Shader s = new SweepGradient(0, 0, mColors, null);
mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
mPaint.setShader(s);
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setStrokeWidth(32);
mCenterPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
mCenterPaint.setColor(color);
mCenterPaint.setStrokeWidth(5);
}
// 用于判定是否在内圆的内部移动
private boolean mTrackingCenter;
// 用于判定是否高亮显示内圆的描边
private boolean mHeightLightCenter;
private static final int CENTER_X = 100;
private static final int CENTER_Y = 100;
private static final int CENTER_RADIUS = 32;
@Override
protected void onDraw(Canvas canvas) {
canvas.drawColor(Color.BLACK);
float r = CENTER_X - mPaint.getStrokeWidth() * 0.5f;
// 移动画布至圆心
canvas.translate(CENTER_X, CENTER_Y);
// 绘制一个宽度为32的圆环
canvas.drawCircle(0, 0, r, mPaint);
// 以初始的颜色绘制内部小圆
canvas.drawCircle(0, 0, CENTER_RADIUS, mCenterPaint);
// 如果按下时与屏幕的接触点位于小圆的内部,则以相同的颜色为小圆描边
if (mTrackingCenter) {
//int c=mCenterPaint.getColor();
mCenterPaint.setStyle(Paint.Style.STROKE);
if (mHeightLightCenter) {
// 如果高亮显示则设置画笔的透明度为完全不透明
mCenterPaint.setAlpha(0xff);
} else {
// 如果不需要高亮显示则降低透明度
mCenterPaint.setAlpha(0x80);
}
// 绘制描边
canvas.drawCircle(0, 0, mCenterPaint.getStrokeWidth()
+ CENTER_RADIUS, mCenterPaint);
// 将画笔的风格设置回填充模式
mCenterPaint.setStyle(Paint.Style.FILL);
//mCenterPaint.setColor(c);
}
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
setMeasuredDimension(CENTER_X * 2, CENTER_Y * 2);
}
private static final float PI = 3.1415926f;
@Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX() -CENTER_X;
float y = event.getY() -CENTER_Y;
// 判断触点是否在内圆的内部(通过触点与圆间的距离不大于于内圆半径)
boolean inCenter = Math.sqrt(x * x + y * y) <= CENTER_RADIUS;
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
mTrackingCenter = inCenter;
if (inCenter) {
mHeightLightCenter = true;
invalidate();
break;
}
case MotionEvent.ACTION_MOVE:
if (mTrackingCenter) {
if (mHeightLightCenter != inCenter) {
mHeightLightCenter = inCenter;
invalidate();
}
} else {
System.out.println("按下即使不动也会进入到这个方法!在这里设置画笔的颜色");
// 计算接触点至圆心的连线与X方向夹角的弧度
float angle = (float) Math.atan2(y, x);
// angle的取值范围为【-PI—,PI】,我们现在需要将该值转化为0-1的数
float unit = angle / (2 * PI);
if (unit < 0) {
// 将-1/2——0部分的值转化为1/2——1的值
unit += 1;
}
mCenterPaint.setColor(interpColor(mColors, unit));
invalidate();
}
break;
case MotionEvent.ACTION_UP:
if (mTrackingCenter) {
if (inCenter) {
//如果按下和松开时触点都位于小圆内部,则调用接口的方法,为接口的参数赋值
mColorChangedListener.colorChanged(mCenterPaint.getColor());
}
mTrackingCenter=false;
invalidate();
}
break;
}
return true;
}
// 根据触点的位置,计算当前位置的颜色值,根据差值计算法
private int interpColor(int[] colors, float unit) {
// 确保取得颜色的值
if (unit < 0) {
return colors[0];
}
if (unit >= 1) {
return colors[colors.length - 1];
}
// 计算触点映射到颜色数组中的相对位置
float p = (colors.length - 1) * unit;
// 取出相对位置的整数部分
int i = (int) p;
// 取出相对位置的小数部分
p -= i;
// 计算颜色的值,利用差值计算法
int c0 = colors[i];
int c1 = colors[i + 1];
int a = ave(Color.alpha(c0), Color.alpha(c1), p);
int r = ave(Color.red(c0), Color.red(c1), p);
int g = ave(Color.green(c0), Color.green(c1), p);
int b = ave(Color.blue(c0), Color.blue(c1), p);
return Color.argb(a, r, g, b);
}
private int ave(int s, int d, float p) {
return s + Math.round((d - s) * p);
}
}
public ColorPickerDialog(Context context,OnColorChangedListener listener,int initialColor) {
super(context);
mListener=listener;
mInitialColor=initialColor;
}
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
//实现接口
OnColorChangedListener l=new OnColorChangedListener() {
@Override
public void colorChanged(int color) {
//调用引用并创建该对话框的类中实现的该接口的方法
mListener.colorChanged(color);
dismiss();
}
};
setContentView(new ColorPickerView(getContext(), l, mInitialColor));
setTitle("Pick a Color");
}
}