一个圆角 + 右上角删除按钮引发的血案!!!
1.一般方法实现圆角
UILabel *label = [UILabel new];
label.clipsToBounds = YES;
label.layer.cornerRadius = 5;
这样实现圆角的方式有一个弊端,就是把一切超出父控件的部分剪切掉。一般情况下,这也不算什么,但是,当你添加的子控件需要显示超出父控件的部分的时候,就显示不出来,比如:添加一个右上角的删除控件。
2.尝试在当前控件上添加圆角layer
UILabel *label = [[UILabel alloc] initWithFrame: CGRectMake(40, 120, 80, 30)];
label.font = [UIFont systemFontOfSize: 20];
label.textColor = [UIColor blackColor];
label.text = @"Jashion";
[self.view addSubview: label];
UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect: label.bounds cornerRadius: 5];
CAShapeLayer *bgLayer = [CAShapeLayer layer];
bgLayer.frame = label.bounds;
bgLayer.path = path.CGPath;
bgLayer.fillColor = [UIColor orangeColor].CGColor;
[label.layer insertSublayer: bgLayer above: 0];
这样会导致中文显示正常,英文被覆盖的问题:
Label
什么原因导致的呢?猜测是中文和英文的显示有点区别,具体打印一下它们的图层结构,如下:
问题比较明了了,纯英文和数字,符号在label里显示都是一个图层显示,而包含中文字符的会新生成一个UILabelContentLayer来承载内容,所以,中文可以显示,而英文被覆盖的原因在于,英文被子图层直接覆盖了,而中文添加的子图层是在内容显示图层的下面,所以不会被覆盖。
ps:
1.UIButton和UILabel显示中文和英文是一样的
2.UILayerContentLayer永远都是在子图层数组里最前面
3.换个思路,一路死磕
既然直接添加图层会覆盖原有的图层,设置图层的zPosition也不行(因为没有中文符号的label只有一个图层,没有子图层,添加一个新的图层还是需要父图层承载),这时候注意到设置原有图层的背景颜色是不会覆盖内容显示的,嘿嘿。
直接上代码:
UIImage *backgroundImage;
UIGraphicsBeginImageContextWithOptions(self.frame.size, NO, [UIScreen mainScreen].scale);
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetFillColorWithColor(context, backgroundColor.CGColor);
UIBezierPath *fillPath = [UIBezierPath bezierPathWithRoundedRect: CGRectMake(borderWidth, borderWidth, self.frame.size.width - borderWidth, self.frame.size.height - borderWidth) cornerRadius: radius];
CGContextAddPath(context, fillPath.CGPath);
CGContextFillPath(context);
backgroundImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
if (!backgroundImage) {
return;
}
self.layer.backgroundColor = [UIColor colorWithPatternImage: backgroundImage].CGColor; //注意这里不能直接设置self.backgroundColor,显示会有问题???
完成的效果如下:
效果图
总结:
生活总是充满惊喜,嘿嘿,如果不是当时公司项目需要实现这个效果,我现在都还不知道这些事情。意料之外,情理之中,挺好玩的。
网友评论