關(guān)于CGAffineTransform蘋(píng)果的定義是這樣的
image.png
- CGAffineTransform用于繪制2D圖形的一個(gè)仿射變換矩陣
- 用于做旋轉(zhuǎn)波桩、縮放竹揍、平移呕寝,一個(gè)仿射變換矩陣 (是一個(gè)3*3的矩陣)
- 它采用的是二維坐標(biāo)系( 即向右為x軸正方向,向下為y軸正方向)
3x3的矩陣
CGAffineTransform提供了這樣一個(gè)函數(shù)
CGAffineTransform CGAffineTransformMake (CGFloat a,CGFloat b,CGFloat c,CGFloat d,CGFloat tx,CGFloat ty);
其中tx用來(lái)控制在x軸方向上的平移
ty用來(lái)控制在y軸方向上的平移
a用來(lái)控制在x軸方向上的縮放
d用來(lái)控制在y軸方向上的縮放
abcd共同控制旋轉(zhuǎn)
為了把二維圖形的旋轉(zhuǎn)达舒、縮放只嚣、平移變化統(tǒng)一在一個(gè)坐標(biāo)系里,引入了齊次坐標(biāo)的概念,即把一個(gè)圖形用一個(gè)三維矩陣表示,其中第三列總是(0,0,1),用來(lái)作為坐標(biāo)系的標(biāo)準(zhǔn)灿渴。所以所有的變化都由前兩列完成.
矩陣算法公式:
矩陣算法公式
說(shuō)明: 原坐標(biāo)設(shè)為(x,y,1);
image.png
計(jì)算公式
上圖中的tx 和ty 記做 t小x 洛波,t小y
|a b 0|
[x,y,1] |c d 0| = [ax+cy+t小x bx+dy+t小y 1] ;
|tx ty 1 |
通過(guò)矩陣運(yùn)算后的坐標(biāo)[ax+cy+t小x bx+dy+t小y 1]
看個(gè)栗子
我修改第二個(gè)View的transform中a的值為0.2:
創(chuàng)建兩個(gè)同樣大小寬高都是100位置相同的View,上面的為天藍(lán)色骚露,下面是草綠色蹬挤,修改天藍(lán)色視圖的transform中a的值為0.3 d的值為 0.5 即CGAffineTransformMake(0.2,0,0,0.5,0,0);
圖一是沒(méi)有改變的原圖
image.png
因?yàn)閍和d是控制縮放,所以根據(jù)矩陣公式計(jì)算
x` = ax + cy + t小x = 0.5 * 100 + 0 * 100 + 0 = 50
y` = bx + dy + t.y = 0 * 100 + 0.5 * 100 + 0 = 50
- x按照a值進(jìn)行了比例縮放
- y按照d的值進(jìn)行比列縮放
- 最重要的是縮放的過(guò)程中View的point(中心點(diǎn))是不會(huì)改變的
看下平移 CGAffineTransformMake(0.5,0,0,0.5,50,50)
image.png
- 當(dāng)tx為正值時(shí),會(huì)向x軸正方向平移 (向右)棘幸,反之,則向x軸負(fù)方向平移(向左)
- 當(dāng)ty為正值時(shí),會(huì)向y軸正方向平移(向下)焰扳,反之,則向y軸負(fù)方向平移(向上)
看一下旋轉(zhuǎn)
先看下這個(gè)函數(shù)
CGAffineTransform CGAffineTransformMakeRotation(CGFloat angle)
- 該函數(shù)實(shí)現(xiàn)以初始位置為基準(zhǔn),將坐標(biāo)系統(tǒng)逆時(shí)針旋轉(zhuǎn)
angle弧度
- 弧度計(jì)算公式: 弧度=π/180 × 角度
- 程序中 M_PI = π
- M_PI弧度 =》代表180角度 (180度)
CGAffineTransformMakeRotation(M_PI * 0.25)
因?yàn)镸_PI弧度 表示180度
所以(M_PI * 0.25)弧度 45度
所以(M_PI * 0.25)逆時(shí)針旋轉(zhuǎn)(M_PI * 0.25)弧度就等于 逆時(shí)針旋轉(zhuǎn)45度
image.png
CGAffineTransformRotate實(shí)現(xiàn)以一個(gè)已經(jīng)存在的形變?yōu)榛鶞?zhǔn),將坐標(biāo)系統(tǒng)逆時(shí)針旋轉(zhuǎn)angle弧度(弧度=π/180×角度,M_PI弧度代表180角度)
CGAffineTransform transform = CGAffineTransformMakeRotation(M_PI*0.25);
self.demoImageView.transform = CGAffineTransformRotate(transform, M_PI*0.25);
transform屬性默認(rèn)值為CGAffineTransformIdentity,可以在形變之后設(shè)置該值以還原到最初狀態(tài)
旋轉(zhuǎn)公式 : t' = [ cos(angle) sin(angle) -sin(angle) cos(angle) 0 0 ]
CGAffineTransformMake(cos(M_PI * 0.25), sin(M_PI * 0.25), -sin(M_PI * 0.25), cos(M_PI * 0.25), 0, 0)
image.png