一 、前言
iOS开发中我们经常会使用UIButton，UILabel等，这些简单的api可以让我们很快完成常规界面的开发。如果碰到一些需要自定义的界面，我们肯定需要自己绘制。今天就学习记录下iOS中关于绘制的框架CoreGraphics。
二、介绍
Core Graphics是基于Quartz 2D的一个高级绘图引擎，常用于iOS，tvOS，macOS的图形绘制应用开发。Core Graphics是对底层C语言的一个简单封装，其中提供大量的低层次，轻量级的2D渲染API。
系统的绘图框架
- UIKit
我们平常最常用的就是UIKit，其底层是依赖CoreGraphics实现的，而且绝大多数的图形界面也都是由UIKit完成，像UILabel、UIButton、UIBezierPath、UIColor简单的使用他们提供的API就能绘制到界面上，底层也是基于CoreGraphics实现。 - Core Animation
提供了强大的2D和3D动画服务，它也与UIView高度集成。iOS中的动画都是基于它实现。 - CoreGraphics
这就是本文介绍的重点，iOS中使用最多的绘图框架，常用于绘制自定义视图，纯C的API，使用Quartz2D做引擎。Core Graphics数据结构和函数可以通过CG前缀来识别。 - OpenGL-ES
这也是一套绘图框架，它是一套编程规范，具体实现由各平台自己完成。所以它是跨平台的，常用于游戏绘制。
CoreGraphics的坐标系
UIKit的坐标与Core Graphics的坐标是不一样的，UIKit的坐标默认原点在左上角，而Core Graphics的原点在左下角。通过两个坐标系之间是需要转化后才能使用的。
那为什么我们在drawRect方法中使用CoreGraphics方法绘制内容的时候可以使用UIKit的坐标系？
因为iOS系统在drawRect返回CGContext的时候，默认帮我们进行了一次变换，以方便开发者直接用UIKit坐标系进行渲染。
三、使用
-
使用须知
在介绍具体使用之前，我们需要知道，iOS的绘图必须在上下文中绘制，所以绘制前必须先获取上下文。如果是绘制图片，则先获取一个图片上下文，如果是其他视图，就需要获取一个非图片上下文。上下文可以理解为画布，在上面进行绘图。
图形上下文（注意不是图片）context，在drawRect方法中通过UIGraphicsGetCurrentContext获取。
图片上下文imageContext (不必在drawRect方法中)，通过UIGraphicsBeginImageContextWithOptions:获取，然后绘制完成后，调用UIGraphicsGetImageFromCurrentImageContext获取绘制的图片，最后要记得关闭图片上下文UIGraphicsEndImageContext。
-
使用方法
1、图片上下文使用
图片类型的上下文，不需要在drawRect方法中，在普通的oc方法中就可以进行绘制：
使用Core Graphics绘制
// 获取图片上下文
UIGraphicsBeginImageContextWithOptions(CGSizeMake(60,60), NO, 0);
// 绘图
CGContextRef con = UIGraphicsGetCurrentContext();
CGContextAddEllipseInRect(con, CGRectMake(0,0,60,60));
CGContextSetFillColorWithColor(con, [UIColor blueColor].CGColor);
CGContextFillPath(con);
// 从图片上下文中获取绘制的图片
UIImage* image = UIGraphicsGetImageFromCurrentImageContext();
// 关闭图片上下文
UIGraphicsEndImageContext();
使用UIKit绘制
// 获取图片上下文
UIGraphicsBeginImageContextWithOptions(CGSizeMake(60,60), NO, 0);
// 绘图
UIBezierPath* p = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0,0,60,60)];
[[UIColor blueColor] setFill];
[p fill];
// 从图片上下文中获取绘制的图片
UIImage* image = UIGraphicsGetImageFromCurrentImageContext();
// 关闭图片上下文
UIGraphicsEndImageContext();
2、图形上下文使用
在view的drawRect方法中，实现重新绘制
使用Core Graphics绘制
- (void) drawRect: (CGRect) rect {
CGContextRef con = UIGraphicsGetCurrentContext();
CGContextAddEllipseInRect(con, CGRectMake(0,0,60,60));
CGContextSetFillColorWithColor(con, [UIColor greenColor].CGColor);
CGContextFillPath(con);
}
使用UIKit绘制
- (void) drawRect: (CGRect) rect {
UIBezierPath* p = [UIBezierPathbezierPathWithOvalInRect:CGRectMake(0,0,60,60)];
[[UIColor blueColor] setFill];
[p fill];
}
3、设置绘图的上下文(context)
- UIGraphicsPushContext(context)：把context压入栈中，并把context设置为当前绘图上下文
- UIGraphicsPopContext()：将栈顶的上下文弹出，恢复先前的上下文，但是绘图状态不变
- (void)drawRect:(CGRect)rect {
[[UIColor redColor] setFill];
UIGraphicsPushContext(UIGraphicsGetCurrentContext());
[[UIColor blackColor] setFill];
UIGraphicsPopContext();
UIRectFill(CGRectMake(100, 100, 100, 100)); // black color
}
-
使用总结
可以看到使用UIKit绘制时，我们使用了UIBezierPath。它是对CoreGraphics的进一步封装，所以使用起来更加简单。
