button圆角高效设置

需求
我们会经常遇到这样一个需求,给TableViewCell添加标签,例如:饿了么App中店铺会有,减、特、新等标签,这些标签一般都是用UILabel控件实现,UILabel中设置text,textColor,backgroundColor,以及cornerRadius。


饿了么示例.PNG

问题
这个需求要求我们做圆角,业界也有很多做圆角的方式,最简单的就是设置label.layer.cornerRadius = 2; label.layer.masksToBounds = YES; 但是这样做(label.layer.cornerRadius > 0 && label.layer.masksToBounds = YES)会出现离屏渲染,对于页面中只有少量需要做圆角,也不会造成卡顿,但是如果是每个TableViewCell设置一些圆角,就会使列表滑动起来有明显卡顿。
解决方法
业界对于圆角优化很多方式,大家可以搜一下相关文章。本文只针对UILabel的cornerRadius方式进行讲解。先说一下cornerRadius属性,它是影响layer显示的backgroundColor和border,对layer的contents不起作用。
对于不需要设置label的backgroundColor,只设置borderWidth、borderColor的label,直接设置cornerRadius,不需要设置masksToBounds = YES,就可以实现圆角功能。
对于需要同时设置label的backgroundColor时,直接设置cornerRadius是不能正常显示圆角的,原因是:UILabel设置backgroundColor的行为,不再是设定layer的背景色而是为contents设置背景色。所以解决方式是我们不去设置label的backgroundColor,而是直接设置label.layer.backgroundColor,这样就可以实现单独设置cornerRadius,显示圆角的效果。代码:UILabel *tagLabel = [UILabel new];tagLabel.text = @"减";tagLabel.textColor = [UIColor whiteColor];tagLabel.font = [UIFont systemFontOfSize:12];tagLabel.layer.backgroundColor = [UIColor greenColor].CGColor;tagLabel.layer.cornerRadius = 2;

参考文章:iOS设置圆角的四种方法

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 一、需求 我们会经常遇到这样一个需求,给TableViewCell添加标签,例如:饿了么App中店铺会有,减、特、...
    春暖花已开阅读 8,587评论 1 8
  • >复杂的组织都是专门化的 >Catharine R. Stimpson 到目前为止,我们已经探讨过`CALayer...
    夜空下最亮的亮点阅读 1,073评论 0 2
  • 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥iOS动画全貌。在这里你可以看...
    F麦子阅读 5,141评论 5 13
  • 窗外 细微的声响在夜的黑里隐藏 土狗吠叫 原来 一只野猫走过 夜幕里的猫眼 让我想象起狼眼的凌厉 我说 我没见过狼
    余罪说阅读 135评论 0 1
  • “好久没写东西了。” 收到行动派寄来的礼物后,羞愧的感觉便“嘭”地一声爆发出来了。 虽然嘴上一直在说“不知道为什么...
    松果泓树阅读 642评论 0 1