Masonry 源码:https://github.com/Masonry/Masonry
表:
view.mas_left | NSLayoutAttributeLeft |
view.mas_right | NSLayoutAttributeRight |
view.mas_top | NSLayoutAttributeTop |
view.mas_bottom | NSLayoutAttributeBottom |
view.mas_leading | NSLayoutAttributeLeading |
view.mas_trailing | NSLayoutAttributeTrailing |
view.mas_width | NSLayoutAttributeWidth |
view.mas_height | NSLayoutAttributeHeight |
view.mas_centerX | NSLayoutAttributeCenterX |
view.mas_centerY | NSLayoutAttributeCenterY |
view.mas_baseline | NSLayoutAttributeBaseline |
make.top.equalTo(superview.mas_top).with.offset(padding.top);
make.edges.equalTo(superview).with.insets(padding);
由以上几句话可以总结公式
make.string1.equalTo(view.string2).with.offset(number);
string1 为上表
string2 为 mas_ + string1
number 有正负
make.height.mas_equalTo(20); make.size.mas_equalTo(CGSizeMake(50, 100));由以上几句话可以总结公式
make.string.mas_equalTo(number);string 为上表
number 为正数二者用mas_equalTo相连接
UIEdgeInsets padding = UIEdgeInsetsMake(10, 10, 10, 10); [view1 mas_makeConstraints:^(MASConstraintMaker *make) { make.top.equalTo(superview.mas_top).with.offset(padding.top); //with is an optional semantic filler make.left.equalTo(superview.mas_left).with.offset(padding.left); make.bottom.equalTo(superview.mas_bottom).with.offset(-padding.bottom); make.right.equalTo(superview.mas_right).with.offset(-padding.right); }];
make.top.mas_equalTo(42); make.height.mas_equalTo(20); make.size.mas_equalTo(CGSizeMake(50, 100)); make.edges.mas_equalTo(UIEdgeInsetsMake(10, 0, 10, 0)); make.left.mas_equalTo(view).mas_offset(UIEdgeInsetsMake(10, 0, 10, 0));
UIView *sv1 = [UIView
new
];
[sv1 showPlaceHolder];
sv1.backgroundColor = [UIColor redColor];
[sv addSubview:sv1];
[sv1 mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(sv).
with
.insets(UIEdgeInsetsMake(10, 10, 10, 10));
/* 等价于
make.top.equalTo(sv).with.offset(10);
make.left.equalTo(sv).with.offset(10);
make.bottom.equalTo(sv).with.offset(-10);
make.right.equalTo(sv).with.offset(-10);
*/
/* 也等价于
make.top.left.bottom.and.right.equalTo(sv).with.insets(UIEdgeInsetsMake(10, 10, 10, 10));
*/
}];
1. Label用法
UILabel * raceNameLabel= [[UILabelalloc]init];
raceNameLabel.font = [UIFontsystemFontOfSize:self.topViewFont];
raceNameLabel.text =@"竞赛名称:";
raceNameLabel.textColor = [UIColorcolorWithHexString:@"#333333"alpha:1];
raceNameLabel.translatesAutoresizingMaskIntoConstraints =NO;
[self.topViewaddSubview:raceNameLabel];
[raceNameLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.leading.equalTo(self.topView.mas_leading).offset(15);
make.top.equalTo(self.topView.mas_top).offset(self.topViewTop);
}];
2. UIImageView用法
UIImageView* top1ImageView = [UIImageViewnew];
[top1ImageView setImage:[UIImageimageNamed:@"active01"]];
[self.middleViewaddSubview:top1ImageView];
[top1ImageView mas_makeConstraints:^(MASConstraintMaker *make) {
make.centerX.equalTo(self.top1Btn.mas_centerX).offset(0);
make.centerY.equalTo(self.top1Btn.mas_centerY).offset(self.middleViewOffset);
make.size.mas_equalTo(CGSizeMake(self.middleViewImageWidth,self.middleViewImageWidth));
}];
3. UIButton用法
UIButton* planBtn = [UIButtonnew] ;
planBtn.translatesAutoresizingMaskIntoConstraints =NO;
[planBtn setBackgroundImage:[UIImageimageNamed:@"function2"]forState:UIControlStateNormal];
[self.middleViewaddSubview:planBtn];
[planBtn addTarget:selfaction:@selector(planAction:)forControlEvents:UIControlEventTouchUpInside];
[planBtn mas_makeConstraints:^(MASConstraintMaker *make) {
make.leading.equalTo(estimateBtn.mas_trailing).offset(self.middleViewSpace);//左右间距
make.top.equalTo(estimateBtn.mas_top).offset(0);
make.bottom.equalTo(estimateBtn.mas_bottom).offset(0);
make.width.equalTo(estimateBtn.mas_width);
}];
planBtn.layer.cornerRadius =2;
planBtn.clipsToBounds =YES;
size用法
make.size.mas_equalTo(CGSizeMake(24,20));
宽高用法:
make.height.mas_equalTo(20);
make.width.equalTo(estimateBtn.mas_width);
make.height.equalTo(estimateBtn.mas_height);
上下对齐
make.top.equalTo(estimateBtn.mas_top).offset(0);
make.bottom.equalTo(estimateBtn.mas_bottom).offset(0);
左右对齐
make.leading.equalTo(self.middleView.mas_leading).offset(self.middleViewLeading);
make.trailing.equalTo(estimateBtn.mas_trailing).offset(0);
中心对齐
make.centerX.equalTo(funcBtn1.mas_centerX);
make.centerY.equalTo(funcBtn1.mas_centerY);
边缘对齐
make.edges.mas_equalTo(self.footView);
比例用法:使用只能是设置同一个控件
make.height.mas_equalTo(bottomInnerView.mas_width).multipliedBy(3);
例子:
[bottomInnerView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.bottom.mas_equalTo(bottomView);
make.center.mas_equalTo(bottomView);
// 设置高/宽为3:1
make.height.mas_equalTo(bottomInnerView.mas_width).multipliedBy(3);
make.width.height.mas_equalTo(bottomView).priorityLow();
make.width.height.lessThanOrEqualTo(bottomView);
}];
lessThanOrEqualTo 用法
make.width.height.lessThanOrEqualTo(bottomView);