场景
在开发中,经常会遇到设置 UIView 或者 UIImageView 等控件圆角的情况,在 xib 和 storyboard 里面,我们一般使用 Runtime Attributes 的方式,通过 layer.cornerRadius 和 layer.masksToBounds 设置圆角半径和边缘裁剪。如下图

虽然运行起来能够实现,但是我们并不能在 xib 马上看到效果,要能实时在 Xcode 显示界面效果,就需要用到 IB_DESIGNABLE 和 IBInspectable 特性了。
用法
从 Xcode 6 开始,苹果就提供了 IB_DESIGNABLE 和 IBInspectable 特性,用法如下表
| 特性 | 用途 | OC 使用 | swift 使用 |
|---|---|---|---|
| IB_DESIGNABLE | 动态渲染该类图形化界面 | IB_DESIGNABLE 写在 @interface 前 |
@IBDesignable 写在 class 前 |
| IBInspectable | 可视化编辑该类的属性 | IBInspectable 写在属性类型前 | @IBInspectable 写在变量前 |
直接上代码。创建一个UIView子类,加上 IB_DESIGNABLE 特性
#import <UIKit/UIKit.h>
IB_DESIGNABLE
@interface LCBaseView : UIView
@end
这时候已经能在设计器直接看到效果了(不要忘了设置 CustomClass )

然后再试试 IBInspectable,给 View 加一个 cornerRadius 属性用来设置圆角半径
#import <UIKit/UIKit.h>
IB_DESIGNABLE
@interface LCBaseView : UIView
/** 圆角半径 */
@property (nonatomic, assign) IBInspectable CGFloat cornerRadius;
@end
然后在 .m 文件中重写 set 方法设置圆角
#import "LCBaseView.h"
@implementation LCBaseView
- (void)setCornerRadius:(CGFloat)cornerRadius {
self.layer.cornerRadius = cornerRadius;
self.layer.masksToBounds = YES;
}
@end
回到设计器,会发现刚刚我们自定义的属性神奇的出现在了面板上。把之前设置的 Runtime Attributes 属性全部删了,在这里设置一个100,已经实现了我们想要的效果。
