CGAffineTransform详解

作者: yuandiLiao | 来源:发表于2017-05-25 11:23 被阅读181次

    CGAffineTransform是一个映射转换3*3的矩阵,用来绘画2D图像。可以实现放大、缩小、平移。
    先看看其结构

    struct CGAffineTransform {
      CGFloat a, b, c, d;
      CGFloat tx, ty;
    };
    

    可以看出CGAffineTransform是一个结构体,里面有(a,b,c,d,tx,ty)六个参数,其实CGAffineTransform是3*3的矩阵,里面是有九个参数的,但是其他三个默认是(0,0,1)。所以就没有列出来。如下图

    WechatIMG8.jpeg

    CGAffineTransform的(a,b,c,d,tx,ty)默认参数是[ 1 0 0 1 0 0 ]
    这几个的参数的作用:

    • a: 对应sx就是视图宽放大或缩小的比例,初始值1,一倍大小。
    • b: 旋转会用到,初始值0。
    • c: 旋转会用到,初始值0。
    • d: 对应sy就是视图高放大或缩小的比例,初始值1,一倍大小。
    • tx: 视图x轴平移,初始值0,没有平移。
    • ty: 视图y轴平移,初始值0,没有平移。

    API的使用

    1.获取一个原始CGAffineTransform

    获取一个原始的transform值[ 1 0 0 1 0 0 ]。就是没有做任何的转换。
    CGAffineTransformIdentity

    2.创建CGAffineTransform,返回 transform = [ a b c d tx ty ].

    CGAffineTransformMake(CGFloat a, CGFloat b, CGFloat c, CGFloat d, CGFloat tx, CGFloat ty)

    3.单一转换(在原始CGAffineTransformIdentity的转换)

    //平移 t' = [ 1 0 0 1 tx ty ]
    CGAffineTransformMakeTranslation(CGFloat tx, CGFloat ty);

    //缩放 t' = [ sx 0 0 sy 0 0 ]
    CGAffineTransformMakeScale(CGFloat sx, CGFloat sy);

    //旋转 t' = [ cos(angle) sin(angle) -sin(angle) cos(angle) 0 0 ]
    CGAffineTransformMakeRotation(CGFloat angle);

    4.组合转换(在传进来的transform的基础上做转换)
    注意:两个转换是相乘得到最终的转换结果,而不是相加得到结果

    //平移转换 t' = [ 1 0 0 1 tx ty ] * t
    // 在原先转换t的基础上乘新的转换,得到的结果是转换的结果。这里要注意的一点不是两个转换的简单相加,而是相称,例如原先的宽高放大了1.2倍,新的转换平移X轴10的单位,那么最终的结果是平移12个单位,而不是10个单位
    CGAffineTransformTranslate(CGAffineTransform t,
    CGFloat tx, CGFloat ty)

    //缩放 t' = [ 1 0 0 1 tx ty ] * t。用法同上
    CGAffineTransformScale(CGAffineTransform t,
    CGFloat sx, CGFloat sy);

    //旋转 t' = [ cos(angle) sin(angle) -sin(angle) cos(angle) 0 0 ] * t
    CGAffineTransformRotate(CGAffineTransform t,
    CGFloat angle)

    5.判断是否是初始转换 ,返回一个bool值

    bool CGAffineTransformIsIdentity(CGAffineTransform t)

    6.反转,如果值是0那么就不变,其他的取反。

    CGAffineTransformInvert(CGAffineTransform t)

    7.组合转换(两个转换相乘得到新的转换)

    //t' = t1 * t2
    CGAffineTransformConcat(CGAffineTransform t1,
    CGAffineTransform t2)

    8.判断两个转换是否相等

    bool CGAffineTransformEqualToTransform(CGAffineTransform t1,
    CGAffineTransform t2)

    9.转换点
    传入一个点和一个转换,相乘得到一个新的转换点
    p' = p * t
    where p = [ x y 1 ]
    then p' = [x' y' 1]
    计算过程如图

    CGPoint CGPointApplyAffineTransform(CGPoint point,
    CGAffineTransform t)

    WechatIMG9.jpeg

    10.转换区域
    传入一个size和一个转换,相乘得到一个新的转换点
    s' = s * t
    where s = [ width height 0 ]
    then s' = [ width' height' 0 ]
    计算过程同上图

    CGSize CGSizeApplyAffineTransform(CGSize size, CGAffineTransform t)

    11.转换CGRect

    CGRect CGRectApplyAffineTransform(CGRect rect, CGAffineTransform t)

    贴一下使用的代码

    #pragma 原始矩阵值做变化
    
    -(void)makeTranslation
    {
        //平移
        [UIView animateWithDuration:2 animations:^{
            self.backView.transform = CGAffineTransformMakeTranslation(20, 20);
        }];
    
    }
    -(void)makeScaleBig
    {
        //宽和高按原始的比例放大
        [UIView animateWithDuration:2 animations:^{
            
            self.backView.transform = CGAffineTransformMakeScale(1.2, 1.2);
        }];
    
    }
    -(void)makeScaleSmall
    {
        //宽和高按原始的比例缩小
        [UIView animateWithDuration:2 animations:^{
            self.backView.transform = CGAffineTransformMakeScale(0.8, 0.8);
    
        }];
    
    }
    -(void)makeRotation
    {
        //沿原始Z轴0角度旋转
        [UIView animateWithDuration:2 animations:^{
            self.backView.transform = CGAffineTransformMakeRotation(M_PI/2);
        }];
    }
    
    #pragma 在传入的矩阵值做变化
    
    -(void)translation
    {
        [UIView animateWithDuration:2 animations:^{
            self.backView.transform = CGAffineTransformTranslate(self.backView.transform, 10, 10);
        }];
    }
    -(void)scaleBig
    {
        //宽和高传进来的再乘以设置的比例放大
        [UIView animateWithDuration:2 animations:^{
            self.backView.transform = CGAffineTransformScale(self.backView.transform,1.2, 1.2);
        }];
    }
    -(void)scaleSmall
    {
        //宽和高传进来的再乘以设置的比例缩小
        [UIView animateWithDuration:2 animations:^{
            self.backView.transform = CGAffineTransformScale(self.backView.transform,0.8, 0.8);
        }];  
    }
    -(void)Rotation
    {
        //传进来的角度再加上设置的角度旋转
        [UIView animateWithDuration:2 animations:^{
            self.backView.transform = CGAffineTransformRotate(self.backView.transform, M_PI/4);
        }];
    }
    

    相关文章

      网友评论

        本文标题:CGAffineTransform详解

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