-
NSLayoutConstraint,系统的布局类
/** 系统默认添加约束的方法，它是NSLayoutConstraint的类方法 @param view1 想要添加约束的控件 @param attr1 想要添加约束的方向 @param relation 传入与约束值的关系，大于、等于还是小于 @param view2 被参照对象 @param attr2 被参照对象所被参照的方向，如顶部、左边、右边等 @param multiplier 间距倍数关系 @param c 最终的差值 @return NSLayoutConstraint对象 *///+(instancetype)constraintWithItem:(id)view1// attribute:(NSLayoutAttribute)attr1// relatedBy:(NSLayoutRelation)relation// toItem:(nullable id)view2// attribute:(NSLayoutAttribute)attr2// multiplier:(CGFloat)multiplier// constant:(CGFloat)c
-(void)sysAutolayout{ /// red view UIView *redView = [[UIView alloc] init]; [self.view addSubview:redView]; redView.backgroundColor = [UIColor redColor]; //⚠️:一定要加上这句代码，否则添加的约束会有冲突 redView.translatesAutoresizingMaskIntoConstraints = NO; //左边的约束 NSLayoutConstraint *redLeftCons = [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeLeft relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeLeft multiplier:1 constant:20];// [self.view addConstraint:redLeftCons]; redLeftCons.active = YES;//这是官方建议的方法 //底部的约束 NSLayoutConstraint *redBottomCons = [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeBottom multiplier:1 constant:-20]; //⚠️:只在没有参照控件时(即toItem为nil)，约束才添加到自己身上，不然添加到父视图上// [self.view addConstraint:redBottomCons]; redBottomCons.active = YES; //宽度约束 //可以参照其他控件设置约束,如下:// [NSLayoutConstraint constraintWithItem:redView// attribute:NSLayoutAttributeWidth// relatedBy:NSLayoutRelationEqual// toItem:self.view// attribute:NSLayoutAttributeWidth// multiplier:0.5// constant:0]; //也可以不参照其他控件 NSLayoutConstraint *redWidthCons = [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:nil attribute:kNilOptions multiplier:1.0 constant:50]; //这里没有参照控件，所以约束添加到自己身上// [redView addConstraint:redWidthCons]; redWidthCons.active = YES; //长度约束,同宽度约束 NSLayoutConstraint *redHeightCons = [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:kNilOptions multiplier:1.0 constant:40];// [redView addConstraint:redHeightCons]; redHeightCons.active = YES; /// blue view UIView *blueView = [[UIView alloc] init]; [self.view addSubview:blueView]; blueView.backgroundColor = [UIColor blueColor]; _blueView = blueView; blueView.translatesAutoresizingMaskIntoConstraints = NO; NSLayoutConstraint *blueLeftCons = [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeLeft relatedBy:NSLayoutRelationEqual toItem:redView attribute:NSLayoutAttributeRight multiplier:1 constant:10]; [self.view addConstraint:blueLeftCons]; NSLayoutConstraint *blueBottomCons = [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:redView attribute:NSLayoutAttributeBottom multiplier:1 constant:0]; [self.view addConstraint:blueBottomCons]; NSLayoutConstraint *blueWidthCons = [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:nil attribute:kNilOptions multiplier:1 constant:50]; [blueView addConstraint:blueWidthCons]; NSLayoutConstraint *blueHeightCons = [NSLayoutConstraint constraintWithItem:blueView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:kNilOptions multiplier:1 constant:50]; [blueView addConstraint:blueHeightCons]; /// yellow view UIView *yellowView = [[UIView alloc] init]; [self.view addSubview:yellowView]; yellowView.backgroundColor = [UIColor yellowColor]; yellowView.translatesAutoresizingMaskIntoConstraints = NO; NSLayoutConstraint *yellowLeftCons = [NSLayoutConstraint constraintWithItem:yellowView attribute:NSLayoutAttributeLeft relatedBy:NSLayoutRelationEqual toItem:blueView attribute:NSLayoutAttributeRight multiplier:1 constant:10]; [self.view addConstraint:yellowLeftCons]; NSLayoutConstraint *yellowBottomCons = [NSLayoutConstraint constraintWithItem:yellowView attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:redView attribute:NSLayoutAttributeBottom multiplier:1 constant:0]; [self.view addConstraint:yellowBottomCons]; NSLayoutConstraint *yellowWidthCons = [NSLayoutConstraint constraintWithItem:yellowView attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:nil attribute:kNilOptions multiplier:1 constant:50]; [yellowView addConstraint:yellowWidthCons]; NSLayoutConstraint *yellowHeightCons = [NSLayoutConstraint constraintWithItem:yellowView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:kNilOptions multiplier:1 constant:50]; [yellowView addConstraint:yellowHeightCons]; //低优先级的约束 NSLayoutConstraint *yellowLeftCons_1 = [NSLayoutConstraint constraintWithItem:yellowView attribute:NSLayoutAttributeLeft relatedBy:NSLayoutRelationEqual toItem:redView attribute:NSLayoutAttributeRight multiplier:1 constant:10]; //优先级的范围时0-1000，默认是1000 //数字越大，优先级越高 //优先级相同时，会造成约束冲突 yellowLeftCons_1.priority = 250;//此时优先级低于yellowLeftCons，不执行 [self.view addConstraint:yellowLeftCons_1]; [self.view removeConstraint:yellowLeftCons_1];} - VFL
/** VFL创建约束的API @param format 传入某种格式构成的字符串，用以表达需要添加的约束，如@"H:|-margin-[redView(50)]"表示:水平方向上，redview与父控件左边缘保持"margin"间距，redview的宽度为50 @param opts 对齐方式，相对于format中所有视图的对齐约束，如果format只有一个view时，可以不设置 @param metrics 一般传入以间距为key的字典，如:@{@"margin":@20},key要与format参数里所填写的"margin"相同 @param views 传入约束中提到的view，也是字典，如:@{@"redView":redView},key要与format参数里所填写的"redView"相同 @return 返回约束的数组 *///+ (NSArray *)constraintsWithVisualFormat:(NSString *)format options:(NSLayoutFormatOptions)opts metrics:(NSDictionary *)metrics views:(NSDictionary *)views{}//vfl是基于NSLayoutConstraint的一种自动布局方式//format 语法://1.每句的前面都要加@"H:"或者@"V:"，分别代表着水平和垂直方向//2.@"|"代表着边界//3.@"-"用来表示间隙，一般以这样的形式出现@"-20-",也可以先填写标示@"-margin-"，之后通过metrics赋值//4.@"[]"用来存放需要添加约束的view,想要直接设置宽高就这样[redView(50)]//示例//H:[cancelButton(72)]-12-[acceptButton(50)]//cancelButton宽72，acceptButton宽50，它们之间间距12////H:[wideView(>=60@700)]//wideView宽度大于等于60point，该约束条件优先级为700（优先级最大值为1000，优先级越高的约束条件越先被满足）////V:[redBox][yellowBox(==redBox)]//垂直方向上，先有一个redBox，其下方紧接一个高度等于redBox高度的yellowBox////H:|-10-[Find]-[FindNext]-[FindField(>=20)]-|//水平方向上，Find距离父view左边缘间隔10，之后是FindNext距离Find间隔默认宽度；再之后是宽度不小于20的FindField，它和FindNext以及父view右边边缘的间距都是默认宽度。（竖线“|”表示superview的边缘）。 -(void)vflAutolayout{ UIView *redView = [[UIView alloc] init]; [self.view addSubview:redView]; redView.backgroundColor = [UIColor redColor]; redView.translatesAutoresizingMaskIntoConstraints = NO; //这个方法会自动把传入的参数以字典的形式返回，字典的key就是其本身的名字 NSDictionary *redViewInfo = NSDictionaryOfVariableBindings(redView); NSString *hFormat = @"H:|-margin-[redView(redWidth)]"; NSArray *hCons = [NSLayoutConstraint constraintsWithVisualFormat:hFormat options:kNilOptions metrics:@{@"margin":@20,@"redWidth":@50} views:redViewInfo];// [self.view addConstraints:hCons]; [NSLayoutConstraint activateConstraints:hCons]; NSString *vFormat = @"V:|-margin-[redView(redHeight)]"; NSArray *vCons = [NSLayoutConstraint constraintsWithVisualFormat:vFormat options:kNilOptions metrics:@{@"margin":@20,@"redHeight":@100} views:redViewInfo];// [self.view addConstraints:vCons]; [NSLayoutConstraint activateConstraints:vCons];}-(void)vflAutolayout_complex{ UIView *redView = [[UIView alloc] init]; [self.view addSubview:redView]; redView.backgroundColor = [UIColor redColor]; redView.translatesAutoresizingMaskIntoConstraints = NO; UIView *blueView = [[UIView alloc] init]; [self.view addSubview:blueView]; blueView.backgroundColor = [UIColor blueColor]; _blueView = blueView; blueView.translatesAutoresizingMaskIntoConstraints = NO; UIView *yellowView = [[UIView alloc] init]; [self.view addSubview:yellowView]; yellowView.backgroundColor = [UIColor yellowColor]; yellowView.translatesAutoresizingMaskIntoConstraints = NO; // //这个方法会自动把传入的参数以字典的形式返回，字典的key就是其本身的名字 NSDictionary *viewInfo = NSDictionaryOfVariableBindings(redView,blueView,yellowView); NSDictionary *metrics = @{@"margin":@20}; NSString *hConsFormat = @"H:|-margin-[redView(50)]-margin-[blueView(==redView)]-margin-[yellowView(==redView)]"; NSArray *hCons = [NSLayoutConstraint constraintsWithVisualFormat:hConsFormat options:NSLayoutFormatAlignAllTop | NSLayoutFormatAlignAllBottom metrics:metrics views:viewInfo]; [NSLayoutConstraint activateConstraints:hCons]; //设置约束的优先级，需要明确是哪个约束需要设置优先级 NSString *hConsFormat_1 = @"H:|-margin-[redView(50)]-margin@250-[yellowView(==redView)]"; NSArray *hCons_1 = [NSLayoutConstraint constraintsWithVisualFormat:hConsFormat_1 options:NSLayoutFormatAlignAllTop | NSLayoutFormatAlignAllBottom metrics:metrics views:viewInfo]; [NSLayoutConstraint activateConstraints:hCons_1]; NSString *vConsFormat = @"V:|-margin-[redView(50)]"; NSArray *vCons = [NSLayoutConstraint constraintsWithVisualFormat:vConsFormat options:kNilOptions metrics:metrics views:viewInfo]; [NSLayoutConstraint activateConstraints:vCons]; } - masonry
-(void)masonry_autolayout{ UIView *redView = [[UIView alloc] init]; [self.view addSubview:redView]; redView.backgroundColor = [UIColor redColor]; _redView = redView; UIView *blueView = [[UIView alloc] init]; [self.view addSubview:blueView]; blueView.backgroundColor = [UIColor blueColor]; _blueView = blueView; UIView *yellowView = [[UIView alloc] init]; [self.view addSubview:yellowView]; yellowView.backgroundColor = [UIColor yellowColor]; _yellowView = yellowView; [redView mas_makeConstraints:^(MASConstraintMaker *make) { make.top.leading.equalTo(self.view).offset(20); make.width.height.equalTo(@50); }]; [blueView mas_makeConstraints:^(MASConstraintMaker *make) { make.leading.mas_equalTo(redView.mas_trailing).offset(10); make.top.width.height.equalTo(redView); }]; // [yellowView mas_makeConstraints:^(MASConstraintMaker *make) {// make.top.width.height.equalTo(redView);// make.leading.mas_equalTo(blueView.mas_trailing).offset(10);// make.leading.mas_equalTo(redView.mas_trailing).offset(10).priorityLow();// }]; [yellowView mas_makeConstraints:^(MASConstraintMaker *make) { make.top.width.height.equalTo(redView); self.leftCons = make.leading.mas_equalTo(blueView.mas_trailing).offset(10);// make.leading.mas_equalTo(blueView.mas_trailing).offset(10); }]; } - 更新约束
-(void)update_masonry_layout{ _blueView.hidden = YES;// [_yellowView mas_remakeConstraints:^(MASConstraintMaker *make) {// make.top.width.height.equalTo(self.redView);// make.leading.mas_equalTo(self.redView.mas_trailing).offset(10);// }]; //mas_updateConstraints 所做的只是在原有约束的基础上添加约束，如果原来的约束中存在对应的约束就覆盖原约束 //如果原来的约束不存在对应的约束，并且有约束与新的约束相冲突，就需要先删除原约束 [self.leftCons uninstall]; [_yellowView mas_updateConstraints:^(MASConstraintMaker *make) { make.leading.mas_equalTo(self.redView.mas_trailing).offset(10); }];}