在 UIScrollView 中，具有视觉格式的 NSLayoutConstraints 无法按预期工作？ [复制]答案

【问题标题】：NSLayoutConstraints with visual format doesn't work as expected when in UIScrollView? [duplicate]在 UIScrollView 中，具有视觉格式的 NSLayoutConstraints 无法按预期工作？ [复制]
【发布时间】：2019-02-08 01:50:43
【问题描述】：

我将UILabel 放入UIScrollView 中，我想将这些约束添加到标签中：

上边距为 20
左边距为 20
右边距为 20
标签高度为 40

这是我使用视觉格式为这些约束编写的代码：

let label = UILabel.init(frame: .zero)
label.translatesAutoresizingMaskIntoConstraints = false
label.text = "Some Text"
scrollView.addSubview(label)

let horizontalConstraints = NSLayoutConstraint.constraints(
    withVisualFormat: "H:|-20-[label]-20-|",
    options: [],
    metrics: nil,
    views: ["label": label]
)

let verticalConstraints = NSLayoutConstraint.constraints(
    withVisualFormat: "V:|-20-[label(40)]",
    options: [],
    metrics: nil,
    views: ["label": label]
)

NSLayoutConstraint.activate(horizontalConstraints + verticalConstraints)

但是this picture 是我得到的（无法上传照片，因为我的声誉很低）。我给视图添加了边框，蓝色的是UIScrollView的边框，红色的是UILabel的边框

【问题讨论】：

使用NSLayoutConstraint 会好很多
scrollView 的约束是否已正确设置？
另外，需要处理FVL吗？我会假设有更简单的选择，你可能想检查一下：stackoverflow.com/questions/26180822/…
谢谢你们，我已经在下面发布了答案

标签： ios swift

【解决方案1】：

您的代码不正确。这是您的代码的外观。并且如果你使用这种添加约束的方式，你不需要用特殊的方法来激活约束。这些垂直和水平约束已经激活。

//horizontal constraints
scrollView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|-20-[v0]-20-|", 
options: NSLayoutFormatOptions(), metrics: nil, views: ["v0": label]))

//vertical constraints
scrollView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|-20-[v0(40)]", 
options: NSLayoutFormatOptions(), metrics: nil, views: ["v0": label]))

语法解释：

"H", "V" - 水平、垂直约束

"|" - 锚点，例如"H:|[v0]" - 左锚点

"-20-" - 偏移量，例如“V:|-20-[v0]” - 偏移量为 20 的顶部锚

"[v0(40)]" - 这是视图的大小，例如"V:[v0(40)]" - 高度为 40

"[v0]" - 你的第一个视觉格式视图。这种格式可以为多个视图设置约束。

例如：

(格式: "V:|-16-[v0]-8-[v1(44)]-16-[v2(1)]|", 浏览量: ["v0": firstView], ["v1 ": secondView], ["v2": thirdView])

【讨论】：

【解决方案2】：

我想通了。虽然我不知道为什么会发生这种情况，无论是UIScrollView 的错误还是必须这样做。

显然，当您在 Story Board 中将子视图添加到 UIScrollView 时，您总是会收到警告说子视图的位置不明确。所以，你要做的就是在滚动视图中添加一个UIView 并向其中添加这些约束：

顶部 = 0，前导 = 0，尾随 = 0，底部 = 0
UIView 在滚动视图中水平和垂直居中

之后，您最好将子视图添加到 UIView 而不会收到这些警告。

同样的道理在这里也适用，当你想以编程方式将子视图添加到 UIScrollView 并设置一些约束时，你应该在滚动视图中放置一个 UIView 并将所有子视图放在 UIView 中：

let subviewContainer = UIView.init(frame: .zero)
subviewContainer.translatesAutoresizingMaskIntoConstraints = false
scrollView.addSubview(subviewContainer)

var constraints: [NSLayoutConstraint] = []

// Step 1, set up horizontal constraints to make leading & trailing = 0
constraints += NSLayoutConstraint.constraints(
    withVisualFormat: "H:|-0-[subviewContainer]-0-|",
    options: [],
    metrics: nil,
    views: ["subviewContainer": subviewContainer]
)

// Step 2, set up vertical constraints to make top & bottom = 0
constraints += NSLayoutConstraint.constraints(
    withVisualFormat: "V:|-0-[subviewContainer]-0-|",
    options: [],
    metrics: nil,
    views: ["subviewContainer": subviewContainer]
)

// **Step 3, center "subviewContainer" horizontally & vertically in scroll view**
constraints.append(
    NSLayoutConstraint.init(
        item: subviewContainer,
        attribute: .centerX,
        relatedBy: .equal,
        toItem: scrollView,
        attribute: .centerX,
        multiplier: 1,
        constant: 0
    )
)

constraints.append(
    NSLayoutConstraint.init(
        item: subviewContainer,
        attribute: .centerY,
        relatedBy: .equal,
        toItem: scrollView,
        attribute: .centerY,
        multiplier: 1,
        constant: 0
    )
)

// Step 4, activate all constraints
NSLayoutConstraint.activate(constraints)

完成这 4 个步骤后，您现在可以将子视图添加到“subviewContainer”。

【讨论】：