浅谈 Quartz2D 在开发中的用处 - 画图形

转载自：http://www.jianshu.com/p/d5183ee5371d

在了解到 Quartz2D 的用途以后是不是打算马上动手？虽然MJ老师说会枯燥，但是自己动起手来其实也蛮有趣的，接下来就着手用 Quartz2D 画一些图形吧。

线段代码及效果图展示：

代码：

- (void)drawRect:(CGRect)rect{    CGContextRef line = UIGraphicsGetCurrentContext(); // 不需要* ，获得图形上下文    CGContextMoveToPoint(line, 50, 50); // 设置线段起点    CGContextAddLineToPoint(line, 250, 50); // 设置线段重点    CGContextSetRGBStrokeColor(line, 0, 1.0, 0, 1.0); // 设置险段的颜色    CGContextSetLineWidth(line, 10); // 设置线断的宽度    CGContextSetLineJoin(line, kCGLineJoinRound); // 设置线断起点和终点的样式都为圆角    CGContextSetLineCap(line, kCGLineCapRound); // 设置险段的转角样式为圆角    CGContextStrokePath(line); // 渲染，绘制出一条空心的线断    CGContextRef lineOne = UIGraphicsGetCurrentContext(); // 设置第二条线    CGContextMoveToPoint(lineOne, 50, 150); // 设置线段起点    CGContextAddLineToPoint(lineOne, 200, 20); // 设置线段终点    CGContextSetRGBStrokeColor(lineOne, 1.0, 0, 0, 1.0); // 设置线断颜色    CGContextSetLineWidth(lineOne, 10); // 设置线段宽度    CGContextStrokePath(lineOne); // 渲染，绘制出一条空心的线断}@end

效果图：

线段

三角形代码及效果图展示：

代码：

- (void)drawRect:(CGRect)rect{    CGContextRef triangle = UIGraphicsGetCurrentContext(); // 获得图形上下文    CGContextMoveToPoint(triangle, 150, 40); // 设置起点    CGContextAddLineToPoint(triangle, 60, 200); // 设置第二个点    CGContextAddLineToPoint(triangle,240, 200); // 设置第三个点    CGContextClosePath(triangle); // 关闭起点和终点    CGContextStrokePath(triangle); // 渲染，绘制出三角形}@end

效果图：

三角形

实心四边形、空心四边形，代码及效果图展示：

代码：

- (void)drawRect:(CGRect)rect{    CGContextRef quadrilateral = UIGraphicsGetCurrentContext(); // 获得图形上下文    CGContextAddRect(quadrilateral, CGRectMake(45, 45, 200, 200)); // 设置起始坐标，以及长和宽    CGContextSetRGBFillColor(quadrilateral, 1.0, 1.0, 0, 1); // 设置实心颜色    //CGContextSetRGBStrokeColor(quadrilateral, 1.0, 1.0, 0, 1.0); // 设置空心颜色    //CGContextStrokePath(quadrilateral); // 渲染空心，绘制四边形     CGContextFillPath(quadrilateral); // 渲染实心，绘制出四边形 }@end

效果图：

实心四边形、空心四边形

实心圆形、空心圆形、椭圆，代码及效果图展示：

空心圆形代码：

- (void)drawRect:(CGRect)rect{    CGContextRef round = UIGraphicsGetCurrentContext(); // 获取上下文    CGContextAddEllipseInRect(round, CGRectMake(50, 50, 100, 100)); // 画圆    CGContextSetRGBStrokeColor(round, 0, 0, 0, 1);// 设置颜色    CGContextStrokePath(round); // 渲染，将空心圆形画出}@end

椭圆代码：

- (void)drawRect:(CGRect)rect{    CGContextRef circular = UIGraphicsGetCurrentContext(); // 获取上下文    CGContextAddEllipseInRect(circular, CGRectMake(100, 100, 100, 100)); // 画圆(100,100 变成不等大的就是椭圆，这里不再贴重复代码)    CGContextSetRGBFillColor(circular, 1.0, 0, 1.0, 1);// 设置颜色    CGContextFillPath(circular); // 渲染，将实心圆形画出}@end

空心圆形、实心圆形、椭圆

实心圆弧、空心圆弧、圆环，代码及效果图展示：

实心圆弧：

- (void)drawRect:(CGRect)rect{    CGContextRef arc = UIGraphicsGetCurrentContext(); // 获取上下文     CGContextMoveToPoint(arc, 150, 150); // 画线    CGContextAddLineToPoint(arc, 150, 150); // 画线    CGContextAddArc(arc, 150, 150, 100, M_PI_2, M_PI, 0); // (150,150)圆心 （100）半径 （M_PI_2） 弧度开始的大小 （M_PI） 弧度结束的大小 (0,1)顺时针, 逆时针    CGContextClosePath(arc); // 关闭路径    [[UIColor purpleColor]set]; // 设置颜色    CGContextFillPath(arc); // 3.渲染（ Fill 改成 Stroke 变成空心，不重复贴代码） }@end

环形代码：

- (void)drawRect:(CGRect)rect{    CGContextRef annular = UIGraphicsGetCurrentContext();    CGContextAddArc(annular, 100, 100, 50, 1, 20, 0);    CGContextSetLineWidth(annular, 10);    [[UIColor greenColor]set];    CGContextStrokePath(annular);}@end

效果图：

实心圆弧、空心圆弧、圆环