首先看下Masonry和PureLayout的區(qū)別：
| Masonry | PureLayout | |
|---|---|---|
| 重量級(jí)，需學(xué)習(xí)成本 | 輕量級(jí)畴博，語法更偏向Objective-C | |
| 添加約束 | mas_makeConstraints 使用了 block 模塊 | 沒有 block |
| 更新約束 | mas_updateConstraints 保證不會(huì)導(dǎo)致出現(xiàn)兩個(gè)相同約束的情況 | 開發(fā)者控制 |
| 刪除約束 | mas_remakeConstraints ，沒有針對 IOS 8 使用 Active 屬性 | 針對 IOS 8 使用 Active 屬性 |
Massonry的用法:
lable = [UILabel new];
[self.view addSubview:lable];
#prama mark 左右邊距20 距離頂部20 高度40的Label
[lable mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.equalTo(@20);
make.right.equalTo(@(-20));
make.top.equalTo(@20);
make.height.equalTo(@40);
}];
lable.backgroundColor = [UIColor redColor];
lable.textAlignment = NSTextAlignmentCenter;
lable.text = @"masonry測試Label";
#prama mark 頂部距離label底部20 左右邊距20 高度40的TextField
UITextField* textField = [UITextField new];
[self.view addSubview:textField];
[textField mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(lable.mas_bottom).with.offset(20);
make.left.equalTo(@20);
make.right.equalTo(@(-20));
make.height.equalTo(@40);
}];
textField.backgroundColor = [UIColor redColor];
textField.placeholder = @"masonry測試textField";
textField.textAlignment = NSTextAlignmentCenter;
#prama mark 頂部距離textfield底部20 左右邊距20 等寬、等高（40） 間距20的2個(gè)button
button1 =[UIButton buttonWithType:UIButtonTypeCustom];
[self.view addSubview:button1];
button2 =[UIButton buttonWithType:UIButtonTypeCustom];
[self.view addSubview:button2];
[button1 mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(textField.mas_bottom).with.offset(20);
make.left.equalTo(@20);
make.height.equalTo(@40);
make.width.equalTo(button2.mas_width);
make.right.equalTo(button2.mas_left).with.offset(-20);
}];
[button2 mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(button1.mas_top);
make.right.equalTo(@(-20));
make.height.equalTo(button1.mas_height);
}];
[button1 setTitle:@"button1" forState:UIControlStateNormal];
[button1 setBackgroundColor:[UIColor redColor]];
[button1 setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
button1.selected = NO;
[button1 addTarget:self action:@selector(changeSmall:) forControlEvents:UIControlEventTouchUpInside];
[button2 setTitle:@"button2" forState:UIControlStateNormal];
[button2 setBackgroundColor:[UIColor redColor]];
[button2 setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
#prama mark 頂部距離button底部20 相對于self.view X方向居中 寬300 高100的imageView
imageView =[UIImageView new];
imageView.backgroundColor = [UIColor redColor];
[self.view addSubview:imageView];
[imageView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(button1.mas_bottom).with.offset(20);
make.centerX.equalTo(self.view);
make.height.equalTo(@100);
make.width.equalTo(@300);
}];
再來看看PureLayout的用法
self.label = [[UILabel alloc] init];
self.label.backgroundColor = [UIColor redColor];
self.textField = [[UITextField alloc] init];
self.textField.backgroundColor = [UIColor redColor];
self.button1 = [UIButton buttonWithType:UIButtonTypeCustom];
self.button1.backgroundColor = [UIColor redColor];
self.button2 = [UIButton buttonWithType:UIButtonTypeCustom];
self.button2.backgroundColor = [UIColor redColor];
self.imageView = [[UIImageView alloc] init];
self.imageView.backgroundColor = [UIColor redColor];
[self.view addSubview:self.label];
[self.view addSubview:self.textField];
[self.view addSubview:self.button1];
[self.view addSubview:self.button2];
[self.view addSubview:self.imageView];
[self.label autoPinEdge:ALEdgeLeft toEdge:ALEdgeLeft ofView:self.view withOffset:20.0f];
[self.label autoPinEdge:ALEdgeRight toEdge:ALEdgeRight ofView:self.view withOffset:-20.0f];
[self.label autoPinEdge:ALEdgeTop toEdge:ALEdgeTop ofView:self.view withOffset:20.0f];
[self.label autoSetDimension:ALDimensionHeight toSize:40.0f];
[self.textField autoPinEdge:ALEdgeTop toEdge:ALEdgeBottom ofView:self.label withOffset:20.0f];
[self.textField autoPinEdge:ALEdgeLeft toEdge:ALEdgeLeft ofView:self.view withOffset:20.0f];
[self.textField autoPinEdge:ALEdgeRight toEdge:ALEdgeRight ofView:self.view withOffset:-20.0f];
[self.textField autoSetDimension:ALDimensionHeight toSize:40.0f];
[self.button1 autoPinEdge:ALEdgeTop toEdge:ALEdgeBottom ofView:self.textField withOffset:20.0f];
[self.button1 autoPinEdge:ALEdgeLeft toEdge:ALEdgeLeft ofView:self.view withOffset:20.0f];
[self.button1 autoSetDimension:ALDimensionHeight toSize:40.0f];
[self.button1 autoMatchDimension:ALDimensionWidth toDimension:ALDimensionWidth ofView:self.button2];
[self.button2 autoPinEdge:ALEdgeTop toEdge:ALEdgeBottom ofView:self.textField withOffset:20.0f];
[self.button2 autoPinEdge:ALEdgeRight toEdge:ALEdgeRight ofView:self.view withOffset:-20.0f];
[self.button2 autoPinEdge:ALEdgeLeft toEdge:ALEdgeRight ofView:self.button1 withOffset:20.0f];
[self.button2 autoMatchDimension:ALDimensionHeight toDimension:ALDimensionHeight ofView:self.button1];
[self.imageView autoPinEdge:ALEdgeTop toEdge:ALEdgeBottom ofView:self.button1 withOffset:20.0f];
[self.imageView autoSetDimension:ALDimensionWidth toSize:300.0f];
[self.imageView autoSetDimension:ALDimensionHeight toSize:100.0f];
[self.imageView autoAlignAxisToSuperviewAxis:ALAxisVertical];
效果圖如下：
Paste_Image.png
