异步绘制,将UI的绘制过程转移到后台线程,避免主线程堵塞,提高应用流畅度。
框架实现:YYAsyncLayer
框架应用:比如YYLabel
框架分析:https://www.cnblogs.com/sunshine-anycall/p/7674021.html?utm_source=tuicool&utm_medium=referral
框架应用的简单实现如下
@interface XXLabel : UIView
@property NSString *text;
@property UIFont *font;
@end
@implementation XXLabel
- (void)setText:(NSString *)text {
_text = text.copy;
[[YYTransaction transactionWithTarget:self selector:@selector(contentsNeedUpdated)] commit];
}
- (void)setFont:(UIFont *)font {
_font = font;
[[YYTransaction transactionWithTarget:self selector:@selector(contentsNeedUpdated)] commit];
}
- (void)layoutSubviews {
[super layoutSubviews];
[[YYTransaction transactionWithTarget:self selector:@selector(contentsNeedUpdated)] commit];
}
- (void)contentsNeedUpdated {
// do update
[self.layer setNeedsDisplay];
}
#pragma mark - YYAsyncLayer
+ (Class)layerClass {
return YYAsyncLayer.class;
}
- (YYAsyncLayerDisplayTask *)newAsyncDisplayTask {
// capture current state to display task
NSString *text = _text;
UIFont *font = _font;
YYAsyncLayerDisplayTask *task = [YYAsyncLayerDisplayTask new];
task.willDisplay = ^(CALayer *layer) {
//...
};
task.display = ^(CGContextRef context, CGSize size, BOOL(^isCancelled)(void)) {
if (isCancelled()) return;
NSArray *lines = CreateCTLines(text, font, size.width);
if (isCancelled()) return;
for (int i = 0; i < lines.count; i++) {
CTLineRef line = line[i];
CGContextSetTextPosition(context, 0, i * font.pointSize * 1.5);
CTLineDraw(line, context);
if (isCancelled()) return;
}
};
task.didDisplay = ^(CALayer *layer, BOOL finished) {
if (finished) {
// finished
} else {
// cancelled
}
};
return task;
}
@end
XXLabel是一个UIView对象,当文本\布局等改变的时候,任务[self.layer setNeedsDisplay]被添加到YYTransaction中,在RunLoop即将休眠时被调用。
XXLabel必须实现layerClass以及newAsyncDisplayTask两个方法,前者指定涂层为YYAsyncLayer.class类型,则当调用[self.layer setNeedsDisplay]时会进入到YYAsyncLayer.class的display方法,进而实现异步绘制等。newAsyncDisplayTask方法返回一个YYAsyncLayerDisplayTask对象,该对象必须实现display这个block,目的是告诉YYAsyncLayer.class具体如何绘制文本信息。
异步绘制的流程链条:用户操作 -> [view layoutSubviews] -> [view.layer setNeedsDisplay] -> [layer display] -> [layer _displayAsync]异步绘制开始
- (void)_displayAsync:(BOOL)async { // 方法大量简略
CGSize size = self.bounds.size;
BOOL opaque = self.opaque;
CGFloat scale = self.contentsScale;
CGColorRef backgroundColor = (opaque && self.backgroundColor)
? CGColorRetain(self.backgroundColor) : NULL;
dispatch_async(YYAsyncLayerGetDisplayQueue(), ^{
UIGraphicsBeginImageContextWithOptions(size, opaque, scale);// 1
CGContextRef context = UIGraphicsGetCurrentContext();
if (opaque) {
CGContextSaveGState(context); {
if (!backgroundColor || CGColorGetAlpha(backgroundColor) < 1) {
CGContextSetFillColorWithColor(context, [UIColor whiteColor].CGColor);
CGContextAddRect(context, CGRectMake(0, 0, size.width * scale, size.height * scale));
CGContextFillPath(context);
}
if (backgroundColor) {
CGContextSetFillColorWithColor(context, backgroundColor);
CGContextAddRect(context, CGRectMake(0, 0, size.width * scale, size.height * scale));
CGContextFillPath(context);
}
} CGContextRestoreGState(context);
CGColorRelease(backgroundColor);
}
task.display(context, size, isCancelled); // 2
// 3
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
// 4
dispatch_async(dispatch_get_main_queue(), ^{
self.contents = (__bridge id)(image.CGImage);
});
});
可见,异步绘制的方式是:
1、子线程开启图形上下文
2、调用task.display(context, size, isCancelled)方法完成具体的内容绘制。对XXLabel的实现,就是调用的newAsyncDisplayTask方法中的display Block,用CoreText完成文本绘制
3、得到2中绘制的文本图片
4、设置图层contents,完成显示。
可见异步绘制中,内容是采用CoreGraphics绘制到上下文,然后得到上下文图片设置到layer.contents上显示的。
附录:
1、YYKitDemo中,异步绘制的demo在YYTextAsyncExample.m文件中,xcode9会崩溃,因为里面的toolbar添加子视图要用toolbar.contentView
2、YYFPSLabel,一个用来实时显示fps的小工具,原理是CADisplayLink,正常情况下,CADisplayLink每隔16.66ms调用A方法一次,fps为1/16.66ms=60。当CPU计算量超过一个CADisplayLink周期时,A方法间隔两次被调用的间隙变长,假若为33.33ms,则fps为1/33.33=30。
网友评论