Android中图形与图像处理初见面——绘图
来源:互联网 发布:宁波新房成交最新数据 编辑:程序博客网 时间:2024/06/06 02:32
第一次见到Android绘图就发现其无非就是Canvas和Paint,也就是画布,和画笔,其中Canvas还用到了Path,Path代表任意多条直线链接而成的任意图形。
以下为在应用程序中绘制几何图形,关键在于一个自定义的view组件MyView,话不多说,直接上代码:
package com.cbg.canvastest;import android.content.Context;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.LinearGradient;import android.graphics.Paint;import android.graphics.Path;import android.graphics.RectF;import android.graphics.Shader;import android.util.AttributeSet;import android.view.View;public class MyView extends View {public MyView(Context context, AttributeSet attrs) {super(context, attrs);}// 重写一个方法onDraw@Overrideprotected 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(3);//绘制圆形,在指定点画圆形,在(40,40)画半径为30的圆canvas.drawCircle(40, 40, 30, paint);// 绘制正方形,前两个代表左上角的坐标,后两个代表右下角的坐标canvas.drawRect(10, 80, 70, 140, paint);// 绘制矩形 canvas.drawRect(10, 150, 170, 190, paint);// 设置个新的长方形,扫描测量 RectF re1 = new RectF(10, 200, 70, 230);// 绘制圆角矩形canvas.drawRoundRect(re1, 15, 15, paint);//设置圆角RectF re1l = new RectF(10, 240, 70, 270);// 绘制椭圆canvas.drawOval(re1l, paint);// 定义一个path对象,封闭成一个三角形Path path1 = new Path();path1.moveTo(10, 340);// 此点为多边形的起点path1.lineTo(70, 340);path1.lineTo(40, 290);path1.close();// 使这些点构成封闭的多边形 // 根据path进行绘制,绘制三角形canvas.drawPath(path1, paint);// 定义一个path封成五角星Path path2 = new Path();path2.moveTo(26, 360);path2.lineTo(54, 360);path2.lineTo(70, 392);path2.lineTo(40, 420);path2.lineTo(10, 392);path2.close();// 根据path进行绘制,绘制五角星canvas.drawPath(path2, paint);// 设置填充风格后绘制paint.setStyle(Paint.Style.FILL);//笔画为填充满paint.setColor(Color.RED);//画笔设置为红色canvas.drawCircle(120, 40, 30, paint);// 绘制正方形canvas.drawRect(90, 80, 70, 140, paint);// 绘制矩形canvas.drawRect(90, 150, 150, 190, paint);RectF re2 = new RectF(90, 200, 150, 230);// 绘制圆角矩形canvas.drawRoundRect(re2, 15, 15, paint);RectF re2l = new RectF(90, 240, 150, 270);// 绘制椭圆canvas.drawOval(re2l, paint);// 定义一个path对象,封闭成一个三角形Path path3 = new Path();path3.moveTo(90, 340);path3.lineTo(150, 340);path3.lineTo(120, 290);path3.close();// 根据path进行绘制,绘制三角形canvas.drawPath(path1, paint);// 定义一个path封成五角星Path path4 = new Path();path4.moveTo(106, 360);path4.lineTo(134, 360);path4.lineTo(150, 392);path4.lineTo(120, 420);path4.lineTo(90, 392);path4.close();// 绘制五角形canvas.drawPath(path4, paint);// 为paint设置渐变器Shader mShader = new LinearGradient(0, 0, 40, 60, new int[] {Color.RED, Color.GREEN, Color.BLUE }, null,Shader.TileMode.REPEAT);paint.setShader(mShader);paint.setShadowLayer(45, 10, 10, Color.GRAY);// 绘制圆形canvas.drawCircle(200, 40, 30, paint);// 绘制正方形canvas.drawRect(170, 80, 230, 140, paint);// 绘制矩形canvas.drawRect(170, 150, 230, 190, paint);RectF re3 = new RectF(170, 200, 230, 230);// 绘制圆角矩形canvas.drawRoundRect(re3, 15, 15, paint);RectF re3l = new RectF(170, 240, 230, 270);// 绘制椭圆canvas.drawOval(re3l, paint);// 定义一个path对象,封闭成一个三角形Path path5 = new Path();path5.moveTo(170, 340);path5.lineTo(230, 340);path5.lineTo(200, 290);path5.close();// 根据path进行绘制,绘制三角形canvas.drawPath(path1, paint);// 定义一个path封成五角星Path path6 = new Path();path6.moveTo(186, 360);path6.lineTo(214, 360);path6.lineTo(230, 392);path6.lineTo(200, 420);path6.lineTo(170, 392);path6.close();// 根据path进行绘制,绘制五角星canvas.drawPath(path6, paint);paint.setTextSize(24);paint.setShader(null);canvas.drawText("圆形", 240, 50, paint);canvas.drawText("正方形", 240, 120, paint);canvas.drawText("长方形", 240, 175, paint);canvas.drawText("圆角矩形", 230, 220, paint);canvas.drawText("椭圆形", 240, 260, paint);canvas.drawText("三角形", 240, 325, paint);canvas.drawText("五角形", 240, 390, paint);}}运行结果:
关于其他属性我收集了一些:
1、Path对象
在代码中我们看到了我们新建了一个Paint画笔对象,对于画笔对象,它有很多设置属性的:
void setARGB(int a, int r, int g, int b) 设置Paint对象颜色,参数一为alpha透明通道
void setAlpha(int a) 设置alpha不透明度,范围为0~255
void setAntiAlias(boolean aa) //是否抗锯齿,默认值是false
void setColor(int color) //设置颜色,这里Android内部定义的有Color类包含了一些常见颜色定义
void setFakeBoldText(boolean fakeBoldText) //设置伪粗体文本
void setLinearText(boolean linearText) //设置线性文本
PathEffect setPathEffect(PathEffect effect) //设置路径效果
Rasterizer setRasterizer(Rasterizer rasterizer) //设置光栅化
Shader setShader(Shader shader) //设置阴影 ,我们在后面会详细说一下Shader对象的
void setTextAlign(Paint.Align align) //设置文本对齐
void setTextScaleX(float scaleX) //设置文本缩放倍数,1.0f为原始
void setTextSize(float textSize) //设置字体大小
Typeface setTypeface(Typeface typeface) //设置字体,Typeface包含了字体的类型,粗细,还有倾斜、颜色等
注:
Paint mp = new paint();
mp.setTypeface(Typeface.DEFAULT_BOLD)
常用的字体类型名称还有:
Typeface.DEFAULT //常规字体类型
Typeface.DEFAULT_BOLD //黑体字体类型
Typeface.MONOSPACE //等宽字体类型
Typeface.SANS_SERIF //sans serif字体类型
Typeface.SERIF //serif字体类型
除了字体类型设置之外,还可以为字体类型设置字体风格,如设置粗体:
Paint mp = new Paint();
Typeface font = Typeface.create(Typeface.SANS_SERIF, Typeface.BOLD);
p.setTypeface( font );
常用的字体风格名称还有:
Typeface.BOLD //粗体
Typeface.BOLD_ITALIC //粗斜体
Typeface.ITALIC //斜体
Typeface.NORMAL //常规
void setUnderlineText(boolean underlineText) //设置下划线
void setStyle(Style style) //设置画笔样式
注:
常用的样式
Paint.Style.FILL
Paint.Style.STROKE
Paint.Style.FILL_AND_STROKE
这里的FILL和STROKE两种方式用的最多,他们的区别也很好理解的,FILL就是填充的意思,STROKE就是空心的意思,只有图形的轮廓形状,内部是空的。
void setStrokeWidth(float width) //在画笔的样式为STROKE的时候,图形的轮廓宽度
2、Canvas对象
对于画布对象Canvas我们是从onDraw方法中获取到的,所以这里我们就可以看不来了,我们在自定义视图的时候都会继承View类,然后在他的onDraw方法中拿到Canvas对象,进行各种绘制了。下面就来一一看一下各种绘制的方法吧:
首先来看一下如何创建一个画笔对象:
- Paint p = new Paint();
- p.setColor(Color.RED);// 设置红色
1)、画圆(drawCircle)
我们想一下,如果画出一个圆形的话需要哪些要素,学过几何的同学都知道:圆形坐标+半径 就可以确定一个圆形了
- canvas.drawCircle(120, 20, 20, p);
参数二:圆心的y坐标
参数三:圆的半径
参数四:画笔对象
还有一个这里我们设置了画笔是否有锯齿:
- p.setAntiAlias(true);// 设置画笔的锯齿效果。 true是去除,大家一看效果就明白了
2)、画直线(drawLine)
我们想一下,如果画出一个直线的话需要哪些要素,起始点坐标+终点坐标 就可以确定一条直线了
- canvas.drawLine(60, 40, 100, 40, p);// 画线
参数二:起始点的y坐标
参数三:终点的x坐标
参数四:终点的y坐标
参数五:画笔对象
3)、画椭圆(drawOval)
我们想一下,如果画出椭圆的话需要哪些要素,长轴+短轴的长度
- RectF oval1=new RectF(150,20,180,40);
- canvas.drawOval(oval2, p);
参数一:椭圆的外接矩形
参数二:画笔对象
这里先来说一下RectF的相关知识吧:在绘图中这个对象是十分重要的,它表示的是一个矩形,它有四个参数:
left,top,right,bottom
这四个值是相对于设备屏幕的起始点开始的。
- RectF oval1=new RectF(150,20,180,40);
矩形的左上角的坐标是:(150,20)
矩形的右下角的坐标是:(180,30)
那么我们就知道这个矩形的宽是:180-150=30;高是:40-20=20
其实还有与RectF对象对应的还有一个对象:Rect,它也是四个参数,和RectF唯一的区别就是,Rect中的参数是float类型的,RectF中的参数是int类型的
那么一个矩形就可以确定一个椭圆的,这个矩形就是和这个椭圆外接:
那么椭圆的长轴就是矩形的宽,短轴就是矩形的高
这样就可以确定一个椭圆了,那么如果我们想画一个圆形的话用这种方式也是可以的,只要把RectF设置成正方形就可以了。
4)、画弧线/画扇形(drawArc)
我们想一下,如果画出一个弧线的话需要哪些要素,起始的弧度+弧线的弧度+外围的矩形大小
这个和上面画椭圆很相似的,就相当于在他的基础上多了其实弧度+弧线的弧度
- p.setStyle(Paint.Style.STROKE);//设置空心
- RectF oval1=new RectF(150,20,180,40);
- canvas.drawArc(oval1, 180, 180, false, p);//小弧形
参数一:外接弧形的矩形
参数二:弧线开始的弧度
参数三:弧线的弧度
参数四:是一个boolean类型的参数:true的时候画扇形,是false的时候画弧线
参数五:画笔对象
5)、画矩形(drawRect)
- RectF oval1=new RectF(150,20,180,40);
- canvas.drawRect(oval1, p);
参数二:画笔对象
6)、画圆角矩形(drawRoundRect)
- RectF oval3 = new RectF(80, 260, 200, 300);// 设置个新的长方形
- canvas.drawRoundRect(oval3, 20, 15, p);//第二个参数是x半径,第三个参数是y半径
参数二:圆角的x半径(椭圆的长轴的一半)
参数三:圆角的y半径(椭圆的短轴的一半)
参数四:画笔对象
其实这个和正常的矩形不一样的是:在四个角是有弧度的,那么弧度的话,就会想到椭圆了,我们在上面说道椭圆的几个要素:长轴和短轴,那么这里就是取长轴的一半和短轴的一半。
7)、画三角形/多边形(drawPath)
我们想一下,如果绘制三角形/多边形的话需要哪些要素,能确定多边形的形状最重要的因素就是角,那么这些角就是一个坐标
- Path path = new Path();
- path.moveTo(80, 200);// 此点为多边形的起点
- path.lineTo(120, 250);
- path.lineTo(80, 250);
- path.close(); // 使这些点构成封闭的多边形
- canvas.drawPath(path, p);
参数一:x坐标
参数二:y坐标
路径是多个点相连接的。所以Path提供了两个方法:moveTo和lineTo
moveTo方法的作用是设置我们绘制路径的开始点,如果没有这个方法的调用的话,系统默认的开始点是(0,0)点
lineTo方法就是将路径的上一个坐标点和当前坐标点进行连接,或者可以认为设置多边形的每个角的坐标点
那么对于三角形的话,我们需要三个点即可。
这个画三角形其实我们用上面的画直线的方法也可以实现的,反过来也是,我们用Path对象也是可以画出一条直线的,那么他们的本质区别是:
绘制路径方式的焦点是角(坐标点)
绘制直线的方式的焦点是边(长度)
8)、画点(drawPoint)
- canvas.drawPoint(60, 390, p);//画一个点
- canvas.drawPoints(new float[]{60,400,65,400,70,400}, p);//画多个点
drawPoint
参数一:点的x坐标
参数二:点的y坐标
参数三:画笔对象
drawPoints
参数一:多个点的数组
参数二:画笔对象
9)、画贝塞尔曲线(drawPath)
这种曲线其实我们在开发过程中很少用到,不过在图形学中绘制贝塞尔曲线的时候,我们需要的要素是:起始点+控制点+终点
- Path path2=new Path();
- path2.moveTo(100, 320);//设置Path的起点
- path2.quadTo(150, 310, 170, 400); //设置贝塞尔曲线的控制点坐标和终点坐标
- canvas.drawPath(path2, p);//画出贝塞尔曲线
参数一:控制点的x坐标
参数二:控制点的y坐标
参数三:终点的x坐标
参数四:终点的y坐标
这里需要注意的是,调用moveTo方法来确定开始坐标的,如果没有调用这个方法,那么起始点坐标默认是:(0,0)
10)、绘制图片(drawBitmap)
- //画图片,就是贴图
- Bitmap bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ic_launcher);
- canvas.drawBitmap(bitmap, 250,360, p);
参数二:图片相对于设备屏幕的left值
参数二:图片相对于设备屏幕的top值
其实我们可以把图片认为是一个矩形,因为图片本身是有长度和宽度的,所以这里只需要矩形的左上角的坐标点,就可以确定这张图片在屏幕中的位置了。
- Android中图形与图像处理初见面——绘图
- Android绘图机制与处理技巧(三)——Android图像处理之图形特效处理
- Android绘图机制与处理技巧(四)Android图像处理之图形特效处理
- Android学习笔记——图形与图像处理
- Android的图形与图像处理之一 使用简单图片&绘图
- matlab绘图与图像处理(三维图形)
- Android绘图机制与处理技巧(二)——Android图像处理之色彩特效处理
- Android绘图机制与处理技巧(四)——Android图像处理之画笔特效处理
- Android学习16--图形与图像处理
- 读书笔记--Android图形与图像处理
- Android的图形与图像处理
- MATLAB绘图与图形处理
- 图形与图像处理
- 图形与图像处理
- 图形与图像处理
- 图形与图像处理
- **ANDROID**图形与图像处理(动态处理)
- 图形与图像的处理
- HDU1015Safecracker——水题
- Fiddler简介
- eclipse 加载tomcat7的问题,对于低版本也适用。
- Android 一个简单的计算器APP
- Android 自定义Dialog 实现类似ios7 UIAlertView
- Android中图形与图像处理初见面——绘图
- viewpager实现欢迎界面
- JavaWeb——HTTP协议头部分析
- 在对象中使用定时器
- 第十篇:new方法原理及注意点
- 富兰克林的修炼经验推荐给大家
- 网页抽取技术和算法
- 10^n个整数(亿级)的排序
- windows安装retext