Masonry的簡單使用

首先，在正式使用masonry之前,我們先來看看在xib中我們是如何使用autolayout

從圖中我們可以看出,只要設定相應得侷限，控制好父檢視與子檢視之間的關係就應該很ok的拖出你需要的需求。這裡就不詳細講解具體拖拽的方法.....

然後,我們按著上圖的屬性來看看如何簡單得使用masonry

這裡是masonry給我們的屬性

@property (nonatomic, strong, readonly) masconstraint *left;         //左側

@property (nonatomic, strong, readonly) masconstraint *top;        //上側

@property (nonatomic, strong, readonly) masconstraint *right;      //右側

@property (nonatomic, strong, readonly) masconstraint *bottom;   //下側

@property (nonatomic, strong, readonly) masconstraint *leading;   //首部

@property (nonatomic, strong, readonly) masconstraint *trailing;   //尾部

@property (nonatomic, strong, readonly) masconstraint *width;     //寬

@property (nonatomic, strong, readonly) masconstraint *height;    //高

@property (nonatomic, strong, readonly) masconstraint *centerx;  //橫向居中

@property (nonatomic, strong, readonly) masconstraint *centery;  //縱向居中

@property (nonatomic, strong, readonly) masconstraint *baseline; //文字基線

//新增約束

- (nsarray *)mas_makeconstraints:(void(^)(masconstraintmaker *make))block; 

//更新約束

- (nsarray *)mas_updateconstraints:(void(^)(masconstraintmaker *make))block;

//清楚之前的所有約束,只會保留最新的約束

- (nsarray *)mas_remakeconstraints:(void(^)(masconstraintmaker *make))block;

合理的利用這個3個函式，基本上可以應對任何情況了

1.居中乙個view

// 防止block中的迴圈引用

__weak typeof (self) weakself = self;

// 初始化乙個view

uiview *bgview = [[uiview alloc]init];

bgview.backgroundcolor = [uicolor redcolor];

[self.view addsubview:bgview];

// 使用mas_makeconstraints新增約束

效果圖1

是不是很簡單，這裡有一點要必須注意下，新增約束前必須要把view新增到檢視上。

那我要是不想固定他得寬高呢，讓view的大小根據間距來控制怎麼做

我們來設定乙個基於父檢視間距為10的view

[bgview mas_makeconstraints:^(masconstraintmaker *make) ]；

這樣就ok了！！！

make.edges.mas_offset(uiedgeinsetsmake(10, 10, 10, 10));

等同於 

make.top.equalto(weakself.view).with.offset(10);

make.left.equalto(weakself.view).with.offset(10);

make.bottom.equalto(weakself.view).with.offset(-10);

make.right.equalto(weakself.view).with.offset(-10);

2.多個view

2個view橫向居中，第二個view距離第乙個view間距為10

uiview *view1 = [[uibutton alloc]init];

view1.backgroundcolor = [uicolor redcolor];

[self.view addsubview:view1];

[view1 mas_makeconstraints:^(masconstraintmaker *make) ];

uiview *view2 = [[uilabel alloc]init];

view2.backgroundcolor = [uicolor yellowcolor];

[self.view addsubview:view2];

[view2 mas_makeconstraints:^(masconstraintmaker *make) ];

效果圖2

大家有沒有看到第二個view**中

make.top.equalto(view1.mas_bottom).with.offset(20);

view1.mas_bottom 是什麼意思呢？如果只寫view1，masonry會預設是view1中最上面開始算起，也就是view2 間距view1 y軸開始20的間距

通過這個也就可以很方便的設定view同另乙個view之間上下左右的間距了

大家不妨試試view.mas_top  view.mas_left  view.mas_right 的效果是什麼樣得了

效果圖3

**如下：

第一次寫部落格，寫的比較亂 。 希望大家多多提意見......

Masonry 簡單使用

magicnumber autoresizingmask autolayout 以上是純手寫 所經歷的關於頁面布局的三個時期 在iphone1 iphone3gs時代 window的size固定為 320,480 我們只需要簡單計算一下相對位置就好了 在iphone4 iphone4s時代 蘋果推出...

Masonry的簡單使用

首先，在正式使用masonry之前,我們先來看看在xib中我們是如何使用autolayout 從圖中我們可以看出,只要設定相應得侷限，控制好父檢視與子檢視之間的關係就應該很ok的拖出你需要的需求。這裡就不詳細講解具體拖拽的方法.然後,我們按著上圖的屬性來看看如何簡單得使用masonry 這裡是mas...

初識Masonry，總結簡單使用方法

前情 因專案多人開發，決定棄用xib了，所以改用masonry來進行autolayout布局，這裡簡單總結下使用方法。常用方法 label為例 self.titlelabel mas makeconstraints masconstraintmaker make make.left.top.mas ...