UI視圖

一、事件傳遞 & 響應

UIView/CALayer

• UIView提供內容，負責處理觸摸等事件，繼承UIResponsder
• CALayer負責內容顯示

事件傳遞

- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event;
- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event;
複製代碼

- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
{
    if (!self.userInteractionEnabled || [self isHidden] || self.alpha <= 0.01) {
        return nil;
    }
    
    if ([self pointInside:point withEvent:event]) {
        __block UIView *hit = nil;
        [self.subviews enumerateObjectsWithOptions:NSEnumerationReverse usingBlock:^(__kindof UIView * _Nonnull obj, NSUInteger idx, BOOL * _Nonnull stop) {
            CGPoint convertPoint = [self convertPoint:point toView:obj];
            hit = [obj hitTest:convertPoint withEvent: event];
            if (hit) {
                *stop = YES;
            }
        }];
        
        if (hit) {
            return hit;
        } else {
            return self;
        }
    } else {
        return nil;
    }
}

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event {
    CGFloat x1 = point.x;
    CGFloat y1 = point.y;
    
    CGFloat x2 = self.frame.size.width / 2;
    CGFloat y2 = self.frame.size.height / 2;
    
    double dis = sqrt((X1 - X2) * (x1 - x2) + (y1 - y2) * (y1 - y2));
    
    if (dis <= self.frame.size.width / 2) {
        return YES;
    } else {
        return NO;
    }
}
複製代碼

事件響應

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event;
- (void)touchsMoved:(NSSet *)touches withEvent:(UIEvent *)event;
- (void)touchedEnded:(NSSet *)touches withEvent:(UIEvent *)event;
複製代碼

二、圖像顯示

CPU工做內容

GPU渲染

三、UI卡頓、掉幀

滑動優化方案

CPU

• 對象建立，調整，銷燬
• 預排版(佈局計算、文本計算)
• 預渲染(文本等異步繪製，圖片編解碼等)

GPU

• 紋理渲染(離屏渲染(Layer圓角和maskToBounds，陰影圖層，基於CPU的異步繪製原理減輕GPU的壓力))
• 視圖混合

四、UI繪製原理 & 異步繪製

系統繪製流程

異步繪製

[layer.delegate displayLayer];
複製代碼

• 代理負責生產對應的bitmap
• 設置bitmap做爲layer.contents屬性的值

五、離屏渲染

• On-Screen Rendering GPU的渲染操做在當前用於顯示的屏幕緩衝區中進行
• Off-Screen Rendering GPU在當前屏幕緩衝區之外新開闢一個緩衝區進行渲染操做

爲何要避免離屏渲染？

• 建立新的渲染緩衝區
• 上下文切換