iOS 開發 Xib 的嵌套使用

 

最近公司項目需要使用 Xib 中嵌套 Xib來布局介面的, 研究了很久才實現!!!

分享給大家,希望協助到更多的開發人員......

 

開發中自訂介面有兩種方式

一: 純程式碼實現

適合單個極度複雜的介面的實現, 例如: 自訂的播放視頻介面......

 

二: Xib 實現

適合有多個介面中有共同的某一個 UIView 組件,多個介面共同使用的, 這時候使用 xib 自訂view

 

#pragma mark - Xib 自訂 view

 

步驟一:

建立EYRedView.h 和 EYRedView.m 和 EYRedView.xib 三個檔案

如所示:

 

 步驟二:

將 EYRedView.xib 檔案與 EYRedView 類關聯起來,

如所示:

 

 步驟三:

在EYRedView.xib 拖入需要的組件, 並且使用 AutoLayout 自動布局設定約束 (圖中設定了一個 UILabel 和 一個 UITextFiled, 並且完成了自動布局)

 

步驟四:

在 EYRedView.h 中提供給外界一個類方法

 EYRedView.h中

+ (instancetype)redView;

 

EYRedView.m中

+ (instancetype)redView {　　// 方式一:　　return [[[NSBundle mainBundle] loadNibNamed:NSStringFromClass([self class]) owner:[self alloc] options:nil] lastObject];　　// 方式二　　// return [[UINib nibWithNibName:NSStringFromClass([self class]) bundle:nil] instantiateWithOwner:nil options:nil].firstObject;}

 

 

如何使用

在控制器中的 viewDidLoad中

 

EYRedView * redView = [EYRedView redView];redView.frame = CGRectMake(0, EYStatusBarAndNaviBarHeight, EYScreenWidth, 100);[self.view addSubview:redView];

 

:

 

 

 注意點: 使用 Xib 自定義 view必須設定 frame!!! 否則 redView 的大小就是 Xib 中設定的大小

 

#pragma mark - Xib 中嵌套 Xib

 

現在的需求是想要在紅色的 view 中增加一個 藍色的view 並且這個 藍色的view 也想要用 Xib 來定義

 PS: 這個藍色的 view 在很多的 xib 中需要用到, 因此使用xib 來定義

 

 步驟一:

建立EYBlueView.h 和 EYBlueView.m 和 EYBlueView.xib 三個檔案

 

步驟二:

將 EYBlueView.xib 通過另一種方式與 EYBlueView 類關聯起來 (PS: 不能使用上面的方式, 需要使用下面的方式)

如所示:

 

步驟三:

EYBlueView.xib 中添加 UIButton 和 UITextField 和兩個控制項,  並且使用 AutoLayout 自動布局設定約束

PS: 正常拖線就能拿到該控制項

 

步驟四:

 EYRedView.xib 中拖入一個 UIView設定為EYBlueView類型, 使用自動布局設定好位置

如所示:

 

 

 步驟五:

 

- (instancetype)initWithCoder:(NSCoder *)aDecoder {    self = [super initWithCoder:aDecoder];    if (self) {        //載入為普通的 view        UIView *view = [[UINib nibWithNibName:NSStringFromClass([self class]) bundle:nil] instantiateWithOwner:self options:nil].firstObject;        //設定位置(一定要設定)        view.frame = self.bounds;        //添加到自己身上        [self addSubview:view];    }    return self;}

 

 

運行效果如下:

 

 

完美實現! 

 

PS: 以下內容可以選擇實現(建議實現,這樣別人使用這個自訂的 view 會有更多的方式)

 

EYBlueView.h 中

 

+ (instancetype)blueView;

 

EYBlueView.m 中

+ (instancetype)blueView {    // 方式一    return [[[NSBundle mainBundle] loadNibNamed:NSStringFromClass([self class]) owner:[self alloc] options:nil] lastObject];    // 方式二    // return [[UINib nibWithNibName:NSStringFromClass([self class]) bundle:nil] instantiateWithOwner:nil options:nil].firstObject;}- (instancetype)initWithFrame:(CGRect)frame {    self = [super initWithFrame:frame];    if (self) {        UIView * view = [[NSBundle mainBundle] loadNibNamed:NSStringFromClass([self class]) owner:self options:nil].firstObject;        view.frame = self.bounds;        [self addSubview:view];    }    return self;}

 

這樣別人就能使用上面的兩個方法通過代碼來載入這個 EYBlueView 了!!!!!! 

 

 

 更多內容--> 部落格導航 每周一篇喲!!!

 

 

有任何關於iOS開發的問題!歡迎下方留言!!!或者郵件lieryangios@126.com 雖然我不一定能夠解答出來,但是我會請教iOS開發高手!!!解答您的問題!!!