概述
CATransform3D是一個用于處理3D形變的類,其可以改變控件的平移、縮放、旋轉(zhuǎn)、斜交等,其坐標(biāo)系統(tǒng)采用的是三維坐標(biāo)系,即向右為x軸正方向,向下為y軸正方向,垂直屏幕向外為z軸正方向
在CALayer中有一個transform屬性便是專門用來控制3D形變的,其使用方法如下
樣例素材
在介紹CALayer形變的過程中,我們會使用一個UIImageView圖片為例,對各動畫效果進(jìn)行演示
@property (nonatomic, strong) UIImageView *demoImageView;
- (void)viewDidLoad
{
[super viewDidLoad];
self.demoImageView = [[UIImageView alloc] initWithFrame:CGRectMake(20, 20, [[UIScreen mainScreen] bounds].size.width-40, [[UIScreen mainScreen] bounds].size.height-40)];
self.demoImageView.image = [UIImage imageNamed:@"demo"];
[self.view addSubview:self.demoImageView];
}
方法介紹
- CATransform3DMakeTranslation實(shí)現(xiàn)以初始位置為基準(zhǔn),在x軸方向上平移x單位,在y軸方向上平移y單位,在z軸方向上平移z單位
// 格式
CATransform3DMakeTranslation (CGFloat tx, CGFloat ty, CGFloat tz)
// 樣例
self.demoImageView.layer.transform = CATransform3DMakeTranslation(100, 100, 0);
注: 注: 當(dāng)tx為正值時,會向x軸正方向平移,反之,則向x軸負(fù)方向平移;當(dāng)ty為正值時,會向y軸正方向平移,反之,則向y軸負(fù)方向平移;當(dāng)tz為正值時,會向z軸正方向平移,反之,則向z軸負(fù)方向平移
- CATransform3DMakeScale實(shí)現(xiàn)以初始位置為基準(zhǔn),在x軸方向上縮放x倍,在y軸方向上縮放y倍,在z軸方向上縮放z倍
// 格式
CATransform3DMakeScale (CGFloat sx, CGFloat sy, CGFloat sz)
// 樣例
self.demoImageView.layer.transform = CATransform3DMakeScale(2, 0.5, 1);
注: 當(dāng)sx為正值時,會在x軸方向上縮放x倍,反之,則在縮放的基礎(chǔ)上沿著豎直線翻轉(zhuǎn);當(dāng)sy為正值時,會在y軸方向上縮放y倍,反之,則在縮放的基礎(chǔ)上沿著水平線翻轉(zhuǎn)
- CATransform3DMakeRotation實(shí)現(xiàn)以初始位置為基準(zhǔn),在x軸,y軸,z軸方向上
逆
時針旋轉(zhuǎn)angle弧度(弧度=π/180×角度,M_PI弧度代表180角度),x,y,z三個參數(shù)只分是否為0
// 格式
CATransform3DMakeRotation (CGFloat angle, CGFloat x, CGFloat y, CGFloat z)
// 樣例
self.demoImageView.layer.transform = CATransform3DMakeRotation(M_PI*0.25, 0, 0, 1);
注: 當(dāng)x,y,z值為0時,代表在該軸方向上不進(jìn)行旋轉(zhuǎn),當(dāng)值為1時,代表在該軸方向上進(jìn)行
逆
時針旋轉(zhuǎn),當(dāng)值為-1時,代表在該軸方向上進(jìn)行順
時針旋轉(zhuǎn)
- CATransform3DTranslate實(shí)現(xiàn)以一個已經(jīng)存在的形變?yōu)榛鶞?zhǔn),在x軸方向上平移x單位,在y軸方向上平移y單位,在z軸方向上平移z單位
// 格式
CATransform3DTranslate (CATransform3D t, CGFloat tx, CGFloat ty, CGFloat tz)
// 樣例
CATransform3D transform = CATransform3DIdentity;
transform.m34 = -1.0/500;
self.demoImageView.layer.transform = CATransform3DTranslate(transform, 0, 0, 100);
- CATransform3DScale實(shí)現(xiàn)以一個已經(jīng)存在的形變?yōu)榛鶞?zhǔn),在x軸方向上縮放x倍,在y軸方向上縮放y倍,在z軸方向上縮放z倍
// 格式
CATransform3DScale (CATransform3D t, CGFloat sx, CGFloat sy, CGFloat sz)
// 樣例
CATransform3D transform = CATransform3DIdentity;
transform.m34 = -1.0/500;
self.demoImageView.layer.transform = CATransform3DScale(transform, 2, 0.5, 1);
- CATransform3DRotate實(shí)現(xiàn)以一個已經(jīng)存在的形變?yōu)榛鶞?zhǔn),在x軸,y軸,z軸方向上
逆
時針旋轉(zhuǎn)angle弧度(弧度=π/180×角度,M_PI弧度代表180角度),x,y,z三個參數(shù)只分是否為0
// 格式
CATransform3DRotate (CATransform3D t, CGFloat angle, CGFloat x, CGFloat y, CGFloat z)
// 樣例
CATransform3D transform = CATransform3DIdentity;
transform.m34 = -1.0/500;
self.demoImageView.layer.transform = CATransform3DRotate(transform, M_PI*0.25, 1, 0, 0);
- 特殊地,transform屬性默認(rèn)值為CATransform3DIdentity,可以在形變之后設(shè)置該值以還原到最初狀態(tài)
// 樣例
self.demoImageView.layer.transform = CATransform3DIdentity;
關(guān)于結(jié)構(gòu)體中的m34
在默認(rèn)情況下,系統(tǒng)采用正交投影,對于3D形變實(shí)際上是看不到3D效果的,在CATransform3D結(jié)構(gòu)體中有一個m34便允許我們將正交投影修改為有近大遠(yuǎn)小立體效果的透視投影,其中m34 = -1.0/z,這個z為觀察者與控件之間的距離
注: m34必須在賦值transform之前設(shè)置才會生效