iOS面试 -- UI视图相关

UITableView 复用机制

为什么要用重用机制?

当UITableView滚动时,如果不用重用机制,会重复初始化原来已经有初始化过的cell,因此用重用机制会节省性能,避免出现卡顿现象

重用机制的原理

重用机制主要用到了一个可变数组visiableCells和一个可变的字典类型reusableTableCells,其中visiableCells用来存储当前UITableView显示的cell,reusableTableCells用来存储已经用'identify'缓存的cell。当UITableView滚动的时候,会先在reusableTableCells中根据identify找是否有有已经缓存的cell,如果有直接用,没有再去初始化。

数据源同步问题

  1. 并发访问 数据拷贝
    • 并发即多个线程都可以执行同一段时间,不需要相互等待,主线程与用户互动,子线程做所需要的网络数据请求、数据解析及预排版等
    • 主线程事先拷贝一份数据给子线程做网络请求、数据解析、预排版等,如果主线程有相关操作,记录操作,在子线程完成相关操作后将这条操作,与子线程的数据进行同步,再回到主线程刷新界面
    • 缺点:需要拷贝大量数据,耗内存

2.串行访问
- 创建一个GCD串行队列,主线程的操作需要等待子线程操作完成
- 缺点:需要等待子线程完成,可能会耗时较长

UIView的事件传递以及视图响应的机制和流程

UIView以及CALayer的关系和区别
  • 关系:
    UIView的内部包含CALayer层。创建UIView时,会自动创建一个CALyer层的对象,通过UIView的layer属性可以访问到。UIView需要显示时,会调用drawRect方法进行绘制,并将所有内容绘制在自己的layer层。也就是CALayer层才有显示功能。
  • 区别:
    UIView负责提供内容,以及负责处理触摸等事件,参与响应链
    CALayer负责显示内容contents
事件传递与视图响应链
  • 事件的分发与传递

    1. 当iOS程序中发生触摸事件,系统会将事件加入到UIApplication管理的一个任务队列

    2. UIApplication将处于任务队列最前端的事件向下分发。即UIWindow ->UIView

    3.UIView首先看自己是否能处理事件,触摸点是否在自己身上。如果能,那么继续寻找子视图。

    5.遍历子控件,重复以上两步

    6.如果没有找到,那么自己就是事件处理者

    7.如果自己不能处理,那么不做任何处理

    其中不接受处理的事件情况如下三种:
    - alpha <0.01
    - userInteractionEnabled = NO
    - hidden = YES.
    如果父视图不接受事件处理,则子视图也不能接收。事件只要触摸就会产生,关键在于是否有合适的View处理接收事件

  • 如何寻找最合适的View呢?以下两个方法

// 此方法返回的View是本次点击事件需要的最佳View
- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event

// 判断一个点是否落在范围内
- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event

事件传递给窗口或控件的后,就调用hitTest:withEvent:方法寻找更合适的view,如果子控件是合适的view,则在子控件再调用hitTest:withEvent:直到找到最合适的为止

  • 响应者链
    响应者链的传递方法是事件传递的反方法,如果所有的响应者都不处理,则事件被丢弃

图像显示原理(为了关于UI卡顿掉帧原因做的铺垫 了解)

图像显示原理

CPU GPU通过总线连接 通过CPU进行绘图,将位图经由总线在合适的时机给GPU,GPU做位图的涂层渲染和纹理合成,再放到帧缓冲区域(Frame Buffer)中, 由视频控制器根据VSync在帧缓冲区域中提取屏幕显示内容,显示到手机屏幕中

图像显示原理

CPU
需要做Layout布局(UI布局),Display显示(绘制 drawRect),Prepare准备工作(图片编解码),Commit提交(提交位图)
GPU
需要做 顶点着色 图源装配 光栅化 片段着色 片段处理 再放到帧缓冲区域(Frame Buffer)

UI卡顿 掉帧的原因 以及优化方案

UI卡顿 掉帧的原因
UI卡顿掉帧的原因

保持流畅的UI交互,FPS应该保持在60,即16.7ms刷新一次页面,如果CPU处理时间过长,导致VSync信号到来之前CPU和GPU无法完成下一帧画面的合成,就会造成肉眼可见的卡顿

tableView的滑动优化方案
  • CPU
    对象创建、调整、销毁
    预排版(布局计算、文本计算)
    预渲染(文本异步绘制、图片编解码)
    -GPU
    纹理渲染(减少不必要的离屏渲染)
    视图混合(减轻视图层级的复杂性)

如何具体优化呢?

  • 官方在iOS9.0后对UIImageView设置圆角进行优化,但是设置阴影依然会触发离屏渲染
  • 圆角优化
    1.使用贝塞尔曲线UIBezierPath和Core Graphics框架画出一个圆角
    2.使用CAShapeLayer和UIBezierPath设置圆角
  • shadow优化
    通过设置shadowPath来优化性能

其他优化方案:

  • 尽量使用不包含透明(alpha)通道的图片资源
  • 尽量设置layer的大小值为整形值
  • 使用一张中间透明图片蒙上去
  • 如果是本地图:直接让美工把图片切成圆角进行显示
  • 上传图片进行显示,可以让服务端处理圆角
  • 利用UIBezierPath(CoreGraphics框架)画出来圆角图片

Core Animation工具检测离屏渲染

对于离屏渲染的检测,苹果为我们提供了一个测试工具Core Animation。可以在Xcode->Open Develeper Tools->Instruments中找到

UIView的绘制原理

离屏渲染��

离屏渲染
  • 在屏渲染 On-screen,Rendering 当前屏幕渲染
    GPU的渲染操作在当前用于显示的屏幕缓冲区中进行
  • 离屏渲染 Off-Screen,GPU当前屏幕缓冲区之外新开辟一个缓冲区来进行渲染操作

什么是离屏渲染:
当指定了视图的某些图层属性标记了不能在当前 的屏幕缓冲区中直接显示时,则需要开辟一块新的缓冲区进行渲染操作,即离屏渲染,需要多次切换上下文

何时会触发离屏渲染?
  • 圆角 layer.masksToBounds = YES 和layer.cornerRadius 同时使用
  • 蒙版 layer.mask
  • 透明度 layer.allowsGroupOpacity = YES 和 layer.opacity < 1.0
  • 阴影 layer.shadow
  • 光栅化 layer.shouldRasterize=true
为什么要避免离屏渲染?

触发离屏渲染会增加GPU的工作量,就会进一步增加CPU和GPU的工作耗时超出16.7ms,可能就会导致UI的卡顿和掉帧,所以要尽量避免

离屏渲染会创建新的渲染缓冲区,以及多次的上下文切换,将多通道的渲染结果做最终的合成,会造成额外的内存开销

2019-11-12

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,732评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 87,496评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,264评论 0 338
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,807评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,806评论 5 368
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,675评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,029评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,683评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 41,704评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,666评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,773评论 1 332
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,413评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,016评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,978评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,204评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,083评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,503评论 2 343