Core Graphics是基於C的API，可以用於一切繪圖操作
Core Graphics 和Quartz 2D的區別
quartz是一個通用的術語，用於描述在iOS和MAC
OS X ZHONG 整個媒體層用到的多種技術 包括圖形、動畫、音頻、適配。
Quart 2D 是一組二位繪圖和渲染API，Core Graphic會使用到這組API
Quartz Core 專指Core Animation用到的動畫相關的庫、API和類
點和像素的對比
系統擁有座標系，如320*480 硬件有retain屏幕和非retain屏：如320*480、640*960
Core Graphics 使用的是系統的座標系來繪製圖片。在分辨率爲640*960手機上繪製圖片時，實際上Core Graphics 的座標是320*480。這個時候每個座標系上的點，實際上擁有兩個像素。
圖形上下文
Core Graphics 使用圖形上下文進行工作，這個上下文的作用像畫家的畫布一樣。
在圖形上下文之外是無法繪圖的，我們可以自己創建一個上下文，但是性能和內存的使用上，效率是非常低得。
我們可以通過派生一個UIView的子類，獲得它的上下文。在UIView中調用drawRect：方法時，會自動準備好一個圖形上下文，可以通過調用
UIGraphicsGetCurrentContext（）來獲取。 因爲它是運行期間繪製圖片，我們可以動態的做一些額外的操作
Core Graphics的優點
快速、高效，減小應用的文件大小。同時可以自由地使用動態的、高質量的圖形圖像。 使用Core Graphics，可以創建直線、路徑、漸變、文字與圖像等內容，並可以做變形處理。
繪製自定義視圖
drawRect:是系統的方法，不要從代碼裏面直接調用 drawRect：，而應該使用setNeedsDisplay重繪.
需要知道的術語
- 路徑 path
- 陰影 shadow
- 筆畫 stroke
- 剪裁路徑 Clip Path
- 線條粗細 Line Width
- 混合模式 Blend Mode
- 填充色 Fill Color
- 當前形變矩陣 Current Transform Matrix
- 線條圖案 Line Dash
圖形上下文棧
一個圖形上下文好比是畫布上的一副扁平的圖畫 執行繪畫動作，這些動作是在同一個圖層上完成的。 圖形上下文不允許將內容分不到多個圖層中，如果有需求在不同圖層上畫，可以考慮使用視圖層次結構，創建多個UIView，並將他們作爲父視圖的子視圖
圖形上下文棧可以把圖形上下文的當前狀態保存下來，並在執行一些動作後再次恢復回來
CGContextSaveGState();
CGContextStoreGState();
路徑、漸變、文字和圖像
1. 使用UIBezierPath創建路徑
2. 手動創建路徑 moveToPoint addLineToPoint addArcWithCenter addCurveToPoint
漸變，漸變可以在指定方向上，以可變的比率在一系列顏色之間轉化
線性漸變：沿着一條定義好了起點和重點的直線方向，呈線性變化。如果這條線有一定角度，線性漸變也會沿相同路徑變化
放射漸變：顏色順着兩個原型之間的方向線性變化，這兩個園爲起始圓和終止圓，每隔圓都有自己的圓心和班級
文字
darwAtPoint
drawInRect
圖像
Core Graphics 不會保持圖像的長寬比例，Core Graphics會將圖像的邊界設置爲CGrect，不管圖片是否變形 darwAtPoint drawInRect
生成自定義的視圖
-
- (void)drawRect:(CGRect)rect
-
{
-
-
-
CGContextRef context = UIGraphicsGetCurrentContext();
-
CGContextSetStrokeColorWithColor(context, [UIColor whiteColor].CGColor);
-
-
NSString *str1 = @"畫線";
-
[self drawText:str1 atPoint:CGPointMake(20.0, 20.0) FontSize:15];
-
[self drawLineOnContext:context FromPoint:CGPointMake(20.0, 40.0) toPoint:CGPointMake(300.0, 40.0)];
-
-
NSString *str2 = @"畫多邊形和陰影和填充顏色";
-
[self drawText:str2 atPoint:CGPointMake(20.0, 50.0) FontSize:15];
-
-
UIBezierPath *btnPath = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(20.0, 70.0, 280.0, 50) cornerRadius:4];
-
-
do {
-
CGContextSaveGState(context);
-
-
CGContextSetShadowWithColor(context, CGSizeMake(-1, -1), 3.0, [UIColor whiteColor].CGColor);
-
CGContextAddPath(context, btnPath.CGPath);
-
CGContextFillPath(context);
-
CGContextRestoreGState(context);
-
} while (0);
-
-
-
CGContextSetShadow(context, CGSizeMake(2, 2), 10);
-
-
CGContextSetFillColorWithColor(context, [UIColor redColor].CGColor);
-
-
[[UIColor blackColor]setStroke];
-
-
-
[btnPath fill];
-
-
NSString *str3 = @"漸變填充顏色";
-
-
CGContextSetShadow(context, CGSizeMake(0, 0), 0);
-
[self drawText:str3 atPoint:CGPointMake(20.0, 130.0) FontSize:15];
-
-
-
CGContextSaveGState(context);
-
CGRect newRect = CGRectMake(40.0, 150, 240, 50);
-
UIBezierPath *newPath = [UIBezierPath bezierPathWithOvalInRect:newRect];
-
-
[newPath addClip];
-
-
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
-
NSArray *colors = @[(__bridge id)[UIColor colorWithRed:0.3 green:0.0 blue:0.0 alpha:0.2].CGColor,
-
(__bridge id)[UIColor colorWithRed:0.0 green:0.0 blue:1.0 alpha:0.8].CGColor];
-
const CGFloat locations[] = {0.0, 1.0};
-
CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef)colors, locations);
-
CGContextDrawLinearGradient(context, gradient, CGPointMake(40.0, 150.0), CGPointMake(280.0, 200.0), 0);
-
-
CGContextRestoreGState(context);
-
-
-
NSString *str4 = @"當前形變矩陣CTM";
-
[self drawText:str4 atPoint:CGPointMake(20.0, 220.0) FontSize:15];
-
-
CGContextTranslateCTM(context, 0, rect.size.height);
-
CGContextScaleCTM(context, 1.0, -1.0);
-
-
-
CFRelease(colorSpace);
-
CFRelease(gradient);
-
}
效果圖如下
![]()
有助於Core Graphics 的第三方工具：
有代碼工具 PaintCode 可以生成相應的
Core Graphics 代碼，可以大大加快我們的開發效率。如下圖
![]()
Demo 下載地址：https://github.com/caigee/iosdev_sample
下的DemoCoreGraphics
