最近在看《iOS 6 Programming Cookbook》的翻譯版叔营,它由DevDiv論壇的網(wǎng)友翻譯鸿吆,原文地址:點擊跳轉(zhuǎn)雷滚。由于下載的pdf都有水印钙态,并且排版不是很好慧起,特別是代碼排版,基本不能看册倒,所以這里就整理了一下蚓挤,方便再次查看。另外把里面提到的點寫了一個demo驻子,由于里面一些代碼現(xiàn)在已經(jīng)廢棄灿意,所以demo中都是用的新api,下載地址在這里:圖形與動畫Demo崇呵。
1.10 移動圖形環(huán)境上所繪制的形狀
你想移動被繪制到圖形環(huán)境上的一切,到一個新的位置,而不需要修改你的繪圖代碼缤剧。或者你只是想輕易的移動你的圖形環(huán)境域慷。
使用 CGAffineTransformMakeTranslation
函數(shù)創(chuàng)建一個仿射位移變換(`affine translation transformation)荒辕。
變換。顧名思義:就是改變圖形顯示的方式芒粹。變換在core graphics中是圖形在繪制前被應用的一些對象兄纺。比如,你可以創(chuàng)建一個位移變換。移動什么,你可能會問?一個位移變換是一種讓你能移動形狀或圖形環(huán)境的機制化漆。
其他類型的變換包含旋轉(zhuǎn)和縮放這些都是仿射變換的例子,仿射變換會在最終版本中將原來的每個點映射到另一個點估脆。
位移變換能將路徑或圖形環(huán)境上的形狀的當前位置移動到另一個相對的位置。比如說, 你在(10,20)畫了一個點,對其使用了(30,40)的仿射變換,然后再畫它,這個點會被 畫到(40,60),因為 10+30 的和為 40,20+40 的和為 60座云。
為了創(chuàng)建一個新的位移變換,我們必須使用 CGAffineTransformMakeTranslation
函數(shù), 它會返回一個 CGAffineTransform
類型的仿射變換疙赠。此函數(shù)的兩個參數(shù)指定了以點為單位的 x 和 y 方向上的位移。
在 1.7 小節(jié)中,我們看見了 CGPathAddRect
過程的第二個參數(shù)是一個 CGAffineTransform
類型的變換對象朦拖。為了從原始位置向另一個位置移動矩形,你只要創(chuàng)建 一個放射變換,并指定你希望的 x 和 y 軸的位移,并將變換作為第二個參數(shù)傳入 CGPathAddRect
,如下:
- (void)drawRect:(CGRect)rect
{
//創(chuàng)建一個新的 CGMutablePathRef 類型的可變路徑
CGMutablePathRef path = CGPathCreateMutable();
CGRect rectrangle = CGRectMake(10.0, 70, 200, 300);
CGAffineTransform transform = CGAffineTransformMakeTranslation(100, 0);
//向路徑添加一個矩形
CGPathAddRect(path, &transform, rectrangle);
//獲取當前圖形上下文
CGContextRef currentContext = UIGraphicsGetCurrentContext();
//向圖形環(huán)境上添加一個路徑
CGContextAddPath(currentContext, path);
UIColor *color = [UIColor colorWithRed:0.20f
green:0.60f
blue:0.80f
alpha:1.0f];
//設置填充顏色為淺藍色
[color setFill];
//將筆觸顏色設置為棕色
[[UIColor brownColor] setStroke];
//設置線的寬度
CGContextSetLineWidth(currentContext, 5.0);
//在圖形上下文繪制路徑
CGContextDrawPath(currentContext, kCGPathFillStroke);
//釋放路徑所分配的內(nèi)存
CGPathRelease(path);
}
效果如下:
比較圖 7-1(圖形與動畫(二))) 和圖10-1 .你能發(fā)現(xiàn)不同點嗎?檢查這兩個圖形的代碼,你會發(fā)現(xiàn)每個代碼塊中的矩形所指定的 x 和 y 點是相同的圃阳。只不過在圖 10-1 中,我們在將矩形加到路徑中時,對矩形應用了仿射位移變換。
除了向繪制到路徑中的形狀應用變換之外,我們還可以使用 CGContextTranslateCTM
過程對圖形環(huán)境應用變換璧帝。這會在當前變換矩陣(CTM)上應用位移變換捍岳。當前的變換矩陣,雖然聽起來很復雜,其實很容易理解。你可以將 CTM 當作你的圖形環(huán)境的中心如何被設置,而你繪制的每個點又是如何投射到屏幕上的工具。比如說,當你要求core graphics
在(0,0)點繪圖時,core graphics
查看CTM來得到屏幕的中心锣夹。CTM會做一些計算然后告訴 core graphics
(0,0)這點確實是在屏幕的左上角页徐。使用如 CGContextTranslateCTM
這樣的過程函數(shù),你可以修改 CTM 的配置,從而改變圖形環(huán)境上的每個形狀,使他們繪制到畫布上的另一個位置。下面的例子中,我們能通過對 CTM 應用位移變換而不是直接對矩形操作,而得到和圖 10-1 完全相同的屏幕:
- (void)drawRect:(CGRect)rect
{
/* Create the path first. Just the path handle. */
CGMutablePathRef path = CGPathCreateMutable();
/* Here are the rectangle boundaries */
CGRect rectangle = CGRectMake(10.0f, 10.0f, 200.0f, 300.0f);
/* Add the rectangle to the path */
CGPathAddRect(path, NULL, rectangle);
/* Get the handle to the current context */
CGContextRef currentContext = UIGraphicsGetCurrentContext();
/* Save the state of the context to revert
back to how it was at this state, later */
CGContextSaveGState(currentContext);
/* Translate the current transformation matrix to the right by 100 points */
CGContextTranslateCTM(currentContext, 100.0f, 0.0f);
/* Add the path to the context */
CGContextAddPath(currentContext, path);
/* Set the fill color to cornflower blue */
[[UIColor colorWithRed:0.20f
green:0.60f
blue:0.80f
alpha:1.0f] setFill];
/* Set the stroke color to brown */
[[UIColor brownColor] setStroke];
/* Set the line width (for the stroke) to 5 */
CGContextSetLineWidth(currentContext,
5.0f);
/* Stroke and fill the path on the context */
CGContextDrawPath(currentContext, kCGPathFillStroke);
/* Dispose of the path */
CGPathRelease(path);
/* Restore the state of the context */
CGContextRestoreGState(currentContext);
}
1.11 縮放繪制到圖形環(huán)境上的形狀
動態(tài)的縮放你圖形環(huán)境上的形狀银萍。
使用 CGAffineTransformMakeScale
函數(shù)創(chuàng)建一個仿射縮放變換变勇。
和1.10節(jié)類似,只需將變換方式修改為CGAffineTransformMakeScale
即可贴唇。效果圖11-1搀绣,
注意:這里x,y坐標均有縮放。
1.12 旋轉(zhuǎn)繪制在圖形環(huán)境上的形狀
要旋轉(zhuǎn)圖形環(huán)境上的內(nèi)容,而不改變繪圖代碼戳气。
使用 CGAffineTransformMakeRotation
函數(shù)來創(chuàng)建一個仿射旋轉(zhuǎn)變換链患。
將矩形旋轉(zhuǎn)45°,很簡單瓶您,和1.10節(jié)類似锣险,只需將變換方式修改為CGAffineTransformMakeRotation
即可。效果圖12-1览闰,