自定义View(2)canas绘制基本图形的示例
效果
代码：
1 void drawSample(Canvas canvas) { 2 /* 3 * 方法 说明 drawRect 绘制矩形 drawCircle 绘制圆形 drawOval 绘制椭圆 drawPath 绘制路径 4 * drawLine 绘制直线 drawPoin 绘制点 5 */ 6 // 创建画笔 7 Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG); 8 int txtSize = 24; 9 paint.setTextSize(txtSize); 10 /*画点*/ 11 paint.setStyle(Paint.Style.FILL); 12 canvas.drawText("画点：", 10, txtSize, paint); 13 paint.setColor(Color.RED); 14 float stroke = paint.getStrokeWidth(); 15 paint.setStrokeWidth(3); 16 canvas.drawPoint(100, 20, paint);// 画一个点 17 canvas.drawPoints(new float[] { 170, 20, 180, 20, 190, 20 }, paint);// 画多个点 18 paint.setStrokeWidth(stroke); 19 20 21 /*画线*/ 22 paint.setColor(Color.BLACK); 23 canvas.drawText("画线：", 10, 54, paint); 24 canvas.drawLine(110, 40, 200, 40, paint);// 画线 25 canvas.drawLine(210, 40, 400, 55, paint);// 斜线 26 27 /*画虚线*/ 28 canvas.drawText("画虚线：", 10,84, paint); 29 paint.setStyle(Paint.Style.STROKE); 30 Path path3 = new Path(); 31 path3.moveTo(110, 84); 32 path3.lineTo(400,84); 33 /*DashPathEffect第一个参数必须为偶数个整数，其中偶数位上的整数表示绘制的间隔，奇数位上的整数表示不绘制的间隔。*/ 34 PathEffect effects = new DashPathEffect(new float[]{5,30,5,30,5,30},1); 35 PathEffect oldEffect = paint.getPathEffect(); 36 paint.setPathEffect(effects); 37 canvas.drawPath(path3, paint); 38 39 /*画弧线*/ 40 paint.setPathEffect(oldEffect); 41 canvas.drawText("画弧线：", 10, 124, paint); 42 43 RectF oval1 = new RectF(170, 114, 190, 134); // 弧线是画在矩形中的 44 canvas.drawArc(oval1, 180, 180, false, paint); // 左眼弧线 ^_^ 45 46 oval1.set(230, 114, 250, 134); 47 canvas.drawArc(oval1, 180, 180, false, paint); // 右眼弧线 ^_^ 48 49 oval1.set(190, 124, 230, 134); 50 canvas.drawArc(oval1, 0, 180, false, paint); // 嘴弧线 ^_^ 51 52 /*画贝塞尔曲线*/ 53 /* Path类封装复合(多轮廓几何图形的路径 54 * 由直线段*、二次曲线,和三次方曲线，也可画以油画。drawPath(路径、油漆),要么已填充的或抚摸 55 * (基于油漆的风格),或者可以用于剪断或画画的文本在路径。 56 */ 57 canvas.drawText("画贝塞尔曲线:", 10, 174, paint); 58 Path path2 = new Path(); 59 path2.moveTo(170, 174); // 设置Path的起点 60 path2.quadTo(400, 120, 450, 600); // 设置贝塞尔曲线的控制点坐标和终点坐标 61 canvas.drawPath(path2, paint); // 画出贝塞尔曲线 62 63 /*画圆*/ 64 canvas.drawText("画圆：", 10, 214, paint); // 画文本 65 canvas.drawCircle(150, 204, 10, paint); // 小圆 66 paint.setAntiAlias(true); // 设置画笔的锯齿效果。true是去除 67 canvas.drawCircle(200, 204, 20, paint); // 大圆 68 69 /*画扇形和椭圆*/ 70 canvas.drawText("画扇形和椭圆:", 10, 274, paint); 71 /*设置渐变色 这个正方形的颜色是改变的 */ 72 Shader mShader = new LinearGradient(0, 0, 200, 244, 73 new int[] { Color.RED, Color.GREEN, Color.BLUE, Color.YELLOW, 74 Color.LTGRAY }, null, Shader.TileMode.REPEAT); // 一个材质,打造出一个线性梯度沿著一条线。 75 paint.setShader(mShader); 76 // p.setColor(Color.BLUE); 77 78 // 画扇形，drawArc第一个参数是RectF：该类是第二个参数是角度的开始，第三个参数是多少度，第四个参数是真的时候画扇形，是假的时候画弧线 79 RectF oval2 = new RectF(170, 244, 250, 320);// 设置个新的长方形，扫描测量 80 canvas.drawArc(oval2, 200, 130, true, paint); 81 82 // 画椭圆，把oval改一下 83 oval2.set(250, 244,320,274); 84 canvas.drawOval(oval2, paint); 85 86 /*画矩形*/ 87 canvas.drawText("画矩形：", 10, 320, paint); 88 paint.setStyle(Paint.Style.FILL);// 设置填满 89 canvas.drawRect(150, 300, 170, 320, paint);// 正方形 90 canvas.drawRect(180, 300, 250, 320, paint);// 长方形 91 92 /*画圆角矩形*/ 93 canvas.drawText("画圆角矩形:", 10, 360, paint); 94 paint.setStyle(Paint.Style.FILL);// 充满 95 paint.setColor(Color.LTGRAY); 96 paint.setAntiAlias(true);// 设置画笔的锯齿效果 97 RectF oval3 = new RectF(160, 330, 300, 360);// 设置个新的长方形 98 canvas.drawRoundRect(oval3, 20, 15, paint);// 第二个参数是x半径，第三个参数是y半径 99 100 /*画三角形*/ 101 canvas.drawText("画三角形：", 10, 400, paint); 102 // 绘制这个三角形,你可以绘制任意多边形 103 Path path = new Path(); 104 path.moveTo(160, 380);// 此点为多边形的起点 105 path.lineTo(300, 380); 106 path.lineTo(200, 430); 107 // path.lineTo(160, 380); 108 path.close(); // 使这些点构成封闭的多边形，就不用画回到起点 path.lineTo(160, 380); 109 canvas.drawPath(path, paint); 110 111 /*画任意多边形，*/ 112 paint.setShader(null); 113 canvas.drawText("画任意多边形：", 10, 460, paint); 114 paint.setColor(Color.LTGRAY); 115 paint.setStyle(Paint.Style.STROKE);// 设置空心 116 Path path1 = new Path(); 117 path1.moveTo(180, 450); 118 path1.lineTo(300, 450); 119 path1.lineTo(310, 460); 120 path1.lineTo(180, 470); 121 path1.close(); // 封闭形状 122 canvas.drawPath(path1, paint); 123 124 /*画图片，就是贴图*/ 125 canvas.drawText("画图片：", 10, 520, paint); 126 Bitmap bitmap = BitmapFactory.decodeResource(getResources(),R.drawable.ic_launcher); 127 canvas.drawBitmap(bitmap, 150, 460, paint); 128 129 /*画文本*/ 130 paint.setColor(Color.BLACK); 131 canvas.drawText("画文本：", 10, 670, paint); 132 paint.setTextSize(txtSize * 3); 133 paint.setStyle(Paint.Style.FILL); 134 135 FontMetrics fontMetrics = paint.getFontMetrics(); 136 float originX = 200; 137 float originY = 700; 138 float topY = originY + fontMetrics.top; 139 float ascentY = originY + fontMetrics.ascent; 140 float descentY = originY + fontMetrics.descent; 141 float bottomY = originY + fontMetrics.bottom; 142 float leading = fontMetrics.leading; 143 144 //文本 145 paint.setColor(Color.RED); 146 paint.setTextAlign(Align.CENTER); 147 canvas.drawText("text1", originX , originY, paint); 148 149 //origin point 150 canvas.drawCircle(originX, originY, 5, paint); 151 paint.setTextAlign(Align.LEFT); 152 153 //baseline 154 paint.setColor(Color.LTGRAY); 155 paint.setTextSize(txtSize); 156 canvas.drawText("baseline", originX - 100 , originY, paint); 157 canvas.drawLine(originX, originY, originX + 140, originY, paint); 158 159 //top line 160 paint.setColor(Color.GREEN); 161 canvas.drawText("topline", originX - 80, topY, paint); 162 canvas.drawLine(originX, topY, originX + 100, topY, paint); 163 164 //ascent line 165 paint.setColor(Color.CYAN); 166 canvas.drawText("ascent line", originX + 155, ascentY, paint); 167 canvas.drawLine(originX+50, ascentY, originX + 150, ascentY, paint); 168 169 //descent line 170 paint.setColor(Color.YELLOW); 171 canvas.drawText("descent line", originX + 140, descentY, paint); 172 canvas.drawLine(originX+30, descentY, originX + 139, descentY, paint); 173 174 //bottom line 175 paint.setColor(Color.BLUE); 176 canvas.drawText("bottom line", originX - 155, descentY, paint); 177 canvas.drawLine(originX-30, bottomY, originX + 110, bottomY, paint); 178 }
注意其中画弧形时要指定一个矩形区域，画文字时各种线的位置
