iOS 用VFL简化Autolayout代码

前言：在Masonry之前苹果提供的方法，现在VFL已过时。。
一般情况下使用storyboard做Autolayout会很简单，
代码就变得很复杂，
但避免项目中没用用到storyboard或xib
所以还是要做一些必要的了解

VFL：Visual Format Language

可视化格式语言，
是苹果公司为了简化Autolayout的编码而退出的抽象语言。
一种轻量级语言

在介绍之前，先了解一下自动布局的
核心计算公式:（万能公式）
obj1.property1 = (obj2.property2 * multiplier) + constant value

示例：

H:[cancelButton(72)]-12-[acceptButton(50)]
//cancelButton宽度72，acceptButton宽度50，他们间距是12
//H：水平方向

H:[wideView(>=60@700)]
//wideView宽度大于等于60point，该约束条件优先级为700（优先级最大值为1000，优先级越高的约束越先被满足）

V:[redBox][yellowBox(==redBox)]
//垂直方向上，有一个redBox，其下方紧接着一个高度等于redBox高度的yellowBox
//V:垂直方向

H:|-10-[Find]-[FindNext]-[FindField(>=20)]-|
//水平方向上，先左空10point，然后有一个Find，然后有一个FindNext，然后有一个FindField，其高度大于等于20

简单案例：

-(void)test1{
    //1.红色的view
    UIView *redView = [[UIView alloc]init];
    redView.backgroundColor = [UIColor redColor];
    //2.禁止autoresizing自动转为约束
    redView.translatesAutoresizingMaskIntoConstraints = NO;
    [self.view addSubview:redView];
    
    //2.添加约束
    
    //2.1 水平方向
    NSString *hvfl =@"H:|-space-[abc]-space-|";
    //代表：在水平方向上，abc距离左边框20points，距离有边框20points
    NSDictionary *views = @{@"abc":redView};
    NSDictionary *metrics = @{@"space":@20};
    NSArray *hlcs = [NSLayoutConstraint constraintsWithVisualFormat:hvfl options:kNilOptions metrics:metrics views:views];
    [self.view addConstraints:hlcs];
    
    //2.2 垂直方向
    NSString *vvfl = @"V:[abc(40)]-space-|";
    //代表：在垂直方向上，abc高度为40，且距离下边框20points
    NSArray *vlcs = [NSLayoutConstraint constraintsWithVisualFormat:vvfl options:kNilOptions metrics:metrics views:views];
    [self.view addConstraints:vlcs];
}

-(void)test2{
    //1.红色的view
    UIView *redView = [[UIView alloc]init];
    redView.backgroundColor = [UIColor redColor];
    //禁止autoresizing自动转为约束
    redView.translatesAutoresizingMaskIntoConstraints = NO;
    [self.view addSubview:redView];
    
    //2.蓝色的view
    UIView *blueView = [[UIView alloc]init];
    blueView.backgroundColor = [UIColor blueColor];
    //禁止autoresizing自动转为约束
    blueView.translatesAutoresizingMaskIntoConstraints = NO;
    [self.view addSubview:blueView];
    
    //3.添加约束
    //3.1水平方向
//    NSDictionary *views = @{
//                            @"blueView":blueView,
//                            @"redView":redView
//                            };
    NSDictionary *views = NSDictionaryOfVariableBindings(redView,blueView);
    NSDictionary *metrics = @{
                              @"space":@30
                              };
    NSString *hvfl = @"H:|-space-[blueView]-space-[redView(==blueView)]-space-|";
    NSArray *hlcs = [NSLayoutConstraint constraintsWithVisualFormat:hvfl options:NSLayoutFormatAlignAllTop|NSLayoutFormatAlignAllBottom metrics:metrics views:views];
    [self.view addConstraints:hlcs];
    
    //3.2垂直方向
    NSString *vvfl = @"V:[blueView(50)]-space-|";
    NSArray *vlcs = [NSLayoutConstraint constraintsWithVisualFormat:vvfl options:kNilOptions metrics:metrics views:views];
    [self.view addConstraints:vlcs];
}