先抛出个人总结的有关圆角触发离屏渲染的一个结论背景和结论:
结论背景:
只考虑cornerRadius、masksToBounds、backgroundColor、layer.bacgroundColor、text、border这六个组合因素,不考虑阴影、光栅化等因素
结论:
masksToBounds=true和cornerRadius同时设置不一定会触发离屛渲染;masksToBounds=no一定不会触发离屛渲染(当然要结合结论背景)
masksToBounds和cornerRadius同时设置不一定会触发离屛渲染
首先打开模拟器的 Debug - Color Off-screen Rendered 工具来检测是否触发离屛渲染,控件标黄即为触发了离屏渲染;
iOS系统在定义圆角触发离屏渲染的时机是分不同控件的,以下是6种同时设置了masksToBounds和cornerRadius属性但并不会触发离屏渲染的case:
一、UIView无绘制元素
- 无绘制元素:
TestView *view = [[TestView alloc] initWithFrame:CGRectMake(100, 100, 30, 30)];
view.layer.backgroundColor = UIColor.blueColor.CGColor;
view.layer.borderWidth = 1.5;
view.layer.masksToBounds = YES;
view.layer.cornerRadius = 20;
[self.view addSubview:view];
- 有绘制元素:
在TestView类中实现drawLayer: inContext:方法并调用[layer setNeedsDisplay]进行绘制后:
- (void)drawLayer:(CALayer *)layer inContext:(CGContextRef)ctx {
CGContextSetLineWidth(ctx, 10.f);
CGContextSetStrokeColorWithColor(ctx, [UIColor blueColor].CGColor);
CGContextStrokeEllipseInRect(ctx, CGRectMake(10, 10, 30, 30));
}
二、UILabel无text
- 无text时:
UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(100, 200, 200, 20)];
label.layer.backgroundColor = UIColor.cyanColor.CGColor;
label.layer.borderColor = [UIColor blackColor].CGColor;
label.layer.borderWidth = 1.5;
// label.text = @"off screen render test";
label.textColor = [UIColor grayColor];
label.layer.masksToBounds = YES;
label.layer.cornerRadius = 20;
[self.view addSubview:label];
三、UILabel的backgroundColor=clearColor且无border
UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(100, 200, 200, 20)];
// label.layer.backgroundColor = UIColor.cyanColor.CGColor;
// label.layer.borderColor = [UIColor blackColor].CGColor;
// label.layer.borderWidth = 1.5;
label.text = @"off screen render test";
label.textColor = [UIColor grayColor];
label.layer.masksToBounds = YES;
label.layer.cornerRadius = 20;
[self.view addSubview:label];
四、设置label.backgroundColor = 非clearColor ,且不设置 label.layer.backgroundColor,且无border
UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(100, 200, 200, 20)];
label.backgroundColor = UIColor.cyanColor;
// label.layer.borderColor = [UIColor blackColor].CGColor;
// label.layer.borderWidth = 1.5;
label.text = @"off screen render test";
label.textColor = [UIColor grayColor];
label.layer.masksToBounds = YES;
label.layer.cornerRadius = 20;
[self.view addSubview:label];
五、UIImageview无backgroundColor且无border
UIImageView *imgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"jiayou"]];
// imgView.backgroundColor = [UIColor cyanColor];
// imgView.layer.backgroundColor = [UIColor cyanColor].CGColor;
// imgView.layer.borderWidth = 1.5;
imgView.frame = CGRectMake(100, 300, 200, 100);
imgView.contentMode = UIViewContentModeScaleAspectFit;
imgView.layer.masksToBounds = YES;
imgView.layer.cornerRadius = 20;
[self.view addSubview:imgView];
六、UIButton未设置titleText且未设置image
UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
// [btn setTitle:@"button" forState:UIControlStateNormal];
// [btn setImage:[UIImage imageNamed:@"jiayou"] forState:UIControlStateNormal];
btn.layer.borderWidth = 1.5;
btn.layer.borderColor = [UIColor redColor].CGColor;
btn.backgroundColor = [UIColor cyanColor];
btn.frame = CGRectMake(100, 100, 50, 50);
btn.layer.masksToBounds = YES;
btn.layer.cornerRadius = 20;
[self.view addSubview:btn];
tips(要基于结论背景)
设置了圆角且能达到圆角效果的一些tips:
- UILabel 可以不设置bgcolor且设置layer.backgroundColor = UIColor.xxxColor.CGColor 且 layer.masksToBounds = NO 避免离屛渲染
- UILabel 可以不设置border 且不设置bgcolor和layerBgColor 且 layer.masksToBounds = YES 避免离屛渲染
- UIImageView 设置 layer.masksToBounds = NO无法切除边角 ;可以不设置border 且 不设置bgcolor和layerBgColor 且 设置layer.masksToBounds = YES 避免离屛渲染
- UIButton 设置 layer.masksToBounds = NO无法切除边角 ;并且设置label.layer.masksToBounds = YES 也不能避免离屛渲染
如有出入,欢迎各位指正~