iOS開發之仿射變換示例總結

本篇博客比較簡單，但仍是比較實用的。其中的示例依然使用Swift3.0來實現，該博客算是下篇博客的一個引子，由於咱們下篇博客要介紹使用Swift開發iOS應用中經常使用的一些Extension。而在這些Extension中的Image Extension中會用到仿射變換的東西來對圖片進行處理。因此本篇博客就先將fang放射變換（CGAffineTransform）的東西拎出來單獨的過一下，這樣在下篇博客中就能夠減小對仿射變換的介紹了。

在以前的博客中，咱們聊過仿射變換的東西，不過是使用的放射變換來實現的動畫，關於該部份內容請移步於《iOS開發之各類動畫各類頁面切面效果》。以前的博客主要講述了CATransition，而本篇博客主要聊的內容是CGAffineTransform。固然本篇博客的內容依然是依託於相關的示例，該示例對應的源代碼會在github上進行分享，博文結尾處爲github源碼分享連接。雖然今天博客中的代碼以及示例都比較簡單，可是仍是有必要單獨拎出來介紹一下的。

 

1、平移

接下來咱們來看一下CGAffineTransform的平移，在使用CGAffineTransform進行平移的時候，咱們要注意座標系的轉換。下方是咱們在作UI佈局時的座標系，也就是iOS屏幕的座標系。左上角是原點，x軸右爲正，左爲負，y軸上爲負，下爲正。下方就是iPhone的屏幕座標系。平移時也是採用下方的座標系結構。

 

下方就是對ImageView的平移的效果。分別使用兩個Slider來控制左右移動和上下移動。具體運行效果以下所示。

　　

控制平移的代碼也是比較簡單的，以下所示。x參數爲正時則向右移動，x爲負數時，向左移動。而參數y爲正時，向下移動，y爲負值時向上運動。具體代碼以下所示：

 　　

 

2、縮放

聊完平移，接下來我咱們來看一下仿射變換的縮放。使用CGAffineTransform進行View的縮放也是比較簡單的，下方就是對ImageView進行縮放的運行效果。在縮放的過程當中分爲x方向上的縮放和y方向的縮放。x和y分別表示在x軸和y軸上縮放的倍數，若是x或者y爲負數的話，那麼將相應的視圖翻轉後在進行縮放，運行效果以下所示。

　　

實現上述效果也是比較簡單的，代碼就下方一行，以下所示，x就表示x軸上的縮放量，y就表示y軸上的縮放量。

　　

 

 

3、旋轉

接下來就來聊聊CGAffineTransform的旋轉，直奔主題，下方就是旋轉的運行結果。旋轉是是按照弧度進行旋轉的，一圈是0-2∏，若是弧度爲正，則是順時針旋轉，若是弧度爲負，則是逆時針旋轉。具體運行結果以下所示：

　　

實現上述效果的代碼也是比較簡單的，具體代碼以下所示：

　　

 

本篇博客的內容就介紹完了，下方是本篇博客所涉及Demo的github源碼分享連接。

github分享連接：https://github.com/lizelu/CGAffineTransformDemo