android 自定义view绘制,Android 自定义View Canvas绘制几何图形基础

项目需求：本项目中为自己的毕设项目，其中有一个模块需要通过APP进行码垛设计，并将码垛的结果发送给机械手的控制器。该模块的需求具体如下：1. 可以从物料库中拖动项目的物料模块到码盘。

2. 用户将对应的图形模块在码盘上进行排列组合，APP将最终确定的组合的各图形的坐标进行保存

3. 可以增加码垛层数

4. 可以自定义生成不同大小的图形

现有的Android组件无法满足这一需求，在Android中只能进行自定义View设计。于是展开了对自定义View的学习。

自定义View的流程构造函数 View初始化

onMeasure 测量View大小

onSizeChanged 确定View大小

onLayout 确定子View布局位置

onDraw 实际绘制内容

提供接口 监听View状态

1 Android Graphics 图形库

作为android的图形库提供了以下几个类Drawable通用的图形对象，

用于装载常用格式的图像，可以是 PNG，JPG 这样的图像，也可以是前面学的 13 种 Drawable 类型的可视化对象.

可以理解为放画用的---画框

位图：Bitmap 来保持(hold)那些像素可以简单的理解为 画架

先把画放到上面，然后可以进行一些处理，比如获取图像文件信息，做旋转切割，放大缩小等操作

画布：Canvas 来响应画画(draw)的调用(并将其写入 bitmap)就是可以上面作画(绘制)，可以用 Paint(画笔) ，来画各种形状或者写字，又可以用 Path(路径) 来绘制多个点，然后连接成各种图形

画笔：paint 描述画画的颜色和样式等

Matrix(矩阵)用于图形特效处理的，颜色矩阵(ColorMatrix)，还有使用 Matrix 进行图像的平移，缩放，旋转，倾斜等

“颜料“：drawing primitive，比如矩形、路径、文字、位图等其他元素

!!! Canvas(画布)，Paint(画笔)，Path(路径) 是 android.graphics 接口类下的三个绘图 API

1.1 Paint 画笔

Paint (画笔) 用于设置绘制风格,如 线宽(笔触粗细),颜色,透明度和填充风格

获得一个 Paint 对象实例很简单Paint paint = new Paint();

图形的形状由Canvas确定 当绘制出来的颜色效果由画笔Paint确定mPaint.setStyle(Paint.Style.FILL); //设置画笔模式为填充

画笔有三种模式

STROKE //描边

FILL //填充

FILL_AND_STROKE //描边加填充方法说明setARGB(int a,int r,int g,int b)设置绘制的颜色，a代表透明度，r，g，b代表颜色值

setAlpha(int a)设置绘制图形的透明度

setColor(int color)设置绘制的颜色，使用颜色值来表示，该颜色值包括透明度和RGB颜色。

setAntiAlias(boolean aa)设置是否使用抗锯齿功能，会消耗较大资源，绘制图形速度会变慢

setDither(boolean dither)设定是否使用图像抖动处理，会使绘制出来的图片颜色更加平滑和饱满，图像更加清晰

setFilterBitmap(boolean filter)如果该项设置为true，则图像在动画进行中会滤掉对 Bitmap 图像的优化操作，加快显示速度，本设置项依赖于 dither 和 xfermode 的设置

setMaskFilter(MaskFilter maskfilter)设置 MaskFilter，可以用不同的MaskFilter实现滤镜的效果，如滤化，立体等

setColorFilter(ColorFilter colorfilter)设置颜色过滤器，可以在绘制颜色时实现不用颜色的变换效果

setPathEffect(PathEffect effect)设置绘制路径的效果，如点画线等

setShader(Shader shader)设置图像效果，使用Shader可以绘制出各种渐变效果

setShadowLayer(float radius ,float dx,float dy,int color)在图形下面设置阴影层，产生阴影效果，radius为阴影的角度，dx 和 dy 为阴影在 x 轴和 y 轴上的距离，color 为阴影的颜色

