Android使用Canvas绘制2D图形基础

时间：2023-02-06 21:41:54

这几天看了徐医生的《Android群英传》，里面叙述了一些Android自定义组件以及一些绘图技巧，先总结了一下使用Canvas绘图的几种情况。

对于Android绘图：Paint就是画笔，Canvas是画布。Canvas提供了各种绘制图像的API，可以绘制点、线条、圆、矩形、椭圆等。Paint可以设置画笔的特性。

简单列举Paint的方法：

setAntiAlias()：设置画笔的锯齿效果

setColor()：设置画笔的颜色

setARGB()：设置画笔的A，R，G，B值（A是透明度，R，G，B是三原色，四个值都在0-255）

setAlpha()：设置画笔的Alpha值

setTextSize()：设置字体的尺寸

setStyle()：设置画笔的风格（实心或空心）

setStrokeWidth()：设置空心边框的宽度


下面记录一下绘制各种图形的代码：

绘制坐标系以及测试drawARGB：绘制坐标系其实就是绘制两条线条

/* 获取组件属性 
* android:layout_width=""
* android:layout_height="
* 传过来的值
*/
int canvasWidth = canvas.getWidth();
        int canvasHeight = canvas.getHeight();
        paint.setStyle(Paint.Style.STROKE);
        //设置坐标轴的顶端是圆弧还是直角的
        paint.setStrokeCap(Paint.Cap.SQUARE);
        //设置画笔粗细
        paint.setStrokeWidth(6 * density);

        //第一个参数是透明度，后面三个参数是合成颜色的三元素
        //drawARGB绘制了界面的背景颜色以及透明度
        canvas.drawARGB(255, 154, 155, 156);

        //第一次绘制坐标轴
        paint.setColor(getResources().getColor(android.R.color.holo_blue_bright));//绿色
        canvas.drawLine(0, 0, canvasWidth, 0, paint);//绘制x轴
        paint.setColor(getResources().getColor(android.R.color.holo_green_dark));//蓝色
        canvas.drawLine(0, 0, 0, canvasHeight, paint);//绘制y轴

        //对坐标系平移后，第二次绘制坐标轴
        canvas.translate(canvasWidth / 4, canvasWidth /4);//把坐标系向右下角平移
        paint.setColor(getResources().getColor(android.R.color.holo_blue_bright));//绿色
        canvas.drawLine(0, 0, canvasWidth, 0, paint);//绘制x轴
        paint.setColor(getResources().getColor(android.R.color.holo_green_dark));//蓝色
        canvas.drawLine(0, 0, 0, canvasHeight, paint);//绘制y轴

        //再次平移坐标系并在此基础上旋转坐标系，第三次绘制坐标轴
        canvas.translate(canvasWidth / 4, canvasWidth / 4);//在上次平移的基础上再把坐标系向右下角平移
        canvas.rotate(30);//基于当前绘图坐标系的原点旋转坐标系
        paint.setColor(getResources().getColor(android.R.color.holo_blue_bright));//绿色
        canvas.drawLine(0, 0, canvasWidth, 0, paint);//绘制x轴
        paint.setColor(getResources().getColor(android.R.color.holo_green_dark));//蓝色
        canvas.drawLine(0, 0, 0, canvasHeight, paint);//绘制y轴

绘制文字drawText：

int translateY = width / 2;
float textSize = width / 4;


//设置画笔颜色
paint.setColor(getResources().getColor(android.R.color.holo_green_dark));
paint.setTextSize(textSize);
//设置文字偏移
canvas.translate(0, translateY);
canvas.drawText("普通文本", 0, 0, paint);
canvas.restore();

//设置文本左对齐，这里还可以设置居中对齐，右对齐
paint.setTextAlign(Paint.Align.LEFT);
canvas.translate(textSize, translateY * 2);
canvas.drawText("左对齐文本", 0, 0, paint);
canvas.restore();

//设置下划线
paint.setUnderlineText(true);
canvas.translate(0, translateY * 2);
canvas.drawText("下划线文本", 0, 0, paint);
canvas.restore();

paint.setUnderlineText(false);

paint.setFakeBoldText(true);
canvas.translate(0, translateY * 2);
//顺时针旋转20度
canvas.rotate(20);
canvas.drawText("加粗文本", 0, 0, paint);
canvas.restore();

绘制点：

canvas.drawPoint(x,y, paint);

绘制线：

canvas.drawLine(width / 4, height / 4, width, height / 8, paint);  //绘制一条线

//绘制多条线
float[] pts = {
                50,50,100,180,
                100,180,400,350,
                400,350,500,550
        };
        canvas.drawLines(pts, paint);


绘制矩形：

canvas.drawRect(50, 50, width / 3, height / 3, paint);

绘制圆： 

//前两个参数是圆心的坐标，第三个参数是圆的半径
canvas.drawCircle(width / 2, height / 8, height / 10, paint);

绘制椭圆：原理是在一个矩形里面绘制椭圆 

//四个参数分别是矩形左上右下四个边距离坐标轴的距离
RectF oval = new RectF(100, 100, 400, 300);
canvas.drawOval(oval, paint);

绘制圆弧： 

//四个参数分别是矩形左上右下四个边距离坐标轴的距离

RectF oval1 = new RectF(50, 470, 500, 600);
//60是圆弧的度数
canvas.drawArc(oval1, 0, 60, true, paint);


绘制路径：

Path path = new Path();
path.moveTo(50,50);
path.lineTo(100,100);
path.lineTo(100,300);
path.lineTo(300,50);
canvas.drawPath(path,paint);

指定位置绘制文本: 

float[] pos = {
50,50,
100,100,
150,150,
200,200,
250,250
};
paint.setTextSize(50);
canvas.drawPosText("hello", pos, paint);





资源下载：http://download.csdn.net/detail/fancheng614/9919460

标签：

相关文章