iOS开发中使用xib和storyboard可以节约大量的写UI代码的时间。这也是苹果官方比较推荐的方式。不过使用IB的方式来布局页面难免遇到一些需要设置圆角(cornerRadius)、阴影(shadowRadius)、边框(borderColor、borderWidth)这些不能直接在xib中设置的参数。还有一些自定义的view的一些参数。
原来呢,我是把这些控件拖到代码里面,在合适的时机用代码来设置这些参数,这样的话既要IB又要代码,感觉不舒服。或者是在identity inspector中设置user defined runtime attributes 。如下图:
感觉还是很不方便,每个控件都要单独设置一次,麻烦!!!
接下来说重点 IBInspectable
举个例子,好多控件都可能会设置圆角,UIView、UIButton、UILable、UIImageView等等。
我们可以写一个这样的分类
//
// UIView+ForXIB.h
// OTTPos
//
// Created by Lipengxuan on 3/12Tuesday.
// Copyright © 2019 OTTPay. All rights reserved.
//
#import <UIKit/UIKit.h>
NS_ASSUME_NONNULL_BEGIN
@interface UIView (ForXIB)
@property (nonatomic, assign) IBInspectable CGFloat fx_radius;
@property (nonatomic, assign) IBInspectable CGFloat fx_borderWidth;
@property (nonatomic, assign) IBInspectable BOOL fx_masksToBounds;
@property (nonatomic, assign) IBInspectable UIColor *fx_borderColor;
@end
NS_ASSUME_NONNULL_END
//
// UIView+ForXIB.m
// OTTPos
//
// Created by Lipengxuan on 3/12Tuesday.
// Copyright © 2019 OTTPay. All rights reserved.
//
#import "UIView+ForXIB.h"
#import <objc/runtime.h>
@implementation UIView (ForXIB)
-(void)awakeFromNib{
[super awakeFromNib];
self.layer.cornerRadius = self.fx_radius;
self.layer.masksToBounds = self.fx_masksToBounds;
self.layer.borderColor = self.fx_borderColor.CGColor;
self.layer.borderWidth = self.fx_borderWidth;
}
// MARK: - ================ Setters ===========================
static NSString *fx_radiusKey = @"fx_radius";
-(void)setFx_radius:(CGFloat)fx_radius{
objc_setAssociatedObject(self, &fx_radiusKey, @(fx_radius), OBJC_ASSOCIATION_COPY);
}
static NSString *fx_borderColorKey = @"fx_borderColor";
-(void)setFx_borderColor:(UIColor *)fx_borderColor{
objc_setAssociatedObject(self, &fx_borderColorKey, fx_borderColor, OBJC_ASSOCIATION_COPY);
}
static NSString *fx_borderWidthKey = @"fx_borderWidth";
-(void)setFx_borderWidth:(CGFloat)fx_borderWidth{
objc_setAssociatedObject(self, &fx_borderWidthKey, @(fx_borderWidth), OBJC_ASSOCIATION_COPY);
}
static NSString *fx_masksToBoundsKey = @"fx_masksToBounds";
-(void)setFx_masksToBounds:(BOOL)fx_masksToBounds{
objc_setAssociatedObject(self, &fx_masksToBoundsKey, @(fx_masksToBounds), OBJC_ASSOCIATION_COPY);
}
// MARK: - ================ Getters ===========================
-(CGFloat)fx_radius{
return [objc_getAssociatedObject(self, &fx_radiusKey) floatValue];
}
-(UIColor *)fx_borderColor{
UIColor *c = objc_getAssociatedObject(self, &fx_borderColorKey);
return c ;
}
-(CGFloat)fx_borderWidth{
return [objc_getAssociatedObject(self, &fx_borderWidthKey) floatValue];
}
-(BOOL)fx_masksToBounds{
return [objc_getAssociatedObject(self, &fx_masksToBoundsKey) boolValue];
}
@end
来看看storyboard中的效果:
再来看看运行效果:
OK,大功告成。