VFL简介
VFL全称是Visual Format Language（可视化格式语言），它简化了Autolayout， 通过一行字符串，你可以在水平或者垂直方向上指定多个约束, 这跟一次只能创建一个约束相比会节省大量的代码量
编译代码写的布局时，相关的View都需要将translatesAutoresizingMaskIntoConstraints设置为NO
blueView.translatesAutoresizingMaskIntoConstraints = NO;
VFL用法
VFL字符串语法
- H ：水平方向
-
V ：垂直方向
注： 不指定方向默认水平方法 - | ：父视图
- -：标准间隔(默认左右边距8像素，上边距20像素)
- -xx- 非标准间隔(xx像素)
- ==：宽度相等（可省略）
- <=：小于等于
- >=：大于等于
- @250：约束的优先级，取值范围为0~1000（250、750、1000）
示例：
H:|-20-[blueView]-20-|
水平方向上，blueView距离父视图的左右俩边距均为20
V:|-[button(50.0)]：
垂直方向上，距离父视图顶部标准默认间距20，button高度为50
H:|-20-[blueView(100)]
水平方向上，blueView距离父视图的左边距为20，blueView的宽为100
V:[blueView(50)]-100@250-|
垂直方向上，blueView高度为50，blueView 距离父视图底部边距为100，@250优先级为低, 如果自动布局有冲突时, 该条约束就有可能失效
H:|-[blueView(50)]-10-[redView]-10-[yellowView(blueView)]|
水平方向上，blueView距离父视图的左边距为标准间隔（默认8像素），yellowView距离父视图的右边距为0，redView距离blueView和yellowView左右边距均为10，blueView和yellowView等宽
主要函数
+ (NSArray *)constraintsWithVisualFormat:(NSString *)format
options:(NSLayoutFormatOptions)opts
metrics:(NSDictionary *)metrics
views:(NSDictionary *)views
format：VFL语句
VFL字符串-
opts：约束类型
opts参数是个枚举值，表示对齐方式
opts约束类型UIView *blueView = [[UIView alloc]init]; blueView.backgroundColor = [UIColor blueColor]; [self.view addSubview:blueView]; blueView.translatesAutoresizingMaskIntoConstraints = NO; UIView *redView = [[UIView alloc]init]; redView.backgroundColor = [UIColor redColor]; [self.view addSubview:redView]; redView.translatesAutoresizingMaskIntoConstraints = NO; NSNumber *width = @100.0; NSNumber *height = @100.0; NSDictionary *viewsDic = @{@"blueView":blueView,@"redView":redView}; NSDictionary *metricsDic = @{@"width":width,@"height":height}; //设置对齐方式，redView与blueView的上面和下面对齐 NSLayoutFormatOptions ops = NSLayoutFormatAlignAllTop|NSLayoutFormatAlignAllBottom; //水平约束 NSString *vfl1 = @"H:|-50-[blueView(width)]-30-[redView(width)]"; NSArray *constraints1 = [NSLayoutConstraint constraintsWithVisualFormat:vfl1options:ops metrics:metricsDic views:viewsDic]; [self.view addConstraints:constraints1]; //垂直约束 NSString *vfl2 = @"V:|-100-[blueView(height)]"; NSArray *constraints2 = [NSLayoutConstraint constraintsWithVisualFormat:vfl2 options:ops metrics:metricsDic views:viewsDic]; [self.view addConstraints:constraints2];
-
metrics：VFL语句中用到的具体数值
metrics参数是一个字典, 里面可以存储一些数值, 这样存储之后就可以在VFL字符串中调用了UIView *blueView = [[UIView alloc]init]; blueView.backgroundColor = [UIColor blueColor]; [self.view addSubview:blueView]; blueView.translatesAutoresizingMaskIntoConstraints = NO; CGFloat height = 100.0; CGFloat width = 100.0; //width代替 100.0，height代替 100.0 NSString *vfl1 = @"H:|-30-[blueView(width)]-30-|"; NSDictionary *views = @{@"blueView":blueView}; //metrics参数中做好对应关系 NSArray *constraints1 = [NSLayoutConstraint constraintsWithVisualFormat:vfl1 options:kNilOptions metrics:@{@"width":@(width)} views:views]; [self.view addConstraints:constraints1]; NSString *vfl2 = @"V:|-30-[blueView(height)]-30-|"; NSArray *constraints2 = [NSLayoutConstraint constraintsWithVisualFormat:vfl2 options:kNilOptions metrics:@{@"height":@(height)} views:views]; [self.view addConstraints:constraints2];
-
views：VFL语句中用到的控件
views参数是一个字典，里面可以存储一些数值, 这样存储之后就可以在VFL字符串中调用了
为了方便苹果官方提供了一个宏,传入相关的view变量名，返回可以直接使用的dictionary
示例NSDictionaryOfVariableBindings() 示例 NSDictionaryOfVariableBindings(v1, v2, v3) 等价于 [NSDictionary dictionaryWithObjectsAndKeys:v1, @”v1”, v2, @”v2”, v3, @”v3”, nil];UIView *blueView = [[UIView alloc]init]; blueView.backgroundColor = [UIColor blueColor]; [self.view addSubview:blueView]; blueView.translatesAutoresizingMaskIntoConstraints = NO; CGFloat height = 100.0; CGFloat width = 100.0; NSString *vfl1 = @"H:|-30-[blueView(width)]-30-|"; NSDictionary *views = NSDictionaryOfVariableBindings(blueView); //NSDictionary *views = @{@"blueView":blueView}; //同上 NSArray *constraints1 = [NSLayoutConstraint constraintsWithVisualFormat:vfl1 options:kNilOptions metrics:@{@"width":@(width)} views:views]; [self.view addConstraints:constraints1]; NSString *vfl2 = @"V:|-30-[blueView(height)]-30-|"; NSArray *constraints2 = [NSLayoutConstraint constraintsWithVisualFormat:vfl2 options:kNilOptions metrics:@{@"height":@(height)} views:views]; [self.view addConstraints:constraints2];
VFL缺点
VFL可以满足大部分布局需求，不能设置一个视图自身的宽高比，也不能剧中对齐父视图。为了做到这些，你需要创建一些独特的约束
