本文主要介绍Masonry的简单实用,并联系如何给控件添加约束:mas_makeConstraints
。下面就马上上代码来使用。
- (void)viewDidLoad {
[super viewDidLoad];
self.view.backgroundColor = [UIColor whiteColor];
// 创建redview
UIView *redView = [[UIView alloc] init];
[self.view addSubview:redView];
redView.backgroundColor = [UIColor redColor];
// 创建greenView
UIView *greenView = [[UIView alloc] init];
[self.view addSubview:greenView];
greenView.backgroundColor = [UIColor greenColor];
// 创建blueView
UIView *blueView = [[UIView alloc] init];
[self.view addSubview:blueView];
blueView.backgroundColor = [UIColor blueColor];
// 添加约束
// 1.red view:距离父控件顶部20,距离父控件左边100,自身宽高(100,100)
[redView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.view).with.offset(20);
make.left.equalTo(self.view).with.offset(100);
make.size.mas_equalTo(CGSizeMake(100, 100));
}];
// 1.green view:距离redview底部20,距离父控件右边100,自身宽高(200,100)
[greenView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(redView.mas_bottom).with.offset(20);
make.right.equalTo(self.view).with.offset(-100);
make.size.mas_equalTo(CGSizeMake(200, 100));
}];
// 1.blue view:顶部等于greenview底部,中点x等于父控件中点x,自身宽高等于greenview的宽高
[blueView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(greenView.mas_bottom);
make.centerX.equalTo(self.view);
make.size.equalTo(greenView);
}];
}
代码说明:
具体view的约束都已经现在注释里了。
对于上述约束来说是很好理解的,比如:(redView顶部约束)
make.top.equalTo(self.view).with.offset(20);
意思:我(子控件)的顶部距离父控件的顶部相差20
这里说一下注意点:
1.使用约束之前一定要先将子view添加到父view上。
2.每个子view的约束一定要完整,(除某些控件外,以后会说到)。
3.添加约束的代码也可以放在控制器的- (void)updateViewConstraints方法中,可以看出来该方法是专门用来更新控件的约束的。