Quartz 2d中的圖形變換

我們已經知道,你的應用程序在用戶空間的與分辨率無關的圖形環境中構建圖形,在計算機在設備上生成圖形之前,它必須首先將圖形移到設備空間中。計算機使用一種變換工具將圖形從一個座標系統移到另外一個座標系統中。

Quartz 2D包括一系列用於創建和組合的變換工具。你的應用程序可以利用這些工具可以大大簡化你的繪圖過程。通常的做法是選擇一個便利的座標系統去繪製你的圖形。然後你可以使用Quartz 2D API中的一些工具創建變換,建立座標系統。用這種方式使用變換會花費一些時間,但是一旦你做了之後,你就會驚訝地發現以前沒有它們我們是怎樣進行繪圖的。

許多計算機圖形庫使用矩陣描述變換,Quartz 2D也不例外。像其他的圖形庫一樣,它用使用線性代數去進行變換一些幾何物體像點,矩形,線。

The Basic Transformations

當你考慮變換的時候,你可以使用兩種不同的方式思考它們。一種是你考慮給一系列的物體應用一種轉換去改變這些物體的幾何形狀。用修改後的幾何體在一個新的位置上重新繪製這些物體。如下圖所示:


在上圖中,左邊時原始物體,經過逆時針旋轉這個物體,然後將它向上和向右移動,變換成爲右邊的物體。在座標系統固定的情形下去改變圖形。

除了去變換圖形外,你也可以變換座標系統

當變換一個座標系統時,相比之下,你必須有另外一個座標系統。這種變換提供了一種從一個座標系統變換到另外一個座標系統的映射。如下圖所示:


Affine Transform

Quartz 2D並不支持任意的圖形變換。Quartz 2D支持的變換被稱爲放射變換。你可以結合簡單的仿射變換生成更加複雜的圖形。Quartz 2D支持的三種基本的變換類型Translations, Rotations, and Scalings。我們將會分別簡單介紹然後將如何使用Quartz 2D API去進行結合。

Translations

Translations就是把一個物體從一個位置移到另外一個位置。如下圖所示:


Translations變換中,你的代碼中需要指定你想應用在xy方向的偏移量。

Rotations

Rotations允許你改變一個圖形的方向,或者改變兩個座標系的相對位置。基本的旋轉仿射矩陣是圍繞着原點旋轉的。如下圖所示:


rotation中,你需要想計算機提供你想要旋轉物體或者軸的角度值。在Quartz 2D中,角度的測量方法如下圖所示:


角度和弧度的轉換公式如下:


degrees (角度),radians(弧度)。

Scaling

Scaling就是讓一個圖形變大或者變小。如下圖所示:


Quartz 2D中,你需要分別爲座標軸提供比例因子。在上圖中,我們將y軸的每個單元擴大了2.25倍,x軸的每個單元擴大了1.5倍。

當你在座標軸上擴大的值是負值的時候,就會出現一個有趣的現象。它不僅僅改變了每個單元的相對刻度,也改變了相應座標軸的方向。

Concatenating Transformations

組合變換,Quartz 2D使用矩陣乘法,將一系列連鎖的變換映射到單個矩陣上。如下圖所示:


我們結合了三種不同的變換完成了旋轉。圖a顯示了一張圖形(一把雨傘)的初始位置。目標就是圍繞着它的中心將它旋轉30°。然而旋轉僅僅圍繞着原點旋轉,所以我們需要使用一種變換將它放到原點位置圖b,然後旋轉它圖c,最後用另一種變換技術將它移到最初的位置圖d

如果雨傘的中心點在(100,100),下面的代碼片段描述了這種變換:

CGAffineTransform affineTransform = CGAffineTransformIdentity;

affineTransform = CGAffineTransformConcat(

                   affineTransform,

                   CGAffineTransformMakeTranslation(-100, -100));

affineTransform = CGAffineTransformConcat(

                   affineTransform,

                   CGAffineTransformMakeRotation(pi / 6));

affineTransform = CGAffineTransformConcat(

                   affineTransform,

                   CGAffineTransformMakeTranslation(100, 100));

 

CGPathRef transformedPath = CopyPathWithTransformation(

                   umbrellaPath, affineTransform);

The Order Matters

當你在進行組合變換時,你必須以一個合適的順序進行。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章