美文网首页Android自定义View程序员
Android 关于Matrix的知识(一)

Android 关于Matrix的知识(一)

作者: MartinBZDQSM | 来源:发表于2016-07-19 22:13 被阅读1608次
    • 在日常开发中经常能够看得到Matrix的身影,Matrix直译过来也就是矩阵的意思,其实我们通常使用它进行一些图形变换的操作,例如:旋转,平移,缩放,扭曲等。

    • 本章节主要讲述的Matrix主要如何使用以及一些需要注意的细节,部分内容会直接引用作者查找的一些资料,因为我觉得他们已经写得很好了,再复制一遍真心没有必要(国内大多数博客都一个德行,大家知道是为什么的)。

    • Matrix的基本实现原理其实就是对矩阵的操作,需要一定的线性代数的知识,详细可以查看这篇文章:[Android Matrix详解]。其实我觉得看懂了并没有什么卵用,谷歌在这方面已经提供了很丰富的api供我们使用。如果要说会用到矩阵的变化,我觉得能使用的地方也就只剩ColorMatrix(后期会再讲),但是没有对图像研究过,也没有什么用。所以这里不再进行描述。

    会用到Matrix的地方:

    1.Canvas:
        canvas.concat(matrix);
        canvas.setMatrix(matrix);
    

    注意这里cancat()与setMatrix()的区别,cancat应用于当前画布的全部“对象”,而setMatrix针对于当前画布。

    下面使用该段代码进行测试:
        matrix = new Matrix();     
       matrix.postScale(2, 2);
    //        canvas.save();    
        canvas.setMatrix(matrix);
    //        canvas.concat(matrix);       
     canvas.drawRect(100, 100, 300, 300, paint1);
    //        canvas.restore();       
     canvas.drawRect(300, 300, 500, 500, paint2);        canvas.drawText("canvas.setMatrix(matrix)", 50, 600, paint1);
    
    original
    setMatrix
    concat

    由上面三张图可以对比出来,concat针对的是画布上的全部组件,而setMatrix指的是当前画布,所以setMatrix的时候由于整个画布由中心点放大了两倍,而黑色矩形也因为放大Y轴也想上放大了两倍,导致了黑色矩形块被遮挡。

    2.ImageView:
     imageView.setImageMatrix(matrix);
    

    这个没啥好说的。

    Matrix的动作:

    Matrix的动作有三种,分别是:pre ,post,set
    可以参考这篇文章:Matrix 中的post 和pre 和set 方法的区别 以及Canvas中的方法

    其实很简单,就像排队:

    1.pre 代表着如果之前有过操作,乖乖排队。

    2.post 代表着插队到第一个。

    3.set 代表着,前面的都给老子滚,这里只准留我一个。

    Matrix的方法:

    Matrix的主要方法有四类,这个在开篇讲过,使用起来也非常简单,
    可以去看看这边文章:Matrix的基本三种变换之Translation、Skew、Rotate

    我觉得主要需要注意的点,也没有什么,唯一需要留心的是在缩放,旋转,还有扭曲时,操作点的位置,是使用的“零点”(left,top)呢?还是使用中心点(centerX,centerY)?
    我会在下章节针对于部分小细节,写些大概的描述。

    在这些操作当中,我觉得有一个好玩的方法就是 matrix.setPolyToPoly(),这个方法主要是用于折叠动画当中,它就是skew(扭曲)的升级版。
    可以将规定矩形框进行变化,感兴趣的可以参考下HongYang的这篇文章: Android FoldingLayout 折叠布局 原理及实现(一)

    我自己也写了一个类似蝴蝶飞舞的dialog ,也是使用了这个原理。以后有空会贴出来。

    batteryfly

    相关文章

      网友评论

      本文标题:Android 关于Matrix的知识(一)

      本文链接:https://www.haomeiwen.com/subject/oezmjttx.html