從UIImage的矩陣變換看矩陣運算的原理

2021-06-06 16:34:02 字數 2424 閱讀 2781

1.矩陣的基本知識:

struct cgaffinetransform

;

cgaffinetransform cgaffinetransformmake(cgfloat a,cgfloat b,cgfloat c,cgfloat d,cgfloat tx,cgfloat ty);

為了把二維圖形的變化統一在乙個座標系裡,引入了齊次座標的概念,即把乙個圖形用乙個三維矩陣表示,其中第三列總是(0,0,1),用來作為座標系的標準。所以所有的變化都由前兩列完成。

以上引數在矩陣中的表示為:

|a    b    0|

|c    d    0|

|tx   ty   1|

運算原理:原座標設為(x,y,1);

|a    b    0|

[x,y,  1]      |c    d    0|     =     [ax + cy + tx   bx + dy + ty  1] ;

|tx    ty  1|

通過矩陣運算後的座標[ax + cy + tx   bx + dy + ty  1],我們對比一下可知:

第一種:設a=d=1, b=c=0. 

[ax + cy + tx   bx + dy + ty  1] = [x  + tx  y + ty  1];

可見,這個時候,座標是按照向量(tx,ty)進行平移,其實這也就是函式

cgaffinetransform cgaffinemaketranslation(cgfloat tx,cgfloat ty)的計算原理。

第二種:設b=c=tx=ty=0. 

[ax + cy + tx   bx + dy + ty  1] = [ax    dy   1];

可見,這個時候,座標x按照a進行縮放,y按照d進行縮放,a,d就是x,y的比例係數,其實這也就是函式

cgaffinetransform cgaffinetransformmakescale(cgfloat sx, cgfloat sy)的計算原理。a對應於sx,d對應於sy。

第三種:設tx=ty=0,a=cosɵ,b=sinɵ,c=-sinɵ,d=cosɵ。

[ax + cy + tx   bx + dy + ty  1] = [xcosɵ - ysinɵ    xsinɵ + ycosɵ  1] ;

可見,這個時候,ɵ就是旋轉的角度,逆時針為正,順時針為負。其實這也就是函式

cgaffinetransform cgaffinetransformmakerotation(cgfloat angle)的計算原理。angle即ɵ的弧度表示。

2.利用上面的變換寫乙個uiimage矩陣變換的例子:

下面是乙個關於image的矩陣運算的例子,無外乎是運用以上三種變換的組合,達到所定義的效果:

//uiimageorientation的定義,定義了如下幾種變換

typedef enum

uiimageorientation;

//按照uiimageorientation的定義,利用矩陣自定義實現對應的變換;

-(uiimage *)transformimage:(uiimage *)aimage

uigraphicsbeginimagecontext(bounds.size);

cgcontextref context = uigraphicsgetcurrentcontext();

if (orient == uiimageorientationright || orient == uiimageorientationleft)

else

cgcontextconcatctm(context, transform);

cgcontextdrawimage(uigraphicsgetcurrentcontext(), cgrectmake(0, 0, width, height), imgref);

uiimage *imagecopy = uigraphicsgetimagefromcurrentimagecontext();

uigraphicsendimagecontext();

return imagecopy;

}

掌握矩陣運算的原理,對檢視的矩陣操作便會得心應手,巧妙利用旋轉,平移,縮放,組合起來達到你所想要的變換效果!

從UIImage的矩陣變換看矩陣運算的原理

1.矩陣的基本知識 struct cgaffinetransform cgaffinetransform cgaffinetransformmake cgfloat a,cgfloat b,cgfloat c,cgfloat d,cgfloat tx,cgfloat ty 為了把二維圖形的變化統一在...

從UIImage的矩陣變換看矩陣運算的原理

1.矩陣的基本知識 struct cgaffinetransform cgaffinetransform cgaffinetransformmake cgfloat a,cgfloat b,cgfloat c,cgfloat d,cgfloat tx,cgfloat ty 為了把二維圖形的變化統一在...

從UIImage的矩陣變換看矩陣運算的原理

1.矩陣的基本知識 struct cgaffinetransform cgaffinetransform cgaffinetransformmake cgfloat a,cgfloat b,cgfloat c,cgfloat d,cgfloat tx,cgfloat ty 為了把二維圖形的變化統一在...