iOS_autoLayout_Masonry
概述
Masonry是一个轻量级的布局框架与更好的包装AutoLayout语法。
Masonry有它自己的布局方式，描述NSLayoutConstraints使布局代码更简洁易读。
Masonry支持iOS和Mac OS X。
Masonry github 地址:https://github.com/SnapKit/Masonry
对比
使用NSLayoutConstraints创建约束
@interface contrastViewController()
@property (nonatomic,strong) UIView *myView;
@end
@implementation contrastViewController
-(void)loadView
{
[super loadView];
_myView = [[UIView alloc]init];
[self.view addSubview:_myView]; }
-(void)viewDidLoad
{
[super viewDidLoad];
_myView.backgroundColor = [UIColor orangeColor];
_myView.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addConstraints:@[ [NSLayoutConstraint constraintWithItem:_myView
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:], [NSLayoutConstraint constraintWithItem:_myView
attribute:NSLayoutAttributeLeft
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeLeft
multiplier:1.0
constant:], [NSLayoutConstraint constraintWithItem:_myView
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeBottom
multiplier:1.0
constant:-], [NSLayoutConstraint constraintWithItem:_myView
attribute:NSLayoutAttributeRight
relatedBy:NSLayoutRelationEqual
toItem:self.view
attribute:NSLayoutAttributeRight
multiplier:
constant:-], ]];
}
@end
即使这样一个简单的示例，所需的代码量也要非常冗长；
另一个选择是使用视图形式语言(VFL)，这个少一点啰嗦；然而ASCLL类型语法有其自身的缺陷，也有些约束难以实现;
使用Masonry创建相同的约束
@interface contrastViewController()
@property (nonatomic,strong) UIView *myView;
@end
@implementation contrastViewController
-(void)loadView
{
[super loadView];
_myView = [[UIView alloc]init];
[self.view addSubview:_myView]; }
-(void)viewDidLoad
{
[super viewDidLoad];
_myView.backgroundColor = [UIColor orangeColor];
[_myView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.view).offset(); // 相对于self.view 顶部 10
make.left.equalTo(self.view).offset(); // 相对于self.view 左边 10
make.bottom.equalTo(self.view).offset(-); // 相对于self.view 底部 -10
make.right.equalTo(self.view).offset(-); // 相对于self.view 右边 -10
}];
}
@end
还可以更简洁
@interface contrastViewController()
@property (nonatomic,strong) UIView *myView;
@end
@implementation contrastViewController
-(void)loadView
{
[super loadView];
_myView = [[UIView alloc]init];
[self.view addSubview:_myView]; }
-(void)viewDidLoad
{
[super viewDidLoad];
_myView.backgroundColor = [UIColor orangeColor];
UIEdgeInsets padding = UIEdgeInsetsMake(, , , );
[_myView mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(self.view).insets(padding);
}];
}
@end
还要注意在第一个例子中我们必须添加约束到self.view，_myView.translatesAutoresizingMaskIntoConstraints = NO；
然而Masonry将自动添加约束到适当的视图_myView.translatesAutoresizingMaskIntoConstraints = NO;
示例
示例 00
@interface _00_BasicViewController ()
@property (nonatomic) UIView *greenView;
@end @implementation _00_BasicViewController
-(void)loadView
{
[super loadView];
_greenView = [[UIView alloc]init];
[self.view addSubview:_greenView];
}
- (void)viewDidLoad {
[super viewDidLoad];
_greenView.backgroundColor = [UIColor greenColor];
[_greenView mas_makeConstraints:^(MASConstraintMaker *make) {
make.size.mas_equalTo(CGSizeMake(, )); // 设置大小
make.center.equalTo(self.view); // 居中显示
}];
}
@end
示例01
@interface _01_BasicViewController ()
@property (nonatomic,strong) UIView *greenView;
@property (nonatomic,strong) UIView *redView;
@property (nonatomic,strong) UIView *blueView;
@end @implementation _01_BasicViewController -(void)loadView
{
[super loadView];
_greenView = [[UIView alloc]init];
_redView = [[UIView alloc]init];
_blueView = [[UIView alloc]init];
[self.view addSubview:_greenView];
[self.view addSubview:_redView];
[self.view addSubview:_blueView];
}
- (void)viewDidLoad {
[super viewDidLoad];
[_greenView setBackgroundColor:[UIColor greenColor]];
[_redView setBackgroundColor:[UIColor redColor]];
[_blueView setBackgroundColor:[UIColor blueColor]];
[self.greenView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(self.view).offset(); // 顶 等于 View 顶 +10
make.left.equalTo(self.view).offset(); // 左 等于 View 左 +10
make.bottom.equalTo(_blueView.mas_top).offset(-); // 底 等于 蓝色 顶 -10
make.right.equalTo(_redView.mas_left).offset(-); // 右 等于 红色 右 -10
make.width.equalTo(_redView); // 宽 等于 红色 宽
make.height.equalTo(_redView); // 高 等于 红色 高
make.height.equalTo(_blueView); // 高 等于 蓝色 高
}];
[self.redView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(_greenView); // 顶 等于 绿色 顶
make.left.equalTo(_greenView.mas_right).offset(); // 左 等于 绿色 右 +10
make.bottom.equalTo(_greenView); // 底 等于 绿色 底
make.right.equalTo(self.view).offset(-); // 右 等于 View 右 -10
make.width.equalTo(_greenView); // 宽 等于 绿色 宽
make.height.equalTo(_greenView); // 高 等于 绿色 高
}];
[self.blueView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(_greenView.mas_bottom).offset(); // 顶 等于 绿色 底 +10
make.left.equalTo(self.view).offset(); // 左 等于 View 左 +10
make.bottom.equalTo(self.view).offset(-); // 底 等于 View 底 -10
make.right.equalTo(self.view).offset(-); // 右 等于 View 右 -10
make.height.equalTo(_greenView); // 高 等于 绿色 高
}];
}
@end
示例02
@interface _02_Update_ConstraintsViewController ()
@property (nonatomic,strong) UIButton *button;
@property (nonatomic,assign) CGSize buttonSize;
@end @implementation _02_Update_ConstraintsViewController
-(void)loadView
{
[super loadView];
_button = [UIButton buttonWithType:UIButtonTypeSystem];
[self.view addSubview:_button]; }
- (void)viewDidLoad {
[super viewDidLoad];
[_button setTitle:@"点击" forState:UIControlStateNormal];
[_button.layer setBorderColor:[[UIColor greenColor] CGColor]];
[_button.layer setBorderWidth:];
[_button addTarget:self action:@selector(clickWithButton:) forControlEvents:UIControlEventTouchUpInside];
_buttonSize = CGSizeMake(, );
[self.view setNeedsUpdateConstraints]; }
- (void)updateViewConstraints {
[self.button mas_updateConstraints:^(MASConstraintMaker *make) {// 更新约束
make.center.equalTo(self.view); // 居中
make.width.equalTo(@(_buttonSize.width)).priorityLow(); // 宽 等于 100 优先级 低 第一次显示的时候是100
make.height.equalTo(@(_buttonSize.height)).priorityLow(); // 高 等于 100 优先级 低 第一次显示的时候是100
make.width.lessThanOrEqualTo(self.view); // 宽 小于 等于 view 当宽度大于等于 view 需满足此条件
make.height.lessThanOrEqualTo(self.view); // 高 小于 等于 view 当高度大于等于 view 需满足此条件
}];
[super updateViewConstraints];
}
- (void)clickWithButton:(UIButton *)button
{
_buttonSize = CGSizeMake(_buttonSize.width * 1.3, _buttonSize.height * 1.3); // 宽高 乘 1.3
[self.view setNeedsUpdateConstraints];
[UIView animateWithDuration:0.4 animations:^{
[self.view layoutIfNeeded];
}];
}
@end
示例03
@interface _03_Remake_ConstraintsViewController ()
@property (nonatomic, strong) UIButton *movingButton;
@property (nonatomic, assign) BOOL topLeft;
@end @implementation _03_Remake_ConstraintsViewController -(void)loadView
{
[super loadView];
_movingButton = [UIButton buttonWithType:UIButtonTypeSystem];
[self.view addSubview:_movingButton];
}
- (void)viewDidLoad {
[super viewDidLoad];
[_movingButton setTitle:@"点击" forState:UIControlStateNormal];
_movingButton.layer.borderColor = UIColor.greenColor.CGColor;
_movingButton.layer.borderWidth = ; [_movingButton addTarget:self action:@selector(clickWithButton:) forControlEvents:UIControlEventTouchUpInside];
self.topLeft = YES;
[self.view setNeedsUpdateConstraints];
}
+ (BOOL)requiresConstraintBasedLayout
{
return YES;
}
- (void)updateViewConstraints { // 重置约束 会把已有的约束删除重新添加
[self.movingButton mas_remakeConstraints:^(MASConstraintMaker *make) {
make.width.equalTo(@());
make.height.equalTo(@()); if (self.topLeft) {
make.left.equalTo(self.view).offset();
make.top.equalTo(self.view).offset();
}
else {
make.bottom.equalTo(self.view).offset(-);
make.right.equalTo(self.view).offset(-);
}
}];
[super updateViewConstraints];
}
- (void)clickWithButton:(UIButton *)button
{
self.topLeft = !self.topLeft;
[self.view setNeedsUpdateConstraints];
[self.view updateConstraintsIfNeeded];
[UIView animateWithDuration:0.4 animations:^{
[self.view layoutIfNeeded];
}];
} @end
示例04
@interface _04_Using_ConstantsViewController ()
@property (nonatomic,strong) UIView *purpleView;
@property (nonatomic,strong) UIView *orangeView;
@end @implementation _04_Using_ConstantsViewController -(void)loadView
{
[super loadView];
self.purpleView = [[UIView alloc]init];
self.orangeView = [[UIView alloc]init];
[self.view addSubview:_purpleView];
[self.view addSubview:_orangeView];
}
- (void)viewDidLoad {
[super viewDidLoad];
self.purpleView.backgroundColor = UIColor.purpleColor;
self.orangeView.backgroundColor = UIColor.orangeColor;
[self.purpleView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(@); // 顶 20 相对于self.View
make.left.equalTo(@); // 左 20
make.bottom.equalTo(@-); // 底 -20
make.right.equalTo(@-); // 右 -20
}];
[self.orangeView mas_makeConstraints:^(MASConstraintMaker *make) {
make.center.mas_equalTo(CGPointMake(, )); // 中心点Y 相对于self.View Y 50
make.size.mas_equalTo(CGSizeMake(, )); // 大小 200 100
}];
} @end
示例05
@interface _05_Composite_EdgesViewController ()
@end
@implementation _05_Composite_EdgesViewController
-(void)viewWillAppear:(BOOL)animated
{
[super viewWillAppear:animated];
UIView *lastView = self.view;
for (int i = ; i < ; i++) {
UIView *view = [[UIView alloc]init];
view.backgroundColor = [self randomColor];
[self.view addSubview:view];
[view mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(lastView).insets(UIEdgeInsetsMake(, , , ));//相对于上一个View 5 10 -15 -20
}];
lastView = view;
}
}
- (UIColor *)randomColor {
CGFloat hue = ( arc4random() % / 256.0 ); // 0.0 to 1.0
CGFloat saturation = ( arc4random() % / 256.0 ) + 0.5; // 0.5 to 1.0, away from white
CGFloat brightness = ( arc4random() % / 256.0 ) + 0.5; // 0.5 to 1.0, away from black
return [UIColor colorWithHue:hue saturation:saturation brightness:brightness alpha:];
}
@end
示例06
@interface _06_Aspect_FitViewController ()
@property (nonatomic,strong) UIView *topView;
@property (nonatomic,strong) UIView *topInnerView;
@property (nonatomic,strong) UIView *bottomView;
@property (nonatomic,strong) UIView *bottomInnerView;
@end @implementation _06_Aspect_FitViewController
-(void)loadView
{
[super loadView];
self.topView = [[UIView alloc] init];
self.topInnerView = [[UIView alloc] init];
self.bottomView = [[UIView alloc] init];
self.bottomInnerView = [[UIView alloc] init];
[self.view addSubview:_topView];
[self.view addSubview:_topInnerView];
[self.view addSubview:_bottomView];
[self.view addSubview:_bottomInnerView];
}
- (void)viewDidLoad {
[super viewDidLoad]; self.topView.backgroundColor = [UIColor redColor];
self.bottomView.backgroundColor = [UIColor blueColor];
self.topInnerView.backgroundColor = [UIColor greenColor];
self.bottomInnerView.backgroundColor = [UIColor grayColor]; [self.topView mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.right.and.top.equalTo(self.view); // 左边、右边、顶部 等于 self.View
}];
[self.bottomView mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.right.and.bottom.equalTo(self.view); // 左边、右边、底部 等于 self.View
make.top.equalTo(self.topView.mas_bottom); // 顶部 等于 topView 的 底部
make.height.equalTo(self.topView); // 高 等于 topView
// 结果：上下55分成
}];
[self.topInnerView mas_makeConstraints:^(MASConstraintMaker *make) {
make.width.equalTo(self.topInnerView.mas_height).multipliedBy(); // 宽度是高度的3倍
make.width.and.height.lessThanOrEqualTo(self.topView); // 宽度、高度 小于 topView的宽度高度
make.width.and.height.equalTo(self.topView).with.priorityLow(); // 宽度、高度 等于 topView的宽度高度 优先级 低
make.center.equalTo(self.topView); // 中心点位置 等于 topView
}];
[self.bottomInnerView mas_makeConstraints:^(MASConstraintMaker *make) {
make.height.equalTo(self.bottomInnerView.mas_width).multipliedBy();// 高度是宽度的3倍
make.width.and.height.lessThanOrEqualTo(self.bottomView); // 宽度、高度 小于 bottomView的宽度高度
make.width.and.height.equalTo(self.bottomView).with.priorityLow(); // 宽度、高度 等于 bottonView的宽度高度 优先级 低
make.center.equalTo(self.bottomView); // 中心点位置 等于 bottonView
}];
}
@end
示例07
@interface _07_Basic_AnimatedViewController ()
@property (nonatomic,strong) UIView *greenView;
@property (nonatomic,strong) UIView *redView;
@property (nonatomic,strong) UIView *blueView; @property (nonatomic,assign) NSInteger padding;
@property (nonatomic, assign) BOOL animating;
@property (nonatomic, strong) NSMutableArray *animatableConstraints;
@end @implementation _07_Basic_AnimatedViewController -(void)loadView
{
[super loadView];
self.greenView = [[UIView alloc]init];
self.redView = [[UIView alloc]init];
self.blueView = [[UIView alloc]init];
[self.view addSubview:self.greenView];
[self.view addSubview:self.redView];
[self.view addSubview:self.blueView];
}
- (void)viewDidLoad {
[super viewDidLoad];
_greenView.backgroundColor = UIColor.greenColor;
_redView.backgroundColor = UIColor.redColor;
_blueView.backgroundColor = UIColor.blueColor; NSInteger padding = self.padding = ;
_animatableConstraints = [NSMutableArray array];
UIEdgeInsets paddingInsets = UIEdgeInsetsMake(_padding,_padding,_padding,_padding); // 一开始 green,red,blue的尺寸 再通过约束来改变
[_greenView mas_makeConstraints:^(MASConstraintMaker *make) {
// 添加约束的同时添加到数组
[_animatableConstraints addObjectsFromArray:@[
make.edges.equalTo(self.view).insets(paddingInsets).priorityLow(), // 优先级低
make.bottom.equalTo(_blueView.mas_top).offset(-padding), // green bottom 相对 blue top -10
]];
make.size.equalTo(_redView); // 大小 = redView
make.height.equalTo(_blueView); // 高 = blue
}];
[_redView mas_makeConstraints:^(MASConstraintMaker *make) {
// 添加约束的同时添加到数组
[_animatableConstraints addObjectsFromArray:@[
make.edges.equalTo(self.view).insets(paddingInsets).priorityLow(), // 优先级低
make.left.equalTo(_greenView.mas_right).offset(padding), // left 红色 green right 10
make.bottom.equalTo(_blueView.mas_top).offset(-padding), // bottom 蓝色 top -10
]]; make.size.equalTo(_greenView); // 大小 = green
make.height.equalTo(_blueView.mas_height); // 高 = blue
}];
[_blueView mas_makeConstraints:^(MASConstraintMaker *make) {
// 添加约束的同时添加到数组
[self.animatableConstraints addObjectsFromArray:@[
make.edges.equalTo(self.view).insets(paddingInsets).priorityLow(), // 优先级低
]];
make.height.equalTo(_greenView);
}];
[self.view layoutIfNeeded]; // 可以注释此部分，查看没有动画时的效果
if (self.view) {
_animating = YES;
[self animateWithInvertedInsets:NO];
}
} - (void)animateWithInvertedInsets:(BOOL)invertedInsets {
if (!_animating) return; // 是否需要动画
NSInteger padding = invertedInsets ? : _padding; // Yes 就缩小100 否 10
UIEdgeInsets paddingInsets = UIEdgeInsetsMake(padding, padding, padding, padding);
for (MASConstraint *constraint in _animatableConstraints) {
constraint.insets = paddingInsets;
}
[UIView animateWithDuration: animations:^{
[self.view layoutIfNeeded];
} completion:^(BOOL finished) {
[self animateWithInvertedInsets:!invertedInsets]; // 取相反值无限循环执行动画
}];
}
@end
示例08
@interface _08_Bacony_LabelsViewController ()
@property (nonatomic,strong) UILabel *longLabel;
@property (nonatomic,strong) UILabel *shortLabel;
@property (nonatomic,strong) UILabel *contentLable;
@end @implementation _08_Bacony_LabelsViewController
- (void)loadView
{
[super loadView];
_longLabel = [[UILabel alloc]init];
_shortLabel = [[UILabel alloc]init];
_contentLable = [[UILabel alloc]init];
[self.view addSubview:_longLabel];
[self.view addSubview:_shortLabel];
[self.view addSubview:_contentLable]; }
- (void)viewDidLoad {
[super viewDidLoad];
self.title = @"08_Bacony Labels";
_longLabel.numberOfLines = ;
_longLabel.font =[UIFont systemFontOfSize:];
_longLabel.backgroundColor = [UIColor redColor];
_longLabel.textColor = [UIColor darkGrayColor];
_longLabel.lineBreakMode = NSLineBreakByTruncatingTail;
_longLabel.text = @"Bacon ipsum dolor sit amet spare ribs fatback kielbasa salami, tri-tip jowl pastrami flank short loin rump sirloin. Tenderloin frankfurter chicken biltong rump chuck filet mignon pork t-bone flank ham hock.";
_shortLabel.numberOfLines = ;
_shortLabel.textColor = [UIColor purpleColor];
_shortLabel.backgroundColor = [UIColor yellowColor];
_shortLabel.lineBreakMode = NSLineBreakByTruncatingTail;
_shortLabel.text = @"Bacon"; _contentLable.numberOfLines = ;
_contentLable.font =[UIFont systemFontOfSize:];
_contentLable.backgroundColor = [UIColor greenColor];
_contentLable.textColor = [UIColor darkGrayColor];
_contentLable.lineBreakMode = NSLineBreakByTruncatingTail;
_contentLable.text = @"枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客枫子的博客";
// 只设置left top
[_longLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.equalTo(self.view).offset();
make.top.equalTo(self.view).offset();
}];
// 只设置 centerY right
[_shortLabel mas_makeConstraints:^(MASConstraintMaker *make) {
make.centerY.equalTo(_longLabel); //
make.right.equalTo(self.view).offset(-);
}];
// top left right 根据文字多少自动计算高度
[_contentLable mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(_longLabel.mas_bottom).offset();
make.left.equalTo(@);
make.right.equalTo(self.view).offset(-);
}];
}
-(void)viewDidLayoutSubviews
{
[super viewDidLayoutSubviews];
CGFloat width = CGRectGetMinX(self.shortLabel.frame)-;
width -= CGRectGetMinX(self.longLabel.frame);
self.longLabel.preferredMaxLayoutWidth = width;
}
@end
示例09
@interface _09_UIScrollViewViewController ()
@property (nonatomic,strong) UIScrollView *scrollView;
@property (nonatomic,strong) UIView *contentView;
@end @implementation _09_UIScrollViewViewController
-(void)loadView
{
[super loadView];
_scrollView = [[UIScrollView alloc]init];
_contentView = [[UIView alloc]init];
[self.view addSubview:_scrollView];
[self.scrollView addSubview:_contentView];
}
- (void)viewDidLoad {
[super viewDidLoad];
self.title = @"09_UIScrollView";
_scrollView.backgroundColor = [UIColor grayColor];
[_scrollView mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(self.view); // self.view一样大小
}];
_contentView.backgroundColor = [UIColor greenColor];
[_contentView mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(_scrollView); // 大小 = _scrollView
make.width.equalTo(_scrollView); // width = _scrollView
}]; UIView *lastView;
CGFloat height = ; for (int i = ; i < ; i++) {
UIView *view = [[UIView alloc]init];
view.backgroundColor = [self randomColor];
[_contentView addSubview:view];
// 点击 改变透明度
UITapGestureRecognizer *singleTap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(singleTap:)];
[view addGestureRecognizer:singleTap]; [view mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(lastView ? lastView.mas_bottom : @); // 第一个View top = 0;
make.left.equalTo(@); // left 0
make.width.equalTo(_contentView); // width = _contentView;
make.height.equalTo(@(height)); // heinght = height
}]; height += ; // += 25;
lastView = view;
} [_contentView mas_makeConstraints:^(MASConstraintMaker *make) {
make.bottom.equalTo(lastView); // bottom = lastView
}]; } - (UIColor *)randomColor {
CGFloat hue = ( arc4random() % / 256.0 ); // 0.0 to 1.0
CGFloat saturation = ( arc4random() % / 256.0 ) + 0.5; // 0.5 to 1.0, away from white
CGFloat brightness = ( arc4random() % / 256.0 ) + 0.5; // 0.5 to 1.0, away from black
return [UIColor colorWithHue:hue saturation:saturation brightness:brightness alpha:];
} - (void)singleTap:(UITapGestureRecognizer*)sender {
[sender.view setAlpha:sender.view.alpha / 1.20]; // To see something happen on screen when you tap :O
[self.scrollView scrollRectToVisible:sender.view.frame animated:YES];
};
示例10
static CGFloat const kArrayExampleIncrement = 10.0;
@interface _10_ArrayViewController ()
@property (nonatomic,strong) UIView *line;
@property (nonatomic,strong) UIButton *raiseButton;
@property (nonatomic,strong) UIButton *centerButton;
@property (nonatomic,strong) UIButton *lowerButton; @property (nonatomic, assign) CGFloat offset;
@property (nonatomic, strong) NSArray *buttonViews;
@end @implementation _10_ArrayViewController
-(void)loadView
{
[super loadView];
_line = [[UIView alloc]init];
_raiseButton = [UIButton buttonWithType:UIButtonTypeSystem];
_centerButton = [UIButton buttonWithType:UIButtonTypeSystem];
_lowerButton = [UIButton buttonWithType:UIButtonTypeSystem]; [self.view addSubview:_line];
[self.view addSubview:_raiseButton];
[self.view addSubview:_centerButton];
[self.view addSubview:_lowerButton];
}
- (void)viewDidLoad {
[super viewDidLoad];
_line.backgroundColor = [UIColor redColor];
[_raiseButton setTitle:@"Raise" forState:UIControlStateNormal];
[_centerButton setTitle:@"Center" forState:UIControlStateNormal];
[_lowerButton setTitle:@"Lower" forState:UIControlStateNormal];
[_raiseButton addTarget:self action:@selector(raiseAction) forControlEvents:UIControlEventTouchUpInside];
[_centerButton addTarget:self action:@selector(centerAction) forControlEvents:UIControlEventTouchUpInside];
[_lowerButton addTarget:self action:@selector(lowerAction) forControlEvents:UIControlEventTouchUpInside];
// 添加跟中线，方便查看按钮的移动
[_line mas_makeConstraints:^(MASConstraintMaker *make) {
make.width.equalTo(self.view);
make.height.equalTo(@);
make.center.equalTo(self.view);
}];
[_raiseButton mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.equalTo(self.view).with.offset(10.0);
}]; [_centerButton mas_makeConstraints:^(MASConstraintMaker *make) {
make.centerX.equalTo(self.view);
}]; [_lowerButton mas_makeConstraints:^(MASConstraintMaker *make) {
make.right.equalTo(self.view).with.offset(-);
}];
self.buttonViews = @[_raiseButton, _lowerButton, _centerButton];
}
- (void)centerAction {
self.offset = 0.0;
} - (void)raiseAction {
self.offset -= kArrayExampleIncrement;
} - (void)lowerAction {
self.offset += kArrayExampleIncrement;
} - (void)setOffset:(CGFloat)offset {
_offset = offset;
[self.view setNeedsUpdateConstraints];
[UIView animateWithDuration:0.2 animations:^{
[self.view layoutIfNeeded];
}];
}
- (void)updateViewConstraints {
// 同时更新多个按钮的约束
[self.buttonViews mas_updateConstraints:^(MASConstraintMaker *make) {
make.baseline.equalTo(self.view.mas_centerY).with.offset(self.offset); // buttonViews的底线
}];
[super updateViewConstraints]; } @end
示例11
@interface _11_Attribute_ChainingViewController ()
@property (nonatomic,strong) UIView *greenView;
@property (nonatomic,strong) UIView *redView;
@property (nonatomic,strong) UIView *blueView;
@end @implementation _11_Attribute_ChainingViewController -(void)loadView
{
[super loadView];
_greenView = [[UIView alloc]init];
_redView = [[UIView alloc]init];
_blueView = [[UIView alloc]init];
[self.view addSubview:_greenView];
[self.view addSubview:_redView];
[self.view addSubview:_blueView]; }
- (void)viewDidLoad {
[super viewDidLoad];
UIEdgeInsets padding = UIEdgeInsetsMake(, , , );
_greenView.backgroundColor = UIColor.greenColor;
[_greenView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.and.left.equalTo(self.view).insets(padding); // 顶部15 左边 10
make.bottom.equalTo(_blueView.mas_top).insets(padding); // 底部与蓝色 15
make.width.equalTo(_redView.mas_width); // 宽度与红色相等
make.height.equalTo(@[_redView, _blueView]); // 高度与红蓝相等
}];
_redView.backgroundColor = UIColor.redColor;
[_redView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.and.right.equalTo(self.view).insets(padding); // 顶部15 右边 10
make.left.equalTo(_greenView.mas_right).insets(padding);// 左边与绿色 10
make.bottom.equalTo(_blueView.mas_top).insets(padding); // 底部与蓝色 15
make.width.equalTo(_greenView.mas_width); // 宽度与红色相等
make.height.equalTo(@[_greenView, _blueView]); // 高度与绿蓝相等
}];
_blueView.backgroundColor = UIColor.blueColor;
[_blueView mas_makeConstraints:^(MASConstraintMaker *make) {
make.top.equalTo(_greenView.mas_bottom).insets(padding); // 顶部绿色 15
make.left.right.and.bottom.equalTo(self.view).insets(padding); // 左边 10 右边 10 底部 15
make.height.equalTo(@[_greenView, _redView]); // 高度与红绿相等
}];
}
@end
示例12
@interface _12_Layout_GuidesViewController ()
@property (nonatomic,strong) UIView *topView;
@property (nonatomic,strong) UIView *bottomView;
@end @implementation _12_Layout_GuidesViewController
-(void)loadView
{
[super loadView];
_topView = [[UIView alloc]init];
_bottomView = [[UIView alloc]init];
[self.view addSubview:_topView];
[self.view addSubview:_bottomView];
}
- (void)viewDidLoad {
[super viewDidLoad];
_topView.backgroundColor = UIColor.greenColor;
[_topView mas_makeConstraints:^(MASConstraintMaker *make) {
UIView *topLayoutGuide = (id)self.topLayoutGuide; //显示屏幕内容的垂直程度最高,使用自动布局的约束。(只读)
make.top.equalTo(topLayoutGuide.mas_bottom);
make.left.equalTo(self.view);
make.right.equalTo(self.view);
make.height.equalTo(@);
}];
_bottomView.backgroundColor = UIColor.redColor;
[_bottomView mas_makeConstraints:^(MASConstraintMaker *make) {
UIView *bottomLayoutGuide = (id)self.bottomLayoutGuide;
make.bottom.equalTo(bottomLayoutGuide.mas_top);
make.left.equalTo(self.view);
make.right.equalTo(self.view);
make.height.equalTo(@);
}];
}
@end
iOS_autoLayout_Masonry的更多相关文章
- Coding源码学习第四部分(Masonry介绍与使用(三))
接上篇继续进行Masonry 的学习. (12)tableViewCell 布局 #import "TableViewController.h" #import "Tes ...
随机推荐
- MySql 首记
1.连接数据: 格式是: -P 端口号 -h mysql主机名\ip -u root (用户) -p 2.显示数据库: show databases; 3.选择数据库: use databas ...
- 十二、Java基础---------异常处理机制
异常 异常 异常就是程序在运行时产生的异常情况. 异常的由来 问题也是现实生活中的具体事物,也可以通过java 类的形式进行描述,并封装成对象.异常就是java 对不正常情况进行描述后的对象的体现. ...
- InnerJoin分页导致的数据重复问题排查
2016年8月9号美好的七夕的早上,我精神抖擞地来到公司.一会之后,客服宅宅MM微信我,说一个VIP大店铺订单导出报表中一个订单有重复行.于是,我赶紧开始查探问题所在.经过一天的反复仔细追查(当然还包 ...
- [转]网络诊断工具：MTR
MTR是Linux平台上一款非常好用的网络诊断工具,集成了traceroute.ping.nslookup的功能,用于诊断网络状态非常有用.能按要求对路由中所有节点进行批量测试 第一列(Host):I ...
- eclipse启动时虚拟机初始内存配置
eclipse启动时虚拟机初始内存配置: -Xms256M -Xmx512M -XX:PermSize=256m -XX:MaxPermSize=512m
- 初识python第一天
一.python简介 1.1 python的诞生 python的创始人吉多.范罗苏姆(Guido van Rossum),他在开发python语言之前曾使用过几年的ABC语言,ABC是一门主要用于教学 ...
- myisam压缩（前缀压缩）索引
myisam使用前缀压缩来减少索引的大小,从而让更多的索引可以放入内存中,默认只压缩字符串,但通过参数配置也可以对整数做压缩,myisam压缩每个索引块的方法是,先完全保存索引块中的第一个值,然后将其 ...
- Linux 2.6内核Makefile浅析
1 概述 Makefile由五个部分组成: Makefile:根目录Makefile,它读取.config文件,并负责创建vmlinux(内核镜像)和modules(模块文件). .config:内核 ...
- 关于.net编译时目标生成平台
x86: 将程序集编译为由兼容 x86 的 32 位公共语言运行库运行. x64: 将程序集编译为由支持 AMD64 或 EM64T 指令集的计算机上的 64 位公共语言运行库运行. anycpu:( ...
- 什么是 HTML？
前言 在 W3C(万维网联盟)官网里,有一套针对于初学者的 HTML 培训教程,为期四周.为了提升自己的翻译水平,同时帮助大家入门,我给大家翻译出来,以供参考. 1. 什么是 HTML HTML 是创 ...