- 这个一个系列,本系列讲的都是本人自定义 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) 平移
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 来做三维变换
- 写例子的时候遇到问题了,不想搞了!!等用到的时候再说吧