我的自定义View学习笔记（四）—— 绘制Canvas 对绘制的辅助——范围裁切和几何变换

• 这个一个系列，本系列讲的都是本人自定义 View 的学习笔记。目的是加深影响，便于在以后工作中遇到相关问题的时候，能够有个印象知道到哪里去寻找答案。
• 这是我学习扔物线大神的自定义 View 教程，自己记录的笔记。链接在这里HenCoder，强烈推荐大家去原地址学习，毕竟我写的笔记只是针对我个人的口味而言的，用词和对概念的理解不一定有扔物线大神准确。
• 我再发一次地址：https://hencoder.com

1、裁剪范围

1.1 clipRect(left, top, right, bottom)

• 对画布进行剪裁，只有被参数圈定范围的画布才能显示出来
• 需要配合 save()、restore() 使用，恢复之前的 Canvas 范围

canvas.save();  
canvas.clipRect(left, top, right, bottom);  
canvas.drawBitmap(bitmap, x, y, paint);  
canvas.restore();  

1.2 clipPath(path);

• 对画布进行裁剪，裁剪出的是 Path 指定的路径
• 同 clipRect()

canvas.save();  
canvas.clipPath(path1);  
canvas.drawBitmap(bitmap, point1.x, point1.y, paint);  
canvas.restore();

2、几何变换

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

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

• dx、dy 表示画布在水平和竖直方向上的位移

canvas.save();  
canvas.translate(200, 0);  
canvas.drawBitmap(bitmap, x, y, paint);  
canvas.restore();  

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

• 对画布进行旋转操作
• degrees 为旋转的角度，px、py 则是旋转的轴心位置

canvas.save();  
canvas.rotate(45, centerX, centerY);  
canvas.drawBitmap(bitmap, x, y, paint);  
canvas.restore();  

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

• 对画布进行缩放
• sx、sy X 轴 Y 轴方向上缩放的倍数。
• px、py 缩放的轴心

canvas.save();  
canvas.scale(1.3f, 1.3f, x + bitmapWidth / 2, y + bitmapHeight / 2);  
canvas.drawBitmap(bitmap, x, y, paint);  
canvas.restore();  

2.1.4 skew(float sx, float sy) 斜率

• sx 和 sy 是 x 方向和 y 方向的斜率系数。

canvas.save();  
canvas.skew(0, 0.5f);  
canvas.drawBitmap(bitmap, x, y, paint);  
canvas.restore();  

2.2 使用 Matrix 来做变换

2.2.1 使用 Matrix 来做常见变换

• 创建 Matrix 对象
• 调用 Matrix 的 pre/postTranslate/Rotate/Scale/Skew() 方法来设置几何变换
• 使用 Canvas.setMatrix(matrix) 或 Canvas.concat(matrix) 来把几何变换应用到 Canvas
  • 用 Matrix 直接替换 Canvas 当前的变换矩阵，即抛弃 Canvas 当前的变换，改用 Matrix 的变换
  • 用 Canvas 当前的变换矩阵和 Matrix 相乘，即基于 Canvas 当前的变换，叠加上 Matrix 中的变换。

2.2.2 使用 Matrix 来做自定义变换

• Matrix.setPolyToPoly(float[] src, int srcIndex, float[] dst, int dstIndex, int pointCount) 用点对点映射的方式设置变换
  • 就是对指定的四个顶点（无论什么图形都是有最左、右、上、下四个极限位置的组成的点限制的）进行转换。单点映射可以实现平移。而多点的映射，就可以让绘制内容任意地扭曲。

Matrix matrix = new Matrix();  
float pointsSrc = {left, top, right, top, left, bottom, right, bottom};  
float pointsDst = {left - 10, top + 50, right + 120, top - 90, left + 20, bottom + 30, right + 20, bottom + 60};

matrix.reset();  
matrix.setPolyToPoly(pointsSrc, 0, pointsDst, 0, 4);

canvas.save();  
canvas.concat(matrix);  
canvas.drawBitmap(bitmap, x, y, paint);  
canvas.restore();  

• src 和 dst 是源点集合目标点集
• srcIndex 和 dstIndex 是第一个点的偏移
• pointCount 是采集的点的个数（个数不能大于 4，因为大于 4 个点就无法计算变换了）

2.3 使用 Camera 来做三维变换

• 写例子的时候遇到问题了，不想搞了！！等用到的时候再说吧