IOS开发-VFL语言

来源：互联网发布：上海游泳教练知乎编辑：程序博客网时间：2024/05/16 15:58

Visual Format Language，翻译过来时可视化格式语言，是苹果公司用来简化Autolayout代码量的语言。
实例：
（1）H:[(redView(72))]-12-[blueView(50)]
首字母表示水平方向，意思是有一个redview宽度72，距离这个redview右边12个点的距离有一个宽度为50的blueview。

（2）H:[redView(>=60@700)]
redview的宽度大于等于60，优先级最大宽度是700（优先级最大值为1000，所以先满足700）

（3）V:[redView][blueView(==redView)]
redview在垂直方向上的下方紧接着一个blueview，其高度跟redview一致。

（4）H:|-10-[redview]-[blueView]-[yellowView(>=20)]-|
首尾两条竖线表示的是父控件的边缘，水平方向上redView距离父控件左边默认10个点的间隔，redview右边是blueView默认间隔，yellowView高度大于等于20距离在blueView的右边默认间隔。

应用例子：
这里写图片描述

CGFloat margin = 10;    //添加水平方向约束    NSString *vfl = @"H:|-margin-[buleView]-margin-|";    NSDictionary *views = NSDictionaryOfVariableBindings(buleView);    NSDictionary *metrics = @{@"margin":@(margin)};    NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:vfl options:kNilOptions metrics:metrics views:views];    [self.view addConstraints:constraints];    //添加竖直方向约束    NSString *vfl2 = @"V:|-64-[buleView(50)]";    NSDictionary *views2 = NSDictionaryOfVariableBindings(buleView);    NSArray *constraints2 = [NSLayoutConstraint constraintsWithVisualFormat:vfl2 options:kNilOptions metrics:nil views:views2];    [self.view addConstraints:constraints2];

这里写图片描述
代码如下：

    UIView *buleView = [[UIView alloc]init];    buleView.translatesAutoresizingMaskIntoConstraints = NO;    [buleView setBackgroundColor:[UIColor blueColor]];    [self.view addSubview:buleView];    UIView *redView = [[UIView alloc]init];    redView.translatesAutoresizingMaskIntoConstraints = NO;    [redView setBackgroundColor:[UIColor redColor]];    [self.view addSubview:redView];    CGFloat margin = 10;    //添加水平方向约束    NSString *vfl = @"H:|-margin-[buleView]-margin-[redView(==buleView)]-margin-|";    NSDictionary *views = NSDictionaryOfVariableBindings(buleView,redView);    NSDictionary *metrics = @{@"margin":@(margin)};    NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:vfl options:kNilOptions metrics:metrics views:views];    [self.view addConstraints:constraints];    //添加竖直方向约束    CGFloat height = 40;    NSString *vfl2 = @"V:[buleView(height)]-margin-|";    NSDictionary *views2 = NSDictionaryOfVariableBindings(buleView);    NSDictionary *metrics2 =  @{@"margin":@(margin),@"height":@(height)};    NSArray *constraints2 = [NSLayoutConstraint constraintsWithVisualFormat:vfl2 options:kNilOptions metrics:metrics2 views:views2];    [self.view addConstraints:constraints2];    //添加还剩余的约束    NSLayoutConstraint *topConstraint = [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:buleView attribute:NSLayoutAttributeTop multiplier:1.0 constant:0];    [self.view addConstraint:topConstraint];    NSLayoutConstraint *bottomConstraint = [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:buleView attribute:NSLayoutAttributeBottom multiplier:1.0 constant:0];    [self.view addConstraint:bottomConstraint];

为什么文中还是用了非vfl得语言，因为有些约束是不能通过vfl来表达的。这个苹果官方也有表明。但在文中可以在option那里填入NSLayoutFormatAlignAllTop|NSLayoutFormatAlignAllBottom，就能达到那个效果，就可以不用添加NSLayoutConstraint了。

0 0