【Android UI】Canvas 画布 ⑧ ( Canvas 绘图坐标系 2x2 矩阵 | Canvas 绘图坐标系 3x3 操作矩阵 )


Canvas 状态保存机制 中 , 存在两个栈结构 , 分别是 状态栈 图层栈 ;

其中 图层栈 又称为 Layer 栈 ;


Canvas 画布中 , 有 2 2 2 套坐标系 , 分别是 :

  • Canvas 自身坐标系
  • Canvas 绘图坐标系




一、Canvas 绘图坐标系 2x2 矩阵



在 Canvas 绘制矩形的过程中 , 最终调用的是 BaseCanvas#nDrawRect 方法 ,

    private static native void nDrawRect(long nativeCanvas, float left, float top, float right,
            float bottom, long nativePaint);

最终的 左上右下 Canvas 绘图坐标系 中的坐标数据 , 也就是上述 BaseCanvas#nDrawRect 方法的 float left, float top, float right, float bottom 参数 , 会被转为一个 2 × 2 2\times2 2×2 的 Matrix 矩阵 ;

2 × 2 2\times2 2×2 的 Matrix 矩阵 用于存储 Canvas 绘图坐标系 ;

Canvas 绘图坐标系 可以通过调用 Canvas#translate 平移 , Canvas#rotate 旋转 , Canvas#scale 缩放 , Canvas#skew 扭曲斜拉 等方法 进行改变 ;





二、Canvas 绘图坐标系 3x3 操作矩阵



Canvas#translate 平移 , Canvas#rotate 旋转 , Canvas#scale 缩放 , Canvas#skew 扭曲斜拉 等操作数据 , 会被封装到一个 3 × 3 3 \times 3 3×3 的 Matrix 矩阵 中 , 该矩阵中有 9 9 9 个参数 , 用于记录上述 4 4 4 种操作数值 :

  • cosX -sinX translateX
  • sinX cosX translateY
  • 0 0 scale

其中 sinX 和 cosX 表示 Canvas#rotate 旋转角度的 正弦和余弦值 , 顺时针旋转为正 ;

translateX 和 translateY 分别表示 X 轴 和 Y 轴平移的值 ;

scale 表示 Canvas 画布缩放值 ;


调用 Canvas#getMatrix 方法 , 可获取上述 3 × 3 3 \times 3 3×3 的 Matrix 矩阵 , 该方法原型如下 :

    /**
     * 返回一个新矩阵和画布当前变换矩阵的副本。
     *
     * @deprecated {@link #isHardwareAccelerated() 硬件加速的}
     * 画布在传递到视图或可绘制时可能有任何矩阵,
     * 因为它是在层次结构中创建此类画布的位置由实现定义的。
     * 在这种情况下,建议绘制内容而不考虑当前矩阵,或跟踪画布之外的相关变换状态。
     */
    @Deprecated
    public final @NonNull Matrix getMatrix() {
    
    
        Matrix m = new Matrix();
        //noinspection deprecation
        getMatrix(m);
        return m;
    }

上述 Canvas#translate 平移 , Canvas#rotate 旋转 , Canvas#scale 缩放 , Canvas#skew 扭曲斜拉 等操作的 3 × 3 3 \times 3 3×3 的 Matrix 矩阵

会与

代表 Canvas 绘图坐标系的 2 × 2 2 \times 2 2×2 的 Matrix 矩阵

进行运算 , 最终得到一个 新的 Canvas 绘图坐标系 ;

猜你喜欢

转载自blog.csdn.net/han1202012/article/details/125759175