iOS绘图

介绍

说到iOS的绘图肯定就是Core Graphics。

Core Graphics Framework是一套基于C的API框架，使用了Quartz作为绘图引擎。它提供了低级别、轻量级、高保真度的2D渲染。该框架可以用于基于路径的绘图、变换、颜色管理、脱屏渲染，模板、渐变、遮蔽、图像数据管理、图像的创建、遮罩以及PDF文档的创建、显示和分析。

获取图形上下文

Core Graphics API所有的操作都在一个上下文中进行。所以在绘图之前需要获取该上下文并传入执行渲染的函数中。如果你正在渲染一副在内存中的图片，此时就需要传入图片所属的上下文。获得一个图形上下文是我们完成绘图任务的第一步，你可以将图形上下文理解为一块画布。如果你没有得到这块画布，那么你就无法完成任何绘图操作。

获取图形上下文的几种方式： 1.drawRect: 2.inContext: (-(void)drawInContext:(CGContextRef)ctx - (void)drawLayer:(CALayer*)layer inContext:(CGContextRef)ctx) 3.UIGraphicsBeginImageContextWithOptions

两大绘图框架： UIKit 像UIImage、NSString（绘制文本）、UIBezierPath（绘制形状）、UIColor都知道如何绘制自己。
这些类提供了功能有限但使用方便的方法来让我们完成绘图任务。一般情况下，UIKit就是我们所需要的。

Core Graphics
这是一个绘图专用的API族，它经常被称为QuartZ或QuartZ 2D。Core Graphics是iOS上所有绘图
功能的基石，包括UIKit。

6种绘图的形式

第一种UIKit框架drawRect:


在UIView的子类方法drawRect：中绘制一个蓝色圆
- (void) drawRect: (CGRect) rect { UIBezierPath* p = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0,0,100,100)];
[[UIColor blueColor] setFill];
[p fill];
}




第二种Core Graphics框架inContext:


- (void)drawRect:(CGRect)rect{ //当前上下文及画布为当前view CGContextRef con = UIGraphicsGetCurrentContext(); CGContextAddEllipseInRect(con, CGRectMake(0,0,100,100)); CGContextSetFillColorWithColor(con, [UIColor blueColor].CGColor); CGContextFillPath(con);
}




第三种UIKit框架inContext:


drawInContext:方法 @interface TestLayer : CALayer @end @implementation TestLayer - (void)drawInContext:(CGContextRef)ctx{ UIGraphicsPushContext(ctx); UIBezierPath* p = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0,0,100,100)];
[[UIColor blueColor] setFill];
[p fill]; UIGraphicsPopContext();
} @end @implementation XXXViewController{
- (void)viewDidLoad{

[super viewDidLoad]; //1.创建自定义的layer TestLayer *layer=[TestLayer layer]; //2.设置layer的属性 layer.backgroundColor= [UIColor blackColor].CGColor;
layer.frame=CGRectMake(100, 100, 200, 200);

[layer setNeedsDisplay]; //3.添加layer [self.view.layer addSublayer:layer];
} @end


drawLayer: inContext:方法 @interface MyLayerDelegate : NSObject @end @implementation MyLayerDelegate - (void)drawLayer:(CALayer*)layer inContext:(CGContextRef)ctx { UIGraphicsPushContext(ctx); UIBezierPath* p = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0,0,100,100)];
[[UIColor blueColor] setFill];
[p fill]; UIGraphicsPopContext();
} @end @implementation XXXViewController{

MyLayerDelegate *_layerDeleagete; CALayer *_layer;
}

- (void)viewDidLoad{

[super viewDidLoad];
_layerDeleagete = [[MyLayerDelegate alloc] init]; //1.创建自定义的layer _layer=[CALayer layer]; //2.设置layer的属性 _layer.backgroundColor= [UIColor blackColor].CGColor;
_layer.frame=CGRectMake(100, 100, 200, 200);

_layer.delegate = _layerDeleagete;
[_layer setNeedsDisplay]; //3.添加layer [self.view.layer addSublayer:_layer];
}

- (void)dealloc{
_layer.delegate = nil;
} @end



第四种Core Graphics框架inContext:


drawInContext:方法
- (void)drawInContext:(CGContextRef)ctx{ CGContextAddEllipseInRect(ctx, CGRectMake(0,0,100,100)); CGContextSetFillColorWithColor(ctx, [UIColor blueColor].CGColor); CGContextFillPath(ctx);
}


drawLayer: inContext:方法
- (void)drawLayer:(CALayer*)layer inContext:(CGContextRef)ctx { UIGraphicsPushContext(ctx); UIBezierPath* p = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0,0,100,100)];
[[UIColor blueColor] setFill]; [p fill]; UIGraphicsPopContext();
}



第五种UIKit框架UIGraphicsBeginImageContextWithOptions


@implementation XXXViewController - (void)viewDidLoad{

[super viewDidLoad]; UIGraphicsBeginImageContextWithOptions(CGSizeMake(100,100), NO, 0); UIBezierPath* p = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(0,0,100,100)];
[[UIColor blueColor] setFill];
[p fill]; UIImage* im = UIGraphicsGetImageFromCurrentImageContext(); UIGraphicsEndImageContext(); /*---------------------------------*/ UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(100, 100, 100, 100)];
[imageView setImage:im];
[self.view addSubview:imageView];
} @end




第六种Core Graphics框架UIGraphicsBeginImageContextWithOptions


@implementation XXXViewController - (void)viewDidLoad{

[super viewDidLoad]; UIGraphicsBeginImageContextWithOptions(CGSizeMake(100,100), NO, 0); CGContextRef con = UIGraphicsGetCurrentContext(); CGContextAddEllipseInRect(con, CGRectMake(0,0,100,100)); CGContextSetFillColorWithColor(con, [UIColor blueColor].CGColor); CGContextFillPath(con); UIImage* im = UIGraphicsGetImageFromCurrentImageContext(); UIGraphicsEndImageContext(); /*---------------------------------*/ UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(100, 100, 100, 100)];
[imageView setImage:im];
[self.view addSubview:imageView];
}

注意

使用- (void)drawRect:(CGRect)rect需要注意的地方



以下方法调用drawRect




1.如果在UIView初始化时没有设置rect大小，将直接导致drawRect不被自动调用。



2.该方法在调用sizeThatFits后被调用，所以可以先调用sizeToFit计算出size。然后系统自动调用drawRect:方法。



3.通过设置contentMode属性值为UIViewContentModeRedraw。那么将在每次设置或更改frame的时候自动调用drawRect:。



4.直接调用setNeedsDisplay，或者setNeedsDisplayInRect:触发drawRect:，但是有个前提条件是rect不能为0.







若要实时画图，不能使用gestureRecognizer，只能使用touchbegan等方法来掉用setNeedsDisplay实时刷新屏幕

问题

比如当在一个view上绘制一条线之类的，是直接用addsubView添加一个UIView控件好，还是在drawRect：里用绘图代码绘制一条线好？

哪种更高效，或者一样？

源码，应用场景

以上六种方式绘制圆的代码

绘图代码比较常用就是图表和绘画板这两种场景。


两个可以学习的源码：

图表：BEMSimpleLineGraph

绘画板：Brushes