离屏渲染的定义
- App在帧缓冲区之外开辟的一块临时缓冲区，用来进⾏额外的渲染和合并。
- 最大可存储屏幕像素点2.5倍。
- 由系统自动触发。
- 离屏渲染存在对性能的消耗，但是在适当的场景可以进行复用优化。
离屏渲染的检测
- 可以通过在模拟器上，Debug-> Color Off-Screen Rendered。
- 其中出现黄色背景的，则为触发了离屏渲染。
离屏渲染的触发方式
1. 毛玻璃效果
2. shouldRasterize 光栅化
3. cornerRadius+maskToBounds（必须是叠加图层，例如UIImageView同时设置背景颜色+图片，才会触发）
4. 半透明视图混合时
5. 绘制文字的layer
1.肯定会触发的两种方式：毛玻璃效果，以及光栅化
// 触发方式1: 毛玻璃效果
UIButton *btn0 = [UIButton buttonWithType:UIButtonTypeCustom];
btn0.frame = CGRectMake(50, 30, 100, 100);
[self.view addSubview:btn0];
[btn0 setImage:[UIImage imageNamed:@"gdt_icon"] forState:UIControlStateNormal];
UIBlurEffect *effect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];
UIVisualEffectView *effectView = [[UIVisualEffectView alloc] initWithEffect:effect];
//必须给effcetView的frame赋值,因为UIVisualEffectView是一个加到UIIamgeView上的子视图.
effectView.frame = CGRectMake(20, 20, 50, 50);
[btn0 addSubview:effectView];
// 触发方式2: shouldRasterize
UIButton *btn_s = [UIButton buttonWithType:UIButtonTypeCustom];
btn_s.frame = CGRectMake(200, 30, 100, 100);
btn_s.layer.shouldRasterize = YES;
[self.view addSubview:btn_s];
[btn_s setImage:[UIImage imageNamed:@"gdt_icon"] forState:UIControlStateNormal];
2. cornerRadius+maskToBounds 的触发条件
- 并不一定说，设置了圆角和maskToBounds就一定会触发离屏渲染
- 下面两个ImageView，A：设置图片+背景色+圆角 B：只设置图片+圆角，无背景
//3.UIImageView 设置了图片+背景色;
UIImageView *img1 = [[UIImageView alloc]init];
img1.frame = CGRectMake(50, 320, 100, 100);
img1.backgroundColor = [UIColor blueColor];
[self.view addSubview:img1];
img1.layer.cornerRadius = 50;
img1.layer.masksToBounds = YES;
img1.image = [UIImage imageNamed:@"gdt_icon"];
//4.UIImageView 只设置了图片,无背景色;
UIImageView *img2 = [[UIImageView alloc]init];
img2.frame = CGRectMake(200, 320, 100, 100);
[self.view addSubview:img2];
img2.layer.cornerRadius = 50;
img2.layer.masksToBounds = YES;
img2.image = [UIImage imageNamed:@"gdt_icon"];
- 可以看出，两个ImageView均设置了圆角以及masksToBounds，但是只有BImageView触发了离屏渲染
3. 半透明view中包含半透明的子视图时，也会触发
- 这里必须是 半透明ViewA add 半透明ViewB才可以
- 如果A和B是同级的View，那么则不会触发，类似view.add(A)，view.add(B)
//3.UIImageView 设置了图片+背景色;
UIView *v1 = [[UIView alloc]init];
v1.frame = CGRectMake(50, 500, 100, 100);
v1.layer.cornerRadius = 50;
v1.backgroundColor = [UIColor colorWithRed:1 green:0.3 blue:0.2 alpha:1];
v1.alpha = 0.5;
[self.view addSubview:v1];
UIView *v2 = [[UIView alloc]init];
v2.frame = CGRectMake(30, 30, 50, 50);
v2.layer.cornerRadius = 20;
v2.backgroundColor = [UIColor colorWithRed:0.3 green:1 blue:0.2 alpha:1];
v2.alpha = 0.5;
[v1 addSubview:v2];
离屏渲染分析
1.离屏渲染和常规渲染流程的区别
- 常规渲染：App -> FrameBuffer -> Display。
- 当系统绘制好需要展示的图形之后，直接提交到帧缓冲区，然后显示在屏幕上就可以。
- 每次帧缓冲区绘制完成后，显示到屏幕时，原来的帧缓冲区中内容立即抛弃，进行下一次渲染。
- 离屏渲染：App -> Off-Screen Buffer(进行计算合并等操作) -> FrameBuffer -> Display
- 当需要显示的图片，一次绘制完成不了的时候，那么就需要在每个part绘制好之后，保存到Off-ScreenBuffer中去，
- 最后当N个part的内容全部绘制完成，再组合计算剪切，把最后需要显示的内容提交到FrameBuffer中去，然后显示到屏幕
2. 简单的离屏渲染逻辑, mask+layer
如上图所示：
- 系统先计算好mask部分，然后保存到离屏缓冲区。
- 计算layer部分，计算好之后保存到离屏缓冲区。
- 对mask和layer进行合并剪裁计算，最后结果提交到FrameBuffer，展示到屏幕上。
3. 相对来说层级较多的离屏渲染
例如实现一个毛玻璃效果
- 渲染内容
- 捕获内容
- 水平模糊
- 垂直模糊
- 合成过程，然后提交
避免离屏渲染的方法
- 1. 如果需要设置圆角，可以使用切好的圆角图片，或者自己使用贝塞尔曲线进行圆角绘制。
- 2. alpha = 1。
- 3. 当不存在短时间内需要反复多次大量复用的layer时，shouldRasterize设置为NO。
- 4. 多检测多解决。
总结
- 离屏渲染只有当帧缓冲区一次性解决不了图形显示的时候，才会由系统自动触发。
- 不是所有的圆角+maskToBounds都会触发离屏渲染。
- 离屏渲染需要消耗性能，所以在常见可以优化的地方，不要触发离屏渲染。
- 如果有性能特殊要求，可以通过打开光栅化shouldRasterize=YES;. 来进行离屏渲染的复用，如果这个layer需要以及可以被复用的话。