setStyle(Paint.Style style)设置画笔的样式，为FILL，FILL_OR_STROKE，或STROKE

setStrokeCap(Paint.Cap cap)当画笔样式为STROKE或FILL_OR_STROKE时，设置笔刷的图形样式，如圆形样Cap.ROUND,或方形样式Cap.SQUARE

setSrokeJoin(Paint.Join join)设置绘制时各图形的结合方式，如平滑效果等

setStrokeWidth(float width)当画笔样式为STROKE或FILL_OR_STROKE时，设置笔刷的粗细度

setXfermode(Xfermode xfermode)设置图形重叠时的处理方式，如合并，取交集或并集，经常用来制作橡皮的擦除效果

setFakeBoldText(boolean fakeBoldText)模拟实现粗体文字，设置在小字体上效果会非常差

setSubpixelText(boolean subpixelText)设置该项为true，将有助于文本在LCD屏幕上的显示效果

setTextAlign(Paint.Align align)设置绘制文字的对齐方向

setTextScaleX(float scaleX)设置绘制文字x轴的缩放比例，可以实现文字的拉伸的效果

setTextSize(float textSize)设置绘制文字的字号大小

setTextSkewX(float skewX)设置斜体文字，skewX为倾斜弧度

setTypeface(Typeface typeface)设置Typeface对象，即字体风格，包括粗体，斜体以及衬线体，非衬线体等

setUnderlineText(boolean underlineText)设置带有下划线的文字效果

setStrikeThruText(boolean strikeThruText)设置带有删除线的效果

setStrokeJoin(Paint.Join join)设置结合处的样子 Miter:结合处为锐角 Round:结合处为圆弧 BEVEL:结合处为直线

setStrokeMiter(float miter)设置画笔倾斜度

setStrokeCap(Paint.Cap cap)设置转弯处的风格

float ascent( )测量baseline之上至字符最高处的距离)

float descent()baseline之下至字符最低处的距离

int breakText(char[] text, int index, int count, float maxWidth, float[] measuredWidth)检测一行显示多少文字

clearShadowLayer()清除阴影层

1.2 Path 路径

Path(路径) 简单点说就是描点，连线

创建了 Path 的实例后，可以调用 Canvas 的 drawPath(path,paint) 将图形绘制出来

