面试UI相关

UI相关

1. UI视图数据源同步

并发访问，数据同步 （内存消耗 ）

串行访问（子线程耗时，会有延时）

2. 事件传递和视图响应的机制和流程

UIView和CALayer

UIView的backgroundcolor是对CALayer里backgroundcolor的包装，contents负责显示内容，backing store是一个bitmap的位图

• UIView为CALayer提供显示的内容，以及负责处理触摸等事件，参与响应链
• CALayer负责显示内容contents

相关设计原则：单一职责原则

时间传递与视图响应链

// 返回最终响应的视图
- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event

复制代码

• hitTest内部实现逻辑

// 判断某一个点击的位置是否在当前视图范围内
- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event
复制代码

• 事件传递流程

• 事件响应流程

3. 图像显示原理

• CPU工作

1. UI布局，文本计算
2. 绘制 drawrect
3. 图片编解码
4. 提交位图

• GPU渲染管线

UI卡顿、掉帧的原因

• 滑动优化方案

  • CPU

    1. 对象的创建、调整、销毁放到子线程
    2. 预排版（布局计算、文本计算）放到子线程
    3. 预渲染（文本等异步绘制、图片编解码）放到子线程

  • GPU 4. 纹理渲染（避免离屏渲染） 5. 试图混合

• UIView绘制原理

  runloop将要结束时调用CALayer的display方法

• 系统绘制流程

• 实现异步绘制 *

-[layer.delegate displayLayer:]
复制代码

    1. 代理负责生成对应的bitmap
    2. 设置该bitmap作为layer.contents属性的值
复制代码

离屏渲染

• On-n-Screen Rendering 意为当前屏幕渲染，指的是GPU的渲染操作是在当前用于显示的屏幕缓冲区中进行

• Off-n-Screen Rendering 意为离屏渲染，指的是GPU的渲染操作是在当前缓冲区以外新开辟一个缓冲区进行渲染操作

• 触发场景

  1. 圆角（当和maskToBounds同时使用时）
  2. 图层蒙版
  3. 阴影
  4. 光栅化

转载于:https://juejin.im/post/5cd30e89e51d456e537ef3cf