CATransform3D和CGAffineTransform之详细解说测试
Posted iOS的美丽岁月
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了CATransform3D和CGAffineTransform之详细解说测试相关的知识,希望对你有一定的参考价值。
1、本片博客重点在于两个类的解说,使用解说的不多。
3D 效果的基本类 CGAffineTransform ,还有他的兄弟CGAffineTransform类。这里对改两个类的方法等做了详细的测试和实验。
2、呼朋唤友
群的特点:
1、iOS 开发交流群,每周都有更新新的内容。
2、群里有3~5年的资深开发者。
3、群员在App开发过程中遇到什么问题,可以在群里提问。
4、群员在App开发中,如果遇到难实现的功能或者模块,可以在群里提出,有人员帮助你实现。
5、加入群后,可以get到App 开发中的一些小功能模块。
群号是:185341804 群名字:成功QQ吧
群主号:1542100658 (qq)
3、代码测试块
第一、CATransform3D的介绍
#pragma mark --- ExplainCATransform3D
-(void)ExplainCATransform3D
/**
CATransform3D 是一个奇次三维变换矩阵
原型:
struct CATransform3D
CGFloat m11, m12, m13, m14;
CGFloat m21, m22, m23, m24;
CGFloat m31, m32, m33, m34;
CGFloat m41, m42, m43, m44;
;
个参数的意思
m11 : 以XY轴中心为中心,随着m11值由 1-->0 变小,图像向X轴中心压缩;随着m11值由 1-->MAX 变大,图像以X轴中心向外拉伸图像。
m12 : 以XY轴中心为中心,随着m12值由 0-->MAX 变大,图像顺时针方向在Y轴,做切变。随着m12值由 0-->MIN 变小,图像逆时针方向在Y轴,做切变。
名词介绍:
切变:两个距离很近、大小相等、方向相反的平行力作用于同一物体上所引起的形变。
m13 : 以X轴为中心的垂直线为界限,如果m13>0图像的左边将会被切掉 ; m13<0 图像的右边边将会被切掉。
m14 :以X轴为中心的垂直线为界限,随着m14值由 0-->MAX 变大,图像左侧向Z轴翻转,并做拉伸。随着m14值由 0-->MIN 变小,图像右边向Z轴翻转,做拉伸。
m21 :以XY轴中心为中心,随着m21值由 0-->MAX 变大,图像顺时针方向在X轴,做切变。随着m21值由 0-->MIN 变小,图像逆时针方向在X轴,做切变。
m22 : 以XY轴中心为中心,随着m22值由 1-->0 变小,图像向Y轴中心压缩;随着m22值由 1-->MAX 变大,图像以Y轴中心向外拉伸图像。
m23 : 以Y轴为中心的垂直线为界限,如果m23>0图像的上边将会被切掉 ; m23<0 图像的下边边将会被切掉。
m24 :以Y轴为中心的垂直线为界限,随着m24值由 0-->MAX 变大,图像上面向Z轴翻转,并做拉伸。随着m24值由 0-->MIN 变小,图像下面边向Z轴翻转,并做拉伸。
m31:和m13一起决定y轴的旋转
m32:和m23一起决定x轴的旋转
m33:z轴方向进行缩放
m34:透视效果m34= -1/D,D越小,透视效果越明显,必须在有旋转效果的前提下,才会看到透视效果
m41 : 让图像沿着X轴左右平移。m41>0 ,向右平移;m41<0 ,向左平移。
m42 : 让图像沿着Y轴上下平移。m42>0 ,向上平移;m41<0 ,向下平移。
m43 : 让图像沿着Z轴上下平移。m43>0 ,向上平移;m43<0 ,向下平移。
m44 : 图像的放大和缩小,当m44 由 MAX --> 0 放大;0--> 缩小。
*/
2、整体介绍,不一一介绍
//
// ViewController+CATransform3DExplain.m
// 立体效果之CATransform3D
//
// Created by MAC on 2017/4/13.
// Copyright © 2017年 NetworkCode小贱. All rights reserved.
//
#import "ViewController.h"
#import <QuartzCore/QuartzCore.h>
@implementation ViewController (CATransform3DExplain)
-(void)viewDidLoad
/**
一个类的解说
*/
[self ExplainCATransform3D];
/**
事例
*/
[self createImageView];
/**
创建一个滑块
*/
[self createSlider];
#pragma mark --- ExplainCATransform3D
-(void)ExplainCATransform3D
/**
CATransform3D 是一个奇次三维变换矩阵
原型:
struct CATransform3D
CGFloat m11, m12, m13, m14;
CGFloat m21, m22, m23, m24;
CGFloat m31, m32, m33, m34;
CGFloat m41, m42, m43, m44;
;
个参数的意思
m11 : 以XY轴中心为中心,随着m11值由 1-->0 变小,图像向X轴中心压缩;随着m11值由 1-->MAX 变大,图像以X轴中心向外拉伸图像。
m12 : 以XY轴中心为中心,随着m12值由 0-->MAX 变大,图像顺时针方向在Y轴,做切变。随着m12值由 0-->MIN 变小,图像逆时针方向在Y轴,做切变。
名词介绍:
切变:两个距离很近、大小相等、方向相反的平行力作用于同一物体上所引起的形变。
m13 : 以X轴为中心的垂直线为界限,如果m13>0图像的左边将会被切掉 ; m13<0 图像的右边边将会被切掉。
m14 :以X轴为中心的垂直线为界限,随着m14值由 0-->MAX 变大,图像左侧向Z轴翻转,并做拉伸。随着m14值由 0-->MIN 变小,图像右边向Z轴翻转,做拉伸。
m21 :以XY轴中心为中心,随着m21值由 0-->MAX 变大,图像顺时针方向在X轴,做切变。随着m21值由 0-->MIN 变小,图像逆时针方向在X轴,做切变。
m22 : 以XY轴中心为中心,随着m22值由 1-->0 变小,图像向Y轴中心压缩;随着m22值由 1-->MAX 变大,图像以Y轴中心向外拉伸图像。
m23 : 以Y轴为中心的垂直线为界限,如果m23>0图像的上边将会被切掉 ; m23<0 图像的下边边将会被切掉。
m24 :以Y轴为中心的垂直线为界限,随着m24值由 0-->MAX 变大,图像上面向Z轴翻转,并做拉伸。随着m24值由 0-->MIN 变小,图像下面边向Z轴翻转,并做拉伸。
m31:和m13一起决定y轴的旋转
m32:和m23一起决定x轴的旋转
m33:z轴方向进行缩放
m34:透视效果m34= -1/D,D越小,透视效果越明显,必须在有旋转效果的前提下,才会看到透视效果
m41 : 让图像沿着X轴左右平移。m41>0 ,向右平移;m41<0 ,向左平移。
m42 : 让图像沿着Y轴上下平移。m42>0 ,向上平移;m41<0 ,向下平移。
m43 : 让图像沿着Z轴上下平移。m43>0 ,向上平移;m43<0 ,向下平移。
m44 : 图像的放大和缩小,当m44 由 MAX --> 0 放大;0--> 缩小。
*/
#pragma mark --- createImageView
-(void)createImageView
UIView * iview = [[UIView alloc]initWithFrame:CGRectMake(100, 160, 160, 140)];
iview.backgroundColor = [UIColor redColor];
[self.view addSubview:iview];
_imageView = (
UIImageView * imageView = [[UIImageView alloc]initWithFrame:CGRectMake(100, 160, 160, 140)];
imageView.image = [UIImage imageNamed:@"test.jpg"];
[self.view addSubview:imageView];
imageView;
);
#pragma mark --- createSlider
-(void)createSlider
_slider = [[UISlider alloc]initWithFrame:CGRectMake(10, self.view.frame.size.height-50, self.view.frame.size.width-20, 40)];
[_slider addTarget:self action:@selector(changeValue) forControlEvents:UIControlEventValueChanged];
[self.view addSubview:_slider];
-(void)changeValue
[self transformAffineTransform];
#pragma mark --- verdictDefaultTrans
-(void)verdictDefaultTrans:(CATransform3D)transform3D
if (CATransform3DIsIdentity(transform3D))
NSLog(@"默认矩阵,CATransform3DIdentity");
else
NSLog(@"矩阵发生变化");
/**
输出:
2017-04-13 15:43:50.432 立体效果之CATransform3D[2669:1457665] 默认矩阵,CATransform3DIdentity
2017-04-13 15:44:15.189 立体效果之CATransform3D[2669:1457665] 矩阵发生变化
*/
#pragma mark ---verdictEqualTrans:andTrans:
-(void)verdictEqualTrans:(CATransform3D)transform3D andTrans:(CATransform3D)transform3D1
if (CATransform3DEqualToTransform(transform3D, transform3D1))
NSLog(@"两个矩阵相等");
else
NSLog(@"两个矩阵不相等");
/**
输出:
2017-04-13 15:58:55.242 立体效果之CATransform3D[2702:1487783] 两个矩阵不相等
2017-04-13 15:59:34.279 立体效果之CATransform3D[2717:1492132] 两个矩阵相等
*/
#pragma mark --- translationTransTransX:transX:transY:transZ
-(void)translationTransTransX:(CGFloat)tX transY:(CGFloat)tY transZ:(CGFloat)tZ
/**
这个是改变矩阵的 m41 ~ m43 的值
发生图像的平移
*/
CATransform3D transform3D = CATransform3DIdentity;
transform3D = CATransform3DMakeTranslation(tX, tY, tZ);
[_imageView.layer setTransform:transform3D];
#pragma mark --- transMakeScaleSx:scaleSy:scaleSz
-(void)transMakeScaleSx:(CGFloat)sX scaleSy:(CGFloat)sY scaleSz:(CGFloat)sZ
/**
这是改变矩阵的 m11 / m22/ m33 ,来缩放图像
*/
CATransform3D transform3D = CATransform3DIdentity;
transform3D = CATransform3DMakeScale(sX, sY,sZ);
[_imageView.layer setTransform:transform3D];
#pragma mark --- transMakeRotationAngle:rotationX:rotationY:rotationZ
-(void)transMakeRotationAngle:(CGFloat)angle rotationX:(CGFloat)rX rotationY:(CGFloat)rY rotationZ:(CGFloat)rZ
/**
angle : 各个方向轴旋转的角度
类似于在各个方向上切变
*/
CATransform3D transform3D = CATransform3DIdentity;
transform3D = CATransform3DMakeRotation(angle,rX, rY,rZ);
[_imageView.layer setTransform:transform3D];
#pragma mark --- transformInvert
-(void)transformInvert:(CATransform3D)transform3D
/**
矩阵翻转
就是将原矩阵乘以
1 -1 1 -1
-1 1 -1 1
应用 CATransform3D 后的近似矩形?
3D 动画 - CABasicAnimation 和 CATransform3D 提供视图之间的差距
层变换矩阵(CATransform3D 等)但带有 IBDesignable?