需求：之前一个项目中，需要用一个图表展示折线图，折线的点可多达100多个，然后加上渐变，并且每个图表是4个数据源，4条折线和渐变用颜色区别，然后每天都有一个图表，用UITableView展示一年的数据，反正意思就是，这样导致了滑动UITableView时页面帧数的降低和卡顿等。
解决方法：因为正好看过YY大神YYLabel可以异步显示，于是直接把YYLabel中异步绘图部分摘了出来，这样自己实现绘图功能就行了。
主要几个方法
一. AsyncLayerGetDispalyQueue
static dispatch_queue_t YChartAsyncLayerGetDispalyQueue() {
#define MAX_QUEUE_COUNT 16
static int queueCount;
static dispatch_queue_t queues[MAX_QUEUE_COUNT];
static int32_t counter = 0;
static dispatch_once_t onceToken;
dispatch_once(&onceToken, ^{
queueCount = (int)[NSProcessInfo processInfo].activeProcessorCount;
queueCount = queueCount < 1 ? 1 : queueCount;
if ( [[UIDevice currentDevice].systemVersion floatValue] >= 8.0 ) {
for (NSUInteger i = 0 ; i < queueCount; i++) {
dispatch_queue_attr_t attr = dispatch_queue_attr_make_with_qos_class(DISPATCH_QUEUE_SERIAL, QOS_CLASS_USER_INITIATED, 0);
queues[i] = dispatch_queue_create("com.yxw.chart.render", attr);
}
}
else{
for (NSUInteger i= 0; i < queueCount; i++) {
queues[i] = dispatch_queue_create("com.yxw.chart.render", DISPATCH_QUEUE_SERIAL);
dispatch_set_target_queue(queues[i], dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0));
}
}
});
//以上部分都是初始化，只执行一次
//OSAtomicIncrement32：一个自增函数，在库<libkern/OSAtomic.h>中，是线程安全的；
int32_t cur = OSAtomicIncrement32(&counter);
if (cur < 0) {
cur = -cur;
}
return queues[cur%queueCount];
}
dispatch_queue_create函数，在iOS8之前，不能在创建时设定优先级，所以用dispatch_set_target_queue设置优先级，
另外，如果两个队列dispatch_set_target_queue到同一个队列，DISPATCH_QUEUE_SERIAL串行、DISPATCH_QUEUE_CONCURRENT并行对两个队列也有作用，可以参考demo中方法testGCDTarget;
iOS 8之后用dispatch_queue_attr_make_with_qos_class直接创建队列并设置优先级等；QOS_CLASS_USER_INITIATED：为iOS8之后的优先级，其它优先级为：
- QOS_CLASS_USER_INTERACTIVE： user interactive等级表示任务需要被立即执行以提供好的用户体验。使用它来更新UI，响应事件以及需要低延时的小工作量任务。这个等级的工作总量应该保持较小规模。
- QOS_CLASS_USER_INITIATED：user initiated等级表示任务由UI发起并且可以异步执行。它应该用在用户需要即时的结果同时又要求可以继续交互的任务。
- QOS_CLASS_UTILITY：utility等级表示需要长时间运行的任务，常常伴随有用户可见的进度指示器。使用它来做计算，I/O，网络，持续的数据填充等任务。这个等级被设计成节能的。
- QOS_CLASS_BACKGROUND：background等级表示那些用户不会察觉的任务。使用它来执行预加载，维护或是其它不需用户交互和对时间不敏感的任务。
之前的优先级可参考头文件中定义
#define DISPATCH_QUEUE_PRIORITY_HIGH 2
#define DISPATCH_QUEUE_PRIORITY_DEFAULT 0
#define DISPATCH_QUEUE_PRIORITY_LOW (-2)
#define DISPATCH_QUEUE_PRIORITY_BACKGROUND INT16_MIN
二. setNeedsDisplay
滑动UITableView更新图表数据时，不要直接调用绘图方法，应该调用 setNeedsDisplay，等系统刷新页面时调用display方法再绘制（这里使用的是layer层，UIView在调用setNeedsDisplay后会调用drawRect:方法），以便滑动过快时可以取消不必要的绘制。
取消绘制的判断也是以一个自增量来判断的，在每次调用setNeedsDisplay时自增，绘制时判断自增量不同则取消本次绘制。
+ (Class)layerClass {
return [YChartAsyncLayer class];
}
每个UIView都有一个CALayer用来显示，重写UIView的这个方法，让UIView使用YChartAsyncLayer来显示
三. 绘制渐变的方法
static void drawLineGradientInContext(CGContextRef context,CGSize size,NSArray *array,double maxValue,CGMutablePathRef path){
CGFloat xWidth = size.width / (array.count - 1);
CGPathMoveToPoint(path, NULL,0, size.height - 1);
for (int i = 0; i < array.count; i++) {
double value = 0.0;
if (maxValue != 0) {
value = [array[i] doubleValue] / maxValue * size.height * 0.9;
}
CGPathAddLineToPoint(path, NULL, xWidth * i, size.height - value - 1);
}
CGPathAddLineToPoint(path, NULL, xWidth * (array.count - 1), size.height - 1);
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGFloat locations[3] = {0.0,0.5,1.0};
NSArray *colors = @[(__bridge id)([UIColor colorWithRed:0xec/255.0 green:1 blue:1 alpha:1].CGColor),(__bridge id)([UIColor colorWithRed:0x80/255.0 green:1 blue:1 alpha:1].CGColor),(__bridge id)([UIColor colorWithRed:0 green:0xae/255.0 blue:0xae/255.0 alpha:1].CGColor)];
CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef)colors, locations);
CGRect pathRect = CGPathGetBoundingBox(path);
CGPoint startPoint = CGPointMake(CGRectGetMidX(pathRect), CGRectGetMinY(pathRect));
CGPoint endPoint = CGPointMake(CGRectGetMidX(pathRect), CGRectGetMaxY(pathRect));
CGContextSaveGState(context);
CGContextAddPath(context, path);
CGContextClip(context);
CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, kCGGradientDrawsAfterEndLocation);
CGContextRestoreGState(context);
CGGradientRelease(gradient);
CGColorSpaceRelease(colorSpace);
}
因为重点是异步调用，所以绘图的代码就不多说了，demo中的绘图也是把4个数据源绘制到一起，没有分颜色。
请在真机上测试，iPhone5C 等差一点的机型上效果明显。
若有错误，欢迎指正！
四. 最后
show me the code
参考链接
YYLabel地址 ibireme/YYText
关于 iOS 保持界面流畅的技巧
