将子视图布局锚设置为 UIScrollView

Posted 2023-03-15

【中文标题】将子视图布局锚设置为 UIScrollView

【英文标题】：Setting subviews layout anchors to UIScrollView

【发布时间】：2018-06-08 05:19:46

【问题描述】：

当我想在UIScrollView 中设置我的子视图的顶部锚点时，我必须给它们一个恒定的高度，否则 scrollView 不会滚动。但随着他们数量的增加，感觉就像一团糟。

例如，如果我将第二个子视图的 topAnchor 设置为第一个子视图的 bottomAnchor，它将不会滚动。我必须将它们设置为滚动视图的锚点。 有没有更好的方法来实现这一点，而无需给出常数并自己计算距离？

这是我的滚动视图：

    scrollView.translatesAutoresizingMaskIntoConstraints = false
    scrollView.contentSize = CGSize(width: UIScreen.main.bounds.width, height: 500)
    scrollView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
    scrollView.isScrollEnabled = true

    belowContainer.addSubview(scrollView)

    scrollView.topAnchor.constraint(equalTo: belowContainer.topAnchor, constant: 20).isActive = true
    scrollView.leadingAnchor.constraint(equalTo: belowContainer.leadingAnchor).isActive = true
    scrollView.trailingAnchor.constraint(equalTo: belowContainer.trailingAnchor).isActive = true
    scrollView.bottomAnchor.constraint(equalTo: belowContainer.bottomAnchor, constant: 0).isActive = true

我使用以下变量来获得正确的垂直间距，子视图之间

    var counter : CGFloat = 0; // height space counter between uiItems below!
    let multiplierHeight : CGFloat = 32 // we multiply our counter by this value to get the right spacing!

最后我让我的子视图锚定在这样的 for 循环中：

    for lbl in labelsArray 
        lbl.font = UIFont(name: fontName, size: 20)

        lbl.topAnchor.constraint(equalTo: scrollView.topAnchor, constant: counter * multiplierHeight).isActive = true          
        lbl.heightAnchor.constraint(equalToConstant: 25).isActive = true
        counter += 1
    

【参考方案1】：

这似乎不是解决您问题的正确方法。相反，您应该级联标签，以便一个标签的底部约束链接到下一个标签的顶部约束。这样，您就不必进行顶部约束常数乘法了。

但是，您可能想要考虑使用堆栈视图来实现您的目标。使用约束将堆栈视图固定到滚动视图的内容视图，然后使用 for 循环将标签添加到堆栈视图：

stackView.addArrangedSubview(lbl)

堆栈视图的优点是您不需要单个布局约束。相反，堆栈视图本身负责定位其子视图。

【讨论】：

我会尝试 stackView，但就像我说的，当我将其中一个子视图 topAnchor 设置为另一个子视图时，比如说，bottomAnchor，UIScrollView 将不允许我滚动，子视图的那种卡住不动，这就是问题

问题可能是你将scrollView的高度固定为固定的500 px，而不是让它根据内容增长。您可能宁愿保持contentSize 不变，将内容视图（即堆栈视图宽度）设置为视口的宽度并让自动布局确定高度。

非常感谢，我的错误是我没有使用UIStackView，而是使用了基本的 UIView 实例或滚动视图中没有容器。使用 StackView 就像一个魅力。但是我必须设置contentSize，否则它不会再次滚动。