自定义绘制流程

自定义绘制牵扯到 以下几点内容:

1.canvas.drawXXX 绘制出不同的内容  例如 drawText绘制文字,它的参数包括绘制内容,绘制的起点x坐标,绘制的起点Y坐标,画笔,new Paint();paint可以指定绘制的颜色  风格空心实心  线条宽度 等一些共有元素


drawXXX()系列方法和Paint的基础掌握了,就能够应付简单的绘制需求。它们主要包括:

Canvas类下的所有draw-打头的方法,例如drawCircle()drawBitmap()。

Paint类的几个最常用的方法。具体是:

Paint.setStyle(Style style)设置绘制模式

Paint.setColor(int color)设置颜色

Paint.setStrokeWidth(float width)设置线条宽度

Paint.setTextSize(float textSize)设置文字大小

Paint.setAntiAlias(boolean aa)设置抗锯齿开关


Canvas.drawColor(@ColorInt int color) 颜色填充

这是最基本的drawXXX()方法:在整个绘制区域统一涂上指定的颜色。

drawCircle(float centerX, float centerY, float radius, Paint paint) 画圆

前两个参数centerXcenterY是圆心的坐标,第三个参数radius是圆的半径,单位都是像素,它们共同构成了这个圆的基本信息(即用这几个信息可以构建出一个确定的圆);第四个参数paint我在视频里面已经说过了,它提供基本信息之外的所有风格信息,例如颜色、线条粗细、阴影等。


drawRect(float left, float top, float right, float bottom, Paint paint) 画矩形

left,top,right,bottom是矩形四条边的坐标。


drawPoint(float x, float y, Paint paint) 画点

x和y是点的坐标。点的大小可以通过paint.setStrokeWidth(width)来设置;点的形状可以通过paint.setStrokeCap(cap)来设置:ROUND画出来是圆形的点,SQUARE或BUTT画出来是方形的点。(点还有形状?是的,反正 Google 是这么说的,你要问问 Google 去,我也很懵逼。)

注:Paint.setStrokeCap(cap)可以设置点的形状,但这个方法并不是专门用来设置点的形状的,而是一个设置线条端点形状的方法。端点有圆头 (ROUND)、平头 (BUTT) 和方头 (SQUARE) 三种,具体会在下一节里面讲。


drawPoints(float[] pts, int offset, int count, Paint paint) / drawPoints(float[] pts, Paint paint) 画点(批量)

同样是画点,它和drawPoint()的区别是可以画多个点。pts这个数组是点的坐标,每两个成一对;offset表示跳过数组的前几个数再开始记坐标;count表示一共要绘制几个点。说这么多你可能越读越晕,你还是自己试试吧,这是个看着复杂用着简单的方法。


drawOval(float left, float top, float right, float bottom, Paint paint) 画椭圆

只能绘制横着的或者竖着的椭圆,不能绘制斜的(斜的倒是也可以,但不是直接使用drawOval(),而是配合几何变换,后面会讲到)。left,top,right,bottom是这个椭圆的左、上、右、下四个边界点的坐标。


drawLine(float startX, float startY, float stopX, float stopY, Paint paint) 画线

startX,startY,stopX,stopY分别是线的起点和终点坐标。

drawRoundRect(float left, float top, float right, float bottom, float rx, float ry, Paint paint) 画圆角矩形

left,top,right,bottom是四条边的坐标,rx和ry是圆角的横向半径和纵向半径。

另外,它还有一个重载方法drawRoundRect(RectF rect, float rx, float ry, Paint paint),让你可以直接填写RectF来绘制圆角矩形。


drawArc(float left, float top, float right, float bottom, float startAngle, float sweepAngle, boolean useCenter, Paint paint) 绘制弧形或扇形

drawArc()是使用一个椭圆来描述弧形的。left,top,right,bottom描述的是这个弧形所在的椭圆;startAngle是弧形的起始角度(x 轴的正向,即正右的方向,是 0 度的位置;顺时针为正角度,逆时针为负角度),sweepAngle是弧形划过的角度;useCenter表示是否连接到圆心,如果不连接到圆心,就是弧形,如果连接到圆心,就是扇形。


范围裁切有两个方法:clipRect()和clipPath()。裁切方法之后的绘制代码,都会被限制在裁切范围内。

几何变换的使用大概分为三类:

使用Canvas来做常见的二维变换;

使用Matrix来做常见和不常见的二维变换;

使用Camera来做三维变换。

2.1 使用 Canvas 来做常见的二维变换:

2.1.1 Canvas.translate(float dx, float dy) 平移

参数里的dx和dy表示横向和纵向的位移。

2.1.2 Canvas.rotate(float degrees, float px, float py) 旋转

参数里的degrees是旋转角度,单位是度(也就是一周有 360° 的那个单位),方向是顺时针为正向;px和py是轴心的位置。

2.1.3 Canvas.scale(float sx, float sy, float px, float py) 放缩

参数里的sxsy是横向和纵向的放缩倍数;pxpy是放缩的轴心。

2.1.4 skew(float sx, float sy) 错切

参数里的sx和sy是 x 方向和 y 方向的错切系数。

2.2.1 使用 Matrix 来做常见变换

Matrix做常见变换的方式:

创建Matrix对象;

调用Matrix的pre/postTranslate/Rotate/Scale/Skew()方法来设置几何变换;

使用Canvas.setMatrix(matrix)或Canvas.concat(matrix)来把几何变换应用到Canvas。

Canvas.setMatrix(matrix):用Matrix直接替换Canvas当前的变换矩阵,即抛弃Canvas当前的变换,改用Matrix的变换(注:根据下面评论里以及我在微信公众号中收到的反馈,不同的系统中setMatrix(matrix)的行为可能不一致,所以还是尽量用concat(matrix)吧);

Canvas.concat(matrix):用Canvas当前的变换矩阵和Matrix相乘,即基于Canvas当前的变换,叠加上Matrix中的变换。

绘制流程图


自定义绘制流程_第1张图片
在ViewGroup的子类中重写除dispatchDraw()以外的绘制方法时,可能需要调用setWillNotDraw(false);

在重写的方法有多个选择时,优先选择onDraw()。

你可能感兴趣的:(自定义绘制流程)