代码中的视觉格式语言基础约束

HVFL 是一种旨在以简单快速的方式约束 UI 元素的语言。通常，VFL 在 Interface Builder 中具有优于传统 UI 自定义的优势，因为它更具可读性，可访问性和紧凑性。

这是一个 VFL 的例子，其中三个 UIViews 从左到右约束，填充 superView.width，aGradeView

"H:|[bgView][`aGradeView(40)`][`bGradeView(40)`]|"

有两个轴可以将 UI 对象限制为水平和垂直。

VFL 的每一行始终以 H:或 V:开头。如果两者都不存在，则默认选项为 H:

继续，我们有一个管道。|这个符号或管道指的是超级视图。如果你仔细看看上面的 VFL 代码片段，你会注意到其中两个管道。

这表示超视图的两个水平端，外侧左侧和外侧边界。

接下来你会看到一些方括号，在第一组方括号内，我们有 bgView。当我们有方括号时，它指的是一个 UI 元素，现在你可能想知道我们如何在名称和实际 UI 元素之间建立链接，也许是一个出口？

我将在帖子的最后介绍。

如果你看看第二对方括号 [aGradeView(50)]，我们也有一些括号内的括号，当它存在时，它根据轴定义宽度/高度，在这种情况下，宽度为 50 像素。

第一个方括号 [bgView] 没有明确定义的宽度，这意味着它将尽可能地跨越。

好吧，这是基础知识，更多是关于另一个例子中的高级内容。

例如：

    // 1. create views
    UIView *blueView = [[UIView alloc] init];
    blueView.backgroundColor = [UIColor blueColor];
    [self.view addSubview:blueView];

    UIView *redView = [[UIView alloc] init];
    redView.backgroundColor = [UIColor redColor];
    [self.view addSubview:redView];

    // 2. forbid Autoresizing
    blueView.translatesAutoresizingMaskIntoConstraints = NO;
    redView.translatesAutoresizingMaskIntoConstraints = NO;

    // 3. make contraints
    // horizontal
    NSArray *blueH = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-20-[blueView]-20-|" options:NSLayoutFormatAlignAllLeft metrics:nil views:@{@"blueView" : blueView}];
    [self.view addConstraints:blueH];

    // vertical
    NSArray *blueVandRedV = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[blueView(50)]-20-[redView(==blueView)]" options:NSLayoutFormatAlignAllTrailing metrics:nil views:@{@"blueView" : blueView, @"redView" : redView}];
    [self.view addConstraints:blueVandRedV];

    NSLayoutConstraint *redW = [NSLayoutConstraint constraintWithItem:redView attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:blueView attribute:NSLayoutAttributeWidth multiplier:0.5 constant:0];
    [self.view addConstraint:redW];