Path (路径) 的常用方法如下方法说明addArc(RectF oval, float startAngle, float sweepAngle为路径添加一个多边形

addCircle(float x, float y, float radius, Path.Direction dir)给 Path 添加圆圈

addOval(RectF oval, Path.Direction dir)添加椭圆形

addRect(RectF rect, Path.Direction dir)添加一个区域

addRoundRect(RectF rect, float[] radii, Path.Direction dir)添加一个圆角区域

isEmpty()判断路径是否为空

transform(Matrix matrix)矩阵变换

transform(Matrix matrix, Path dst)矩阵变换并将结果存到路径

更高级的效果可以使用 PathEffect 类，常用方法如下方法说明moveTo(float x, float y)不会进行绘制，只用于移动移动画笔

lineTo(float x, float y)用于直线绘制，默认从 (0，0) 开始绘制，用 moveTo 移动。比如 mPath.lineTo(300, 300);canvas.drawPath(mPath, mPaint);

quadTo(float x1, float y1, float x2, float y2)用于绘制圆滑曲线，即贝塞尔曲线，同样可以结合 moveTo 使用

rCubicTo(float x1, float y1, float x2, float y2, float x3, float y3)同样是用来实现贝塞尔曲线的。 (x1,y1) 为控制点，(x2,y2)为控制点，(x3,y3) 为结束点

arcTo(RectF oval, float startAngle, float sweepAngle)绘制弧线(实际是截取圆或椭圆的一部分)ovalRectF为椭圆的矩形，startAngle 为开始角度，sweepAngle 为结束角度

1.3 Canvas 画布android.graphics.Canvas类提供了很多“画“的方法，让这块画布具有了丰富多彩的画画能力。比如：画点、线、矩形、椭圆、圆、文字等等。下面的例子演示了这些方法的使用。

创建Canvas画布的方法创建有一个空的画布，可以使用 setBitmap() 方法来设置绘制具体的画布Canvas c = Canvas();以 bitmap对象创建一个画布，将内容都绘制在 bitmap 上bitmap 不能 nullCanvas c = Canvas(Bitmap bitmap);

绘制方法drawXXX()方法族 :：以一定的坐标值在当前画图区域画图，另外图层会叠加， 即后面绘画的图层会覆盖前面绘画的图层方法说明drawRect(RectF rect, Paint paint)绘制区域，参数一为 RectF 一个区域

drawPath(Path path, Paint paint)绘制一个路径，参数一为 Path 路径对象

drawBitmap(Bitmap bitmap, Rect src, Rect dst, Paint paint)贴图，参数一就是我们常规的Bitmap对象，参数二是源区域(这里是bitmap)，参数三是目标区域(应该在canvas的位置和大小)，参数四是Paint画刷对象，因为用到了缩放和拉伸的可能，当原始Rect不等于目标Rect时性能将会有大幅损失

drawLine(float startX, float startY, float stopX, float stopY, Paintpaint)画线，参数一起始点的x轴位置，参数二起始点的y轴位置，参数三终点的x轴水平位置，参数四y轴垂直位置，最后一个参数为Paint 画刷对象。

drawPoint(float x, float y, Paint paint)画点，参数一水平x轴，参数二垂直y轴，第三个参数为Paint对象

drawText(String text, float x, floaty, Paint paint)渲染文本，Canvas类除了上面的还可以描绘文字，参数一是String类型的文本，参数二x轴，参数三y轴，参数四是Paint对象。

drawOval(RectF oval, Paint paint)画椭圆，参数一是扫描区域，参数二为paint对象；

drawCircle(float cx, float cy, float radius,Paint paint)绘制圆，参数一是中心点的x轴，参数二是中心点的y轴，参数三是半径，参数四是paint对象；

drawArc(RectF oval, float startAngle, float sweepAngle, boolean useCenter, Paint paint)画弧，参数一是RectF对象，一个矩形区域椭圆形的界限用于定义在形状、大小、电弧，参数二是起始角(度)在电弧的开始，参数三扫描角(度)开始顺时针测量的，参数四是如果这是真的话,包括椭圆中心的电弧,并关闭它,如果它是假这将是一个弧线,参数五是Paint对象；

drawColor()绘制颜色clipXXX() 方法族:在当前的画图区域裁剪 (clip)出一个新的画图区域，这个画图区域就是 canvas 对象的当前画图区域了

比如：clipRect(new Rect())，那么该矩形区域就是 canvas 的当前画图区域

save() 和 restore() 方法方法说明save()用来保存Canvas的状态。save之后，可以调用 Canvas 的平移、放缩、旋转、错切、裁剪等操作

restore()用来恢复 Canvas 之前保存的状态。防止 save 后对 Canvas 执行的操作对后续的绘制有影响

！！！注意

save() 和 restore() 要配对使用( restore 可以比 save 少,但不能多)，若restore 调用次数比 save 多,会报错getXXX 方法族 获取Canvas相关的一些值

translate() 平移translate(float dx, float dy)

平移就是将画布的坐标原点向左右方向移动 x，向上下方向移动 y

canvas 默认坐标原点位置为左上角 (0,0)参数说明dx为水平方向的移动距离

dy为垂直方向的移动距离scale 缩放void scale(float sx, float sy)

final void scale(float sx, float sy, float px, float py)

对画布进行缩放

参数说明参数说明sx水平方向缩放比例，小于 1 为缩小，大于 1 为放大

sy竖直方向的缩放比例，小于 1 为缩小，大于 1 为放大

px指定旋转的中心点坐标的 x 坐标

py指定旋转的中心点坐标的 y 坐标rotate(float degrees) 旋转，angle 指旋转的角度，顺时针旋转void rotate(float degrees)

final void rotate(float degrees, float px, float py)

围绕坐标原点或指定坐标旋转 degrees 度，值为正顺时针

参数说明参数说明degrees旋转角度

px指定旋转的中心点坐标的 x 坐标

py指定旋转的中心点坐标的 y 坐标skew 倾斜skew(float sx, float sy)

倾斜一定的角度

参数说明参数说明sx为 x 轴方向上倾斜的对应角度，tan(角度)

sy为 y 轴方向上倾斜的对应角度，tan(角度)

两个参数都是 tan 值，比如要在 x 轴方向上倾斜 60 度，那么 sx 为tan(60) = 根号3 = 1.732

Canvas 坐标系

Canvas 以左上角为原点，向右为 X 轴正方向，向下为 Y 轴正方向

Layer 图层

画布Canvas给开发者提供了Layer支持。Layer是按照栈结构进行管理。

当开发者带哦用Save方法时候，会保存当前Canvas的状态作为一个Layer 添加到Canvas栈。

而当我们调用 restore() 方法的时候，会恢复之前 Canvas 的状态，而此时 Canvas 的图层栈 会弹出栈顶的那个 Layer，后继的 Layer 来到栈顶，此时的 Canvas 回复到此栈顶时保存的 Canvas 状态

简单说就是 save()往栈压入一个 Layer，restore()弹出栈顶的一个Layer，这个Layer代表Canvas的 状态！ 也就是说可以 save() 多次，也可以 restore() 多次，但是 restore() 的调用次数 不能大于** save()否则会引发错误

OnDraw

创建画笔

绘制常见的几何图形实例

绘制点drawPoint(float x, float y, Paint paint) //画点，参数一水平x轴，参数二垂直y轴，第三个参数为Paint对象。

绘制直线

绘制直线需要两个点，初始点和结束点，同样绘制直线也可以绘制一条或者绘制一组：canvas.drawLine(300,300,500,600,mPaint); // 在坐标(300,300)(500,600)之间绘制一条直线

canvas.drawLines(new float[]{ // 绘制一组线 每四数字(两个点的坐标)确定一条线

100,200,200,200,

100,300,200,300

},mPaint);

绘制矩形

确定一个矩形一般需要四个数据 ：对角线的两个点的坐标值。通常我们次啊用左上角和右下角的两个点的坐标值

关于绘制矩形，Canvas提供了三种重载方法，第一种就是提供四个数值(矩形左上角和右下角两个点的坐标)来确定一个矩形进行绘制。 其余两种是先将矩形封装为Rect或RectF(实际上仍然是用两个坐标点来确定的矩形)，然后传递给Canvas绘制，如下：// 第一种

canvas.drawRect(100,100,800,400,mPaint);

// 第二种

Rect rect = new Rect(100,100,800,400);

canvas.drawRect(rect,mPaint);

// 第三种

RectF rectF = new RectF(100,100,800,400);

canvas.drawRect(rectF,mPaint)

绘制圆角矩形// 第一种

RectF rectF = new RectF(100,100,800,400);

canvas.drawRoundRect(rectF,30,30,mPaint);

// 第二种

canvas.drawRoundRect(100,100,800,400,30,30,mPaint);

绘制圆canvas.drawCircle(500,500,400,mPaint); // 绘制一个圆心坐标在(500,500)，半径为400 的圆。

绘制椭圆drawCircle(float cx,float cy,float radius,Paint paint)

// 绘制圆，参数一是中心点的x轴，参数二是中心点的y轴，参数三是半径，参数四是paint对象；

绘制圆弧drawArc(RectF oval,float startAngle,float sweepAngle,boolean useCenter,Paint paint)

//画弧

参数一是RectF对象，一个矩形区域椭圆形的界限用于定义在形状、大小、电弧，参数二是起始角(度)在电弧的开始，

参数三扫描角(度)开始顺时针测量的，参数四是如果这是真的话,包括椭圆中心的电弧,并关闭它

参考文档Canvas

Paint

Path