View的绘制（二）Paint，Canvas和Path的介绍

 

一 . Paint对颜色的处理

在Paint类中，处理颜色主要有三个方法。

• setShader(Shader shader)：用来处理颜色渐变
• setColorFilter(ColorFilter filter)：用来基于颜色进行过滤处理；
• setXfermode(Xfermode xfermode) 用来处理源图像和 View 已有内容的关系

1.1 Shader的模式

 LinearGradient ：线性渐变

 SweepGradient - 辐射渐变

 BitmapShader - 位图着色，可以利用该类做各种各样的图片裁剪。

ComposeShader - 组合Shader，可以将连个Shader组合在一起

1.2 ColorFilter的使用

颜色过滤器可以将颜色按照一定的规则输出，常见于各种滤镜效果

LightingColorFilter - 模拟光照效果

PorterDuffColorFilter - 模拟颜色混合效果

ColorMatrixColorFilter - 颜色矩阵过滤

二. Paint对 文字的处理

Paint里有大量方法来设置文字的绘制属性，事实上文字在Android底层是被当做图片来处理的。

• setTextSize(float textSize)：设置文字大小
• setTypeface(Typeface typeface)：设置文字字体
• setFakeBoldText(boolean fakeBoldText)：是否使用伪粗体（并不是提到size，而是在运行时描粗的）
• setStrikeThruText(boolean strikeThruText)：是否添加删除线
• setUnderlineText(boolean underlineText)：是否添加下划线
• setTextSkewX(float skewX)：设置文字倾斜度
• setTextScaleX(float scaleX)：设置文字横向缩放
• setLetterSpacing(float letterSpacing)：设置文字间距
• setFontFeatureSettings(String settings)：使用CSS的font-feature-settings的方式来设置文字。
• setTextAlign(Paint.Align align)：设置文字对齐方式
• setTextLocale(Locale locale)：设置文字Local
• setHinting(int mode)：设置字体Hinting（微调），过向字体中加入 hinting 信息，让矢量字体在尺寸过小的时候得到针对性的修正，从而提高显示效果。
• setSubpixelText(boolean subpixelText)：设置次像素级抗锯齿，根据程序所运行的设备的屏幕类型，来进行针对性的次像素级的抗锯齿计算，从而达到更好的抗锯齿效果。

三. Paint的特殊效果类

setAntiAlias (boolean aa)

设置抗锯齿，默认关闭，用来是图像的绘制更加圆润。我们还可以在初始化的时候设置Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);。

setStyle(Paint.Style style)

设置填充风格，FILL 模式，填充,STROKE 模式，画线,FILL_AND_STROKE 模式，填充 + 画线

如果是划线模式，我们针对线条还可以有多种设置。

setStrokeWidth(float width) - 设置线条粗细

setStrokeCap(Paint.Cap cap) - 设置线头的形状，默认为 BUTT,UTT 平头,ROUND 圆头,SQUARE 方头

setStrokeJoin(Paint.Join join) - 设置拐角的形状。默认为 MITER,MITER 尖角,BEVEL 平角,ROUND 圆角

setStrokeMiter(float miter) 设置 MITER 型拐角的延长线的最大值

setDither(boolean dither) 设置图像的抖动。抖动是指把图像从较高色彩深度（即可用的颜色数）向较低色彩深度的区域绘制时，在图像中有意地插入噪点，通过有规律地扰乱图像来让图像对于肉眼更加真实的做法。当然这个效果旨在低位色的时候比较有用，例如，ARGB_4444 或者 RGB_565，不过现在Android默认的色彩深度都是32位的ARGB_8888，这个方法的效果没有那么明显。

setFilterBitmap(boolean filter)设置是否使用双线性过滤来绘制 Bitmap .图像在放大绘制的时候，默认使用的是最近邻插值过滤，这种算法简单，但会出现马赛克现象；而如果开启了双线性过滤，就可以让结果图像显得更加平滑。

setPathEffect(PathEffect effect) 设置图形的轮廓效果。Android有六种PathEffect：CornerPathEffect：将拐角绘制成圆角，DiscretePathEffect：将线条进行随机偏离，DashPathEffect：绘制虚线,PathDashPathEffect：使用指定的Path来绘制虚线SumPathEffect：组合两个PathEffect，叠加应用,ComposePathEffect：组合两个PathEffect，叠加应用。

CornerPathEffect(float radius),float radius圆角半径

DiscretePathEffect(float segmentLength, float deviation),float segmentLength:用来拼接每个线段的长度，float deviation:偏离量

DashPathEffect(float[] intervals, float phase)float[] intervals：指定了虚线的格式，数组中元素必须为偶数（最少是 2 个），按照「画线长度、空白长度、画线长度、空白长度」……的顺序排列,float phase：虚线的偏移量

