美文网首页
YYAsyncLayer

YYAsyncLayer

作者: 请叫我啊亮 | 来源:发表于2017-12-08 17:52 被阅读204次

    异步绘制,将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。

    相关文章

      网友评论

          本文标题:YYAsyncLayer

          本文链接:https://www.haomeiwen.com/subject/dzfyixtx.html