系统通过提供的Cancas对象来提供绘图方法。它提供了各种绘图图像的API,如drawPoint(点)、drawLine(线)、drawRect(矩形)、drawVertices(多边形)、drawArc(弧)、drawCircle(圆),等等。通过他们的名字,我们就可以基本大致了解他们的功能。当然,Paint作为一个非常重要的元素,功能也是很强大的,这里简单地列举一些它的属性和对应的功能。
● setAntiAlias(); //设置画笔的锯齿效果
● setColor(); //设置画笔的颜色
● setARGB(); //设置画笔的A、R、G、B值
● setAlpha(); //设置画笔的Alpha值
● setTextSize(); //设置字体尺寸
● setStyle(); //设置画笔的锯风格(实心或者空心)
● setStrokeWidth(); //设置空心边框的宽度
正是由于画笔的功能不一样,再结合各种不同的API。这样任意组合就可以实现不同的绘图效果,比如同样是矩形,设置Paint的Style就可以画出空心或者实现的矩形。
如图(1)所示就是使用如下代码绘制出来的效果。
paint.setStyle(Paint.Style.STROKE);
同样的参数如果使用如下代码设置Paint的属性。那么绘制出来的效果就如图(2)所示。
paint.setStyle(Paint.Style.FILL);
(1)空心矩形 (2)实心矩形
上面我们初步了解了绘制不同的图形的基本方法,下面来重点看看Canvas家族的各个成员们。
● DrawPoint,绘制点,效果如图(3)所示。
canvas.drawPoint(x,y,paint);
● DrawLine,绘制直线,效果如图(4)所示。
canvas.drawLine(startX,startY,stopX,stopY,paint);
(3)绘制点 (4)绘制线
● DrawLines,绘制多条直线,效果如图(5)所示。
float[] pts = {startX1,startY1,stopX1,stopY1,
..........
startXn,startYn,stopXn,stopYn};
canvas.drawLines(pts,paint);
● DrawRect,绘制矩形,效果如图(6)所示。
canvas.drawRect(left,top,right,bottom,paint);
(5)绘制多条直线 (6)绘制矩形
● DrawRoundRect,绘制圆角矩形,效果如图(7)所示。
canvas.drawRoundRect(left,top,right,bottom,rx, ry,paint);
● DrawCircle,绘制圆,效果如图(8)所示。
canvas.drawCircle(cx,cy,radius,paint);
(7)绘制圆角矩形 (8)绘制圆
● DrawArc,绘制弧形,扇形。
paint.setStyle(Paint.Style.STROKE);
canvas.drawArc(left,top,right,bottom,startAngle, sweepAngle,useCenter,paint);
这里需要注意下,绘制弧形与扇形的区分就是倒数第二个参数useCenter的区别,如图(9)、(10)、(11)、(12)所示,即为使用不用的Paint.Style和useCenter属性产生的不同效果。
Paint.Style.STROKE+useCenter(true);
Paint.Style.STROKE+useCenter(false);
(9)绘制扇形 (10)绘制弧形
Paint.Style.FILL+useCenter(true);
Paint.Style.FILL+useCenter(false);
(11)绘制实现扇形 (12)绘制实心弧形
● DrawOval,绘制椭圆,效果如图(13)所示。
//通过椭圆的外接矩形来绘制椭圆
canvas.drawOval(left,top,right,bottom,paint);
● DarwText,绘制文本,效果如图(14)所示。
canvas.drawText(text,x,y,paint);
(13)绘制椭圆 (14)绘制文本
● DrawPosText,在指定位置绘制文本,效果如图(15)所示。
float pos[] ={X1,Y1,
X2,Y2,
......
Xn,Yn};
canvas.drawPosText(text,pos,paint);
● DrawPath,绘制路径,效果图如图(16)所示。
Path path =new Path();
path.moveTo(50,50);
path.lineTo(100,100);
path.lineTo(100,300);
path.lineTo(300,50);
canvas.drawPath(path,paint);
(15)指定位置绘制文本 (16)绘制路径