iOS 让自定义的xib在Storyboard中露脸呗

让 Storyboard GeGe 与 Xib MM从此不再形同陌路

其实很早之前就一直有一种将 SB和Xib结合的想法,奈何公司的代码从接手后就有种远离 SB 的不成文规定,(虽然有时候就是管不住手,硬是写了几个界面的SB),又因一直以来公司的业务迭代速度又增无减的情况下,使用 SB 导致的代码的复用率又实在是件让人无奈的事情。但不可置否的是,SB 终会一统江湖,我默默的坚信着

代码会说话,懂得就不用再往下看了,请接住demo <xib露个脸在storyboard上,并留下瞬间变脸技巧>


上图大图

SB的控制器显示自定义View

这些简单的搭建相信有经验的你是毫无鸭梨的啦,下面我们说说需要注意几个地方

  • 自定义的 ActView.xib 文件不应该设置 View 文件的 class 属性,而是设置 xib 的 File's Owner 的 class 为ActView(自定的View的文件名),如下图:
    不设置View 的 Class 值

    File's Owner 的 class 设为自定的View的文件名

其实上图的两个原则就像我们平时通过 SB/Xib 创建 ViewController 一样,ViewController 对应的 SB/Xib 文件会自动为我们生产一个 View 控件,此时的 View控件则已经被 Controller 的 File's Owner管理了,所以下面的一步也就是将ActView.xib文件中的 View 变为其管理的属性,将 View 连线至ActView.h上


Snip20170902_27.png

但仅仅是这样还不够的,因为即使ActView.h和ActView.m虽然是控制了(被拖拽放进来的)View,但是并无将其加载在自己身上,所以呢,还是得写几行代码告诉ActView文件,把你的脸面给装上才行

@implementation ActView

- (instancetype)initWithCoder:(NSCoder *)aDecoder {
    if (self = [super initWithCoder:aDecoder]) {
        [self setUpInitCotentView];
    }
    return self;
}

- (instancetype)initWithFrame:(CGRect)frame {
    if (self = [super initWithFrame:frame]) {
        [self setUpInitCotentView];
    }
    return self;
}

- (void)setUpInitCotentView {
    
    //这里在Xib / Storyboard 编译的时候,我们需要告诉iOS系统,我们要指定哪一个bundle类去读取。不能获取mainBundle这个默认法法;
    NSBundle *bundle = [NSBundle bundleForClass:[self class]];

    self.contentView = [[bundle loadNibNamed:NSStringFromClass([self class]) owner:self options:nil] firstObject];
    [self addSubview:self.contentView];
}

- (void)layoutSubviews {
    [super layoutSubviews];
    self.contentView.frame = self.bounds;
}
@end

注意NSBundle *bundle = [NSBundle bundleForClass:[self class]];方法:
此处不能通过mainBundle这个默认法来加载 nib 文件,我们必须得指定自定义 View的bundle类去读取这个 nib 文件,否则xib 也不能在 SB 中露脸
如上执行后,即可在运行时将 xib 应用到 SB 上了。但是要想让 xib 立即 在 SB �显示出来,那就要找到 IB_DESIGNABLE / IBInspectable 这个两个哥们帮帮忙才行了。
如下就是使用IB_DESIGNABLE / IBInspectable后让 xib 可在 SB 中立即变脸的代码,有空再说说他们两的细节吧~

ActView.m文件

#import "ActView.h"

IB_DESIGNABLE
@interface ActView ()

@property (strong, nonatomic) IBInspectable IBOutlet UIView *contentView;
@property (weak, nonatomic) IBOutlet UILabel *titleLB;

#pragma mark - IBInspectable Property
@property (nonatomic, assign) IBInspectable CGFloat cornerRadius;
@property (nonatomic, assign) IBInspectable CGFloat bwidth;
@property (nonatomic, assign) IBInspectable UIColor *bcolor;

@end

@implementation ActView

- (instancetype)initWithCoder:(NSCoder *)aDecoder {
    if (self = [super initWithCoder:aDecoder]) {
        [self setUpInitCotentView];
    }
    return self;
}

- (instancetype)initWithFrame:(CGRect)frame {
    if (self = [super initWithFrame:frame]) {
        [self setUpInitCotentView];
    }
    return self;
}

- (void)setUpInitCotentView {
    
    //
    NSBundle *bundle = [NSBundle bundleForClass:[self class]];
    self.contentView = [[bundle loadNibNamed:NSStringFromClass([self class]) owner:self options:nil] firstObject];
    [self addSubview:self.contentView];
}

- (void)layoutSubviews {
    [super layoutSubviews];
    self.contentView.frame = self.bounds;
}

#pragma mark - getter & setter
- (void)setCornerRadius:(CGFloat)cornerRadius{
    _cornerRadius = cornerRadius;
    self.layer.cornerRadius  = _cornerRadius;
    self.layer.masksToBounds = YES;
}

- (void)setBcolor:(UIColor *)bcolor{
    _bcolor = bcolor;
    self.layer.borderColor = _bcolor.CGColor;
}

- (void)setBwidth:(CGFloat)bwidth {
    _bwidth = bwidth;
    self.layer.borderWidth = _bwidth;
}

@end

参考文章:
关于IB_DESIGNABLE / IBInspectable的那些事
在OC和Swift中使用IBDesignable/IBInspectable
iOS 在storyboard中调用xib

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 221,888评论 6 515
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 94,677评论 3 399
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 168,386评论 0 360
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 59,726评论 1 297
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 68,729评论 6 397
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 52,337评论 1 310
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,902评论 3 421
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,807评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 46,349评论 1 318
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 38,439评论 3 340
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 40,567评论 1 352
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 36,242评论 5 350
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,933评论 3 334
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 32,420评论 0 24
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,531评论 1 272
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,995评论 3 377
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 45,585评论 2 359

推荐阅读更多精彩内容