zoukankan      html  css  js  c++  java
  • Canvas范围裁切和几何变换

     范围裁切

    clipRect()

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

    clipPath()

    和clipRect一样,不过是把坐标换成了path,可以实现更多形状裁切

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

    几何变换

    几何变换大概包括三类

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

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

    3.使用 Camera 来做三维变换

    Canvas变换

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

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

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

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

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

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

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

    参数里的 sx sy 是横向和纵向的放缩倍数; px py 是放缩的轴心

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

    skew(float sx, float sy) 错切

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

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

    Matrix 变换

     Matrix 做常见变换(效果等同于Canvas变换):

    1. 创建 Matrix 对象;
    2. 调用 Matrix 的 pre/postTranslate/Rotate/Scale/Skew() 方法来设置几何变换;
    3. 使用 Canvas.setMatrix(matrix) 或 Canvas.concat(matrix) 来把几何变换应用到 Canvas
    Matrix matrix = new Matrix();
    
    ...
    
    matrix.reset();  
    matrix.postTranslate();  
    matrix.postRotate();
    
    canvas.save();  
    canvas.concat(matrix);  
    canvas.drawBitmap(bitmap, x, y, paint);  
    canvas.restore();  

            把 Matrix 应用到 Canvas 有两个方法: Canvas.setMatrix(matrix) 和 Canvas.concat(matrix)

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

     

     Matrix 做自定义变换

         Matrix.setPolyToPoly(float[] src, int srcIndex, float[] dst, int dstIndex, int pointCount) 用点对点映射的方式设置变换

      poly 就是「多」的意思。setPolyToPoly() 的作用是通过多点的映射的方式来直接设置变换。「多点映射」的意思就是把指定的点移动到给出的位置,从而发生形变。例如:(0, 0) -> (100, 100) 表示把 (0, 0) 位置的像素移动到 (100, 100) 的位置,这个是单点的映射,单点映射可以实现平移。而多点的映射,就可以让绘制内容任意地扭曲。

        参数里,src 和 dst 是源点集合目标点集;srcIndex 和 dstIndex 是第一个点的偏移;pointCount 是采集的点的个数(个数不能大于 4,因为大于 4 个点就无法计算变换了)。

       

    Camera三维变换

    Camera.rotate*() 三维旋转

    canvas.save();
    
    camera.save(); // 保存 Camera 的状态  
    camera.rotateX(30); // 旋转 Camera 的三维空间  
    camera.applyToCanvas(canvas); // 把旋转投影到 Canvas  
    camera.restore(); // 恢复 Camera 的状态
    
    canvas.drawBitmap(bitmap, point1.x, point1.y, paint);  
    canvas.restore();  

    Camera.translate(float x, float y, float z) 移动

    使用方法以及效果和rotate一样

  • 相关阅读:
    springboot中filter的配置和顺序执行
    springboot整合fastdfs实现上传和下载
    移动端通过fiddler代理调试PC端代码
    react-native windows 环境搭建
    带你逐行阅读redux源码
    前端单页面拆分多个单页面
    Koa2学习(九)与mongoDB交互
    Koa2学习(八)使用session
    Koa2学习(七)使用cookie
    Koa2学习(六)使用koa-router
  • 原文地址:https://www.cnblogs.com/krislight1105/p/10008312.html
Copyright © 2011-2022 走看看