PathDashPathEffect(Path shape, float advance, float phase, PathDashPathEffect.Style style),Path shape：用来绘制的Path,float advance：两个相邻Path段起点间的间隔,float phase：虚线的偏移量, PathDashPathEffect.Style style：指定拐弯改变的时候 shape 的转换方式：TRANSLATE：位移、ROTATE：旋转、MORPH：变体

SumPathEffect(PathEffect first, PathEffect second),PathEffect first：同时应用的PathEffect,PathEffect second：同时应用的PathEffect

ComposePathEffect(PathEffect outerpe, PathEffect innerpe),PathEffect outerpe：后应用的PathEffect,PathEffect innerpe：先应用的PathEffect

setShadowLayer(float radius, float dx, float dy, int shadowColor),设置阴影图层，处于目标下层图层。float radius：阴影半径,float dx：阴影偏移量,float dy：阴影偏移量,int shadowColor：阴影颜色.注：在硬件加速开启的情况下， setShadowLayer() 只支持文字的绘制，文字之外的绘制必须关闭硬件加速才能正常绘制阴影。如果 shadowColor 是半透明的，阴影的透明度就使用 shadowColor 自己的透明度；而如果 shadowColor 是不透明的，阴影的透明度就使用 paint 的透明度。

setMaskFilter(MaskFilter maskfilter)设置图层遮罩层，处于目标上层图层。MaskFilter有两个子类：BlurMaskFilter：模糊效果BlurMaskFilter：浮雕效果,注：在硬件加速开启的情况下， setMaskFilter(MaskFilter maskfilter)只支持文字的绘制，文字之外的绘制必须关闭硬件加速才能正常绘制阴影。关闭硬件加速可以调用
View.setLayerType(View.LAYER_TYPE_SOFTWARE, null)或者在Activity标签里设置android:hardwareAccelerated="false"。

四. Canvas的基本使用

Canvas实现了Android 2D图形的绘制，底层基于Skia实现，Canvas提供了丰富的对象绘制方法，一般都以drawXXX()打头，绘制的对象包括：

• 弧线（Arcs）
• 颜色（Argb、Color）
• 位图（Bitmap）
• 圆（Circle）
• 点（Point）
• 线（Line）
• 矩形（Rect）
• 图片（Picture）
• 圆角矩形（RoundRect）
• 文本（Text）
• 顶点（Vertices）
• 路径（Path）

五.Canvas的范围裁切

Canvas里的范围裁切主要有两类方法：

• clipReact()：按路径裁切
• clipPath()：按坐标裁切

六. Canvas的几何变换

关于几何变换有三种实现方式：

• Canvas：常规几何变换
• Matrix：自定义几何变换
• Camera：三维变换

6.1 常规几何变换

Canvas还提供了对象的位置变换的方法，其中包括：

• translate(float dx, float dy)：平移
• rotate(float degrees)：旋转，可以设置旋转圆点，默认在原点位置。
• scale(float sx, float sy)：缩放
• skew(float sx, float sy)：扭曲

为了不影响其他绘制操作，在进行变换之前需要调用canvas.save()保存画布，变换完成以后再调用canvas.restore()来恢复画布。
Canvas几何变换的顺序是相反的，例如我们在代码写了：canvas.skew(0, 0.5f); canvas.rotate(45, 750, 750); 它的实际调用顺序是canvas.rotate(45, 750, 750); -> canvas.skew(0, 0.5f)

6.2 Matrix自定义几何变换

Matrix也实现了Canvas里的四种常规变换，它的实现流程如下：

1. 创建 Matrix 对象；
2. 调用 Matrix 的 pre/postTranslate/Rotate/Scale/Skew() 方法来设置几何变换；
3. 使用 Canvas.setMatrix(matrix) 或 Canvas.concat(matrix) 来把几何变换应用到 Canvas。

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

Matrix除了四种基本的几何变换，还可以自定义几何变换。

• setPolyToPoly(float[] src, int srcIndex, float[] dst, int dstIndex, int pointCount)
• setRectToRect(RectF src, RectF dst, ScaleToFit stf)

6.3 Camera三维变换

Camera的三维变换包括：旋转、平移与移动相机。

旋转 rotateX(deg)，rotateY(deg)，rotateZ(deg)，rotate(x, y, z)

平移，translate(float x, float y, float z)

移动相机，setLocation(float x, float y, float z)

 

七.Path的绘制

Path描述了绘制路径，用它可以完成很多复杂的图形绘制，比如贝塞尔曲线

贝塞尔曲线：贝塞尔曲线是几何上的一种曲线。它通过起点、控制点和终点来描述一条曲线，主要用于计算机图形学。简单来说，贝塞尔曲线就是将任意一条曲线转换为精确的数学公式。

参考文章 https://www.jianshu.com/p/27665fce3bf5