iOS - NSLayoutConstraint - VFL

用习惯了Masonry，今日创建新项目时在还没导入第三方时，突然想到了NSLayoutConstraint的使用，很久没用了记录一下。

API_AVAILABLE(macos(10.7), ios(6.0), tvos(9.0))

+ (NSArray<NSLayoutConstraint *> *)constraintsWithVisualFormat:(NSString *)format 
                   options:(NSLayoutFormatOptions)opts 
                   metrics:(**nullable** NSDictionary<NSString *, **id**> *)metrics
                     views:(NSDictionary<NSString *, **id**> *)views

VFL语法

表达式	功能	示例	示例注解
H:	水平方向	H:|-16-[view]-16-|	view水平方向基于父视图左右两边距离为16
V:	垂直方向	V:|-16-[view]-16-|	view垂直方向基于父视图上下两边距离为16
[]	视图名称	V:|-16-[view]-16-|	[]括号里面的视图代表你要处理的视图
()	视图大小参数	H:|-16-[view(50)]	view宽度为50，左边边距为16
>=、<=	大于(小于)等于	V:|-16-[view(>=50)]	view上边距为16，view高度大于等于50
-	距离	H:|-16-[view]-16-|	两边距离为16

示例

UILabel *label0 = [[UILabel alloc] init];
label0.font = [UIFont systemFontOfSize:14 weight:UIFontWeightMedium];
[superView addSubview:label0];
label0.backgroundColor = UIColor.orangeColor;
label0.translatesAutoresizingMaskIntoConstraints = NO;

UILabel *label1 = [[UILabel alloc] init];
label1.numberOfLines = 10;
label1.font = [UIFont systemFontOfSize:14 weight:UIFontWeightMedium];
label1.preferredMaxLayoutWidth = 400;
[superView addSubview:label1];
label1.backgroundColor = UIColor.redColor;
label1.translatesAutoresizingMaskIntoConstraints = NO;


// 两个label并排
// 左边距为16, 右边边距也为16
// label0 宽度为80 label 宽度最小为50，根据内容调整宽度
[superView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-16-[label0(80)]-[label1(>=50)]-16-|" options:NSLayoutFormatDirectionLeadingToTrailing metrics:nil views:NSDictionaryOfVariableBindings(label0,label1)]];

// label0 上边距为100
// label0 高度 为 60
[superView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-100-[label0(60)]" options:NSLayoutFormatDirectionLeadingToTrailing metrics:nil views:NSDictionaryOfVariableBindings(label0)]];
[superView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-100-[label1(60)]" options:NSLayoutFormatDirectionLeadingToTrailing metrics:nil views:NSDictionaryOfVariableBindings(label1)]];

label0.text = @"测试文";
label1.text = @"文质彬彬，然后君子。人不知而不愠，不亦君子乎。文质彬彬，然后君子。人不知而不愠，不亦君子乎。文质彬彬，然后君子。人不知而不愠，不亦君子乎。文质彬彬，然后君子。人不知而不愠，不亦君子乎。文质彬彬，然后君子。";