Autolayout约束的代码实现方式-2(VFL)

VFL是苹果官方推出的一种改善纯代码实现约束的语法糖

下面是一个例子：

    // 蓝色控件

    UIView *blueView = [[UIViewalloc]
init];

    blueView.backgroundColor = [UIColorblueColor];

    blueView.translatesAutoresizingMaskIntoConstraints =NO;

    [self.viewaddSubview:blueView];
    //水平约束

    NSString *vfl =@"H:|-margin-[blueView]-margin-|";

    NSNumber *margin =@20;

    NSDictionary *metric =NSDictionaryOfVariableBindings(margin);

    NSDictionary *views =NSDictionaryOfVariableBindings(blueView);
   
NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:vfl

options:NSLayoutFormatAlignAllTop | NSLayoutFormatAlignAllBottom

metrics:metric v
news:views ];

    [self.viewaddConstraints:constraints];

    // 垂直约束

    NSString *vfl2 =@"V:|-margin-[blueView(height)]";

    NSNumber *height =@40;

    NSDictionary *metric2 =NSDictionaryOfVariableBindings(margin, height);

    NSArray *constraints2 = [NSLayoutConstraint constraintsWithVisualFormat:vfl2

options:kNilOptions

metrics:metric2 

views:views ];

    [self.viewaddConstraints:constraints2];
参数解读：
* vfl表示约束的语法

* "H"代表Horizontal，表示水平方向

* margin是自定义的间距

* 中间的blueView则代表被设定约束的控件

* NSDictionaryOfVariableBindings方法可以快速定义出字典类实例。

* NSLayoutConstraint constraintsWithVisualFormat 方法中，参数vol表示约束的语法；metric表示除了被设定约束的控件本身的其他约束参数字典集合；views表示被设定约束的控件字典集合

* options这个参数表示水平或者垂直方向上的所有控件是不是上下对齐、居中对齐或者左右对齐等

总结：

VFL形式设定的约束比起纯代码设置的约束会优雅一些，但并不是非常优雅，并且有些功能无法实现，还需要与纯代码方式结合才能完成特定的约束规则，比如两个控件并排在父控件的最下方，两个的宽度和高度完全一样，与父控件和彼此的间距也一样，通过VFL的话：

A控件水平方向的设定： NSString *vfl = @"H:|-margin-[blueView]-margin-[redView(==blueView)]-margin-|";
A控件垂直方向的设定： NSString *vfl2 = @"V:[blueView(height)]-margin-|";
与此同时无法同时设定B控件的宽高与A控件一致，所以还需另外设定纯代码约束：

NSLayoutConstraint *约束1 = [NSLayoutConstraint constraintWithItem:B控件 

attribute:NSLayoutAttributeTop(顶部) 

relatedBy:NSLayoutRelationEqual(等于) 

toItem:A控件 

attribute:NSLayoutAttributeTop(顶部)

multiplier:1.0(乘数) 

constant:0(加数) ];

NSLayoutConstraint *约束2 = [NSLayoutConstraint constraintWithItem:B控件

attribute:NSLayoutAttributeBottom(底部) 

relatedBy:NSLayoutRelationEqual(等于)

toItem:A控件 

attribute:NSLayoutAttributeBottom(底部) 

multiplier:1.0(乘数)

constant:0(加数) ];

这样才能完整的设定B控件与A控件的一致的约束，所以如果要代码实现的话最好还是使用第三方的框架，比如Masonry框架，将在下一章中介绍。