关于xib在我们的项目中用到很多，作为快速搭建页面的基本功，却忽略了一些重要的属性，接下来就简单介绍一下xib的黑科技和在项目中的实际应用。有点东西的，我来做个笔记。
IB_DESIGNABLE 作用
IB_DESIGNABLE：在xib类中申明申明宏，Xcode会自动在xib中动态渲染图形。简单来说就是你用代码写的view是可以在xib中看到。
首先我们创建Circle类继承UIView，并且在.h文件中声明属性
#import <UIKit/UIKit.h>
IB_DESIGNABLE //让你的自定 UIView 可以在 IB 中预览
@interface CircleView : UIView
@property (nonatomic, assign) CGFloat lineWidth; // 线宽
@property (nonatomic, assign) CGFloat radius; // 圆的半径
@property (nonatomic, strong) UIColor *color; // 颜色
@property (nonatomic, assign) BOOL fill; // 是否填充
@end
- 在Circle.m中drawRect方法中绘制圆形视图
- (void)drawRect:(CGRect)rect {
// 计算中心点
CGFloat centerX = (self.bounds.size.width - self.bounds.origin.x) / 2;
CGFloat centerY = (self.bounds.size.height - self.bounds.origin.y) / 2;
UIBezierPath *path = [[UIBezierPath alloc] init];
// 添加一个圆形
[path addArcWithCenter:CGPointMake(centerX, centerY) radius:_radius startAngle:0 endAngle:360 clockwise:YES];
// 设置线条宽度
path.lineWidth = _lineWidth;
// 设置线条颜色
[_color setStroke];
// 绘制线条
[path stroke];
if (_fill) {
// 如果是实心圆，设置填充颜色
[_color setFill];
// 填充圆形
[path fill];
}
}
- 用xib创建View，在声明IB_DESIGNABLE宏之后，command+B 便会在xib中看到我们的创建的视图（记得要给申明属性默认值才会显示）
声明IB_DESIGNABLE.png
IBInspectable 作用
- 让你的自定义 UIView 的属性出现在 IB 中 Attributes inspector，这样我们就不用通过代码来设置圆角边框的一堆繁琐的属性
- 只要在.h属性方法中加入关键字IBInspectable即可
@property (nonatomic, assign)IBInspectable CGFloat lineWidth; // 线宽
@property (nonatomic, assign)IBInspectable CGFloat radius; // 圆的半径
@property (nonatomic, strong)IBInspectable UIColor *color; // 颜色
@property (nonatomic, assign)IBInspectable BOOL fill; // 是否填充
image.png
接下来我们可以封装一个类，专门用来设置我们xib视图中的圆角，边框等属性，倒入pch，大大加快我们的效率。
#import <UIKit/UIKit.h>
@interface UIView (nibExt)
//仅仅用于设置ib 非正常属性
@property(nonatomic,assign)IBInspectable CGFloat layerBoderWidth;
@property(nonatomic,assign)IBInspectable CGFloat layerBoderCorner;
@property(nonatomic,strong)IBInspectable UIColor * boderColor;
@end
#import "UIView+nibExt.h"
@implementation UIView (nibExt)
-(void)setLayerBoderWidth:(CGFloat)layerBoderWidth{
self.layer.borderWidth = layerBoderWidth;
}
-(CGFloat)layerBoderWidth{
return self.layer.borderWidth;
}
-(void)setLayerBoderCorner:(CGFloat)layerBoderCorner{
self.layer.cornerRadius = layerBoderCorner;
}
-(CGFloat)layerBoderCorner{
return self.layer.cornerRadius;
}
- (void)setBoderColor:(UIColor *)boderColor{
self.layer.borderColor = boderColor.CGColor;
}
- (UIColor *)boderColor{
return [UIColor colorWithCGColor:self.layer.borderColor];
}
@end
效果图最终
至此，大功告成，美滋滋～～～
最后附上代码链接：
gibHub地址：https://github.com/MrBMask
