本文是在CrazyAndroid上摘抄下来的,囊括了Cavas,Paint,Path,Shader的各种用法,对于初学Android绘图的同学(比如我)来说,还是很有用处的
public class MyView extends View {
public MyView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
public MyView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public MyView(Context context) {
super(context);
}
/**
* 重写该方法,进行绘图
*/
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
// 把整张画布绘制成白色
canvas.drawColor(Color.WHITE);
Paint paint = new Paint();
// 去锯齿
paint.setAntiAlias(true);
paint.setColor(Color.BLUE);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(4);
int viewWidth = this.getWidth();
// 绘制圆形
canvas.drawCircle(viewWidth / 10 + 10, viewWidth / 10 + 10, viewWidth / 10, paint);
// 绘制正方形
canvas.drawRect(10, viewWidth / 5 + 20, viewWidth / 5 + 10, viewWidth * 2 / 5 + 20, paint);
// 绘制矩形
canvas.drawRect(10, viewWidth * 2 / 5 + 30, viewWidth / 5 + 10, viewWidth / 2 + 30, paint);
// 绘制圆角矩形
RectF rel = new RectF(10, viewWidth / 2 + 40, 10 + viewWidth / 5, viewWidth * 3 / 5 + 40);
canvas.drawRoundRect(rel, 15, 15, paint);
// 绘制椭圆
RectF rel1 = new RectF(10, viewWidth * 3 / 5 + 50, 10 + viewWidth / 5, viewWidth * 7 / 10 + 50);
canvas.drawOval(rel1, paint);
// 定义一个Path对象,封闭成一个三角形
Path path1 = new Path();
path1.moveTo(10, viewWidth * 9 / 10 + 60);
path1.lineTo(viewWidth / 5 + 10, viewWidth * 9 / 10 + 60);
path1.lineTo(viewWidth / 10 + 10, viewWidth * 7 / 10 + 60);
path1.close();
// 根据Path进行绘制,绘制三角形
canvas.drawPath(path1, paint);
// 定义一个Path对象,封闭层一个五角星
Path path2 = new Path();
path2.moveTo(10 + viewWidth / 15, viewWidth * 9 / 10 + 70);
path2.lineTo(10 + viewWidth * 2 / 15, viewWidth * 9 / 10 + 70);
path2.lineTo(10 + viewWidth / 5, viewWidth + 70);
path2.lineTo(10 + viewWidth / 10, viewWidth * 11 / 10 + 70);
path2.lineTo(10, viewWidth + 70);
path2.close();
// 根据Path对象,绘制五角星
canvas.drawPath(path2, paint);
// -----------设置填充风格后绘制----------------
paint.setStyle(Paint.Style.FILL);
paint.setColor(Color.RED);
// 绘制圆形
canvas.drawCircle(viewWidth * 3 / 10 + 20, viewWidth / 10 + 10, viewWidth / 10, paint);
// 绘制正方形
canvas.drawRect(viewWidth / 5 + 20, viewWidth / 5 + 20, viewWidth * 2 / 5 + 20, viewWidth * 2 / 5 + 20, paint);
// 绘制矩形
canvas.drawRect(viewWidth / 5 + 20, viewWidth * 2 / 5 + 30, viewWidth * 2 / 5 + 20, viewWidth / 2 + 30, paint);
// 绘制圆角矩形
RectF rel2 = new RectF(viewWidth / 5 + 20, viewWidth / 2 + 40, 20 + viewWidth * 2 / 5, viewWidth * 3 / 5 + 40);
canvas.drawRoundRect(rel2, 15, 15, paint);
// 绘制椭圆
RectF rel3 = new RectF(20 + viewWidth / 5, viewWidth * 3 / 5 + 50, 20 + viewWidth * 2 / 5, viewWidth * 7 / 10 + 50);
canvas.drawOval(rel3, paint);
// 定义一个Path对象,封闭成三角形
Path path3 = new Path();
path3.moveTo(20 + viewWidth / 5, viewWidth * 9 / 10 + 60);
path3.lineTo(viewWidth * 2 / 5 + 20, viewWidth * 9 / 10 + 60);
path3.lineTo(viewWidth * 3 / 10 + 20, viewWidth * 7 / 10 + 60);
path3.close();
// 根据Path进行绘制,绘制一个三角形
canvas.drawPath(path3, paint);
// 定义一个Path对象,封闭成一个五角星
Path path4 = new Path();
path4.moveTo(20 + viewWidth * 4 / 15, viewWidth * 9 / 10 + 70);
path4.lineTo(20 + viewWidth / 3, viewWidth * 9 / 10 + 70);
path4.lineTo(20 + viewWidth * 2 / 5, viewWidth + 70);
path4.lineTo(20 + viewWidth * 3 / 10, viewWidth * 11 / 10 + 70);
path4.lineTo(20 + viewWidth / 5, viewWidth + 70);
path4.close();
// 根据Path进行绘制,绘制五角星
canvas.drawPath(path4, paint);
// -----------设置渐变器后绘制---------------
// 为Paint设置渐变器
Shader mShader = new LinearGradient(0, 0, 40, 60, new int[] { Color.RED, Color.GREEN, Color.BLUE, Color.YELLOW }, null,
Shader.TileMode.REPEAT);
paint.setShader(mShader);
// 设置阴影
paint.setShadowLayer(25, 20, 20, Color.GRAY);
// 绘制圆形
canvas.drawCircle(viewWidth / 2 + 30, viewWidth / 10 + 10, viewWidth / 10, paint);
// 绘制正方形
canvas.drawRect(viewWidth * 2 / 5 + 30, viewWidth / 5 + 20, viewWidth * 3 / 5 + 30, viewWidth * 2 / 5 + 20, paint);
// 绘制矩形
canvas.drawRect(viewWidth * 2 / 5 + 30, viewWidth * 2 / 5 + 30, viewWidth * 3 / 5 + 30, viewWidth / 2 + 30, paint);
// 绘制圆角矩形
RectF rel4 = new RectF(viewWidth * 2 / 5 + 30, viewWidth / 2 + 40, 30 + viewWidth * 3 / 5, viewWidth * 3 / 5 + 40);
canvas.drawRoundRect(rel4, 15, 15, paint);
// 绘制椭圆
RectF rel5 = new RectF(30 + viewWidth * 2 / 5, viewWidth * 3 / 5 + 50, 30 + viewWidth * 3 / 5, viewWidth * 7 / 10 + 50);
canvas.drawOval(rel5, paint);
// 定义一个Path对象,封闭成三角形
Path path5 = new Path();
path5.moveTo(30 + viewWidth * 2 / 5, viewWidth * 9 / 10 + 60);
path5.lineTo(viewWidth * 3 / 5 + 30, viewWidth * 9 / 10 + 60);
path5.lineTo(viewWidth / 2 + 30, viewWidth * 7 / 10 + 60);
path5.close();
// 根据Path进行绘制,绘制一个三角形
canvas.drawPath(path5, paint);
// 定义一个Path对象,封闭成一个五角星
Path path6 = new Path();
path6.moveTo(30 + viewWidth * 7 / 15, viewWidth * 9 / 10 + 70);
path6.lineTo(30 + viewWidth * 8 / 15, viewWidth * 9 / 10 + 70);
path6.lineTo(30 + viewWidth * 3 / 5, viewWidth + 70);
path6.lineTo(30 + viewWidth / 2, viewWidth * 11 / 10 + 70);
path6.lineTo(30 + viewWidth * 2 / 5, viewWidth + 70);
path6.close();
// 根据Path进行绘制,绘制五角星
canvas.drawPath(path6, paint);
// --------------设置字符大小后绘制-------------
paint.setTextSize(48);
// 绘制7个字符串
canvas.drawText("圆形", 60 + viewWidth * 3 / 5, viewWidth / 10 + 10, paint);
canvas.drawText("正方形", 60 + viewWidth * 3 / 5, viewWidth * 3 / 10 + 10 + 20, paint);
canvas.drawText("长方形", 60 + viewWidth * 3 / 5, viewWidth * 1 / 2 + 20, paint);
canvas.drawText("圆角矩形", 60 + viewWidth * 3 / 5, viewWidth * 3 / 5 + 30, paint);
paint.setShader(null);
canvas.drawText("椭圆形", 60 + viewWidth * 3 / 5, viewWidth * 7 / 10 + 30, paint);
canvas.drawText("三角形", 60 + viewWidth * 3 / 5, viewWidth * 9 / 10 + 30, paint);
canvas.drawText("五角形", 60 + viewWidth * 3 / 5, viewWidth * 11 / 10 + 30, paint);
}
}
这是一个View,使用时只需要在xml文件里,使用即可,使用效果如图所示
从左往右分别是普通绘制、带颜色的绘制、渐变色绘制和颜色绘制
从上往下分别是圆形、正方形、长方形、椭圆形、三角形、五角形
分别用到了基础的Canvas和Paint
三角和五角用到了Path
渐变用到了Shader
希望能有帮助