如何添加前导填充以在 UIStackView 中添加视图

Question

这是我的设置：我有一个 UIScrollView，前导、顶部、试验边缘设置为 0。在其中我添加了一个 UIStackView 并具有以下约束：

stackView.centerYAnchor.constraintEqualToAnchor(selectedContactsScrollView.centerYAnchor).active = true  
stackView.leadingAnchor.constraintEqualToAnchor(selectedContactsScrollView.leadingAnchor).active = true

在堆栈视图中我添加了一些视图。
我的问题是，由于限制，添加到堆栈视图的第一个视图也将具有前沿 = 0。

我可以通过哪些方式向第一个视图添加一些填充？不调整滚动视图约束。

Answer 1

看起来解决方案很简单。而不是：

stackView.leadingAnchor.constraintEqualToAnchor(selectedContactsScrollView.leadingAnchor).active = true

我刚刚写了：

stackView.leadingAnchor.constraintEqualToAnchor(selectedContactsScrollView.leadingAnchor, constant: 15).active = true

Answer 2

您提供的解决方案不会在您的 UIStackView 中为您的视图添加填充（如您在问题中所希望的那样），但它会为 UIStackView 添加前导。

一个解决方案可能是在您的原始 UIStackView 中添加另一个 UIStackView 并为这个新的 UIStackVIew 提供引导。然后，将您的视图添加到这个新的 UIStackView。

提示，您完全可以使用 Interface Builder 来做到这一点。换句话说，不需要为它编写代码。

Answer 3

当 isLayoutMarginsRelativeArrangement 属性为真时，堆栈视图将根据其布局边距对其排列的视图进行布局。

stackView.layoutMargins = UIEdgeInsets(top: 0, left: 20, bottom: 0, right: 20)
stackView.isLayoutMarginsRelativeArrangement = true

但它会影响堆栈视图中的所有排列视图。如果您只想为一个排列的视图使用此填充，则需要使用嵌套 UIStackView

Answer 4

对我有用的是向堆栈视图添加另一个 UIView，它只是一个间隔符（至少适用于 stackView.distribution = .Fill）：

let spacerView = UIView(frame: CGRect(x: 0, y: 0, width: 10, height: 10))
stackView.addArrangedSubview(spacerView)
stackView.addArrangedSubview(viewThatNeedsSpaceBeforeIt)
stackView.addArrangedSubview(NextView)...

Answer 5

我发现约束在堆栈视图中不起作用，或者它们看起来有些奇怪。

（例如，如果我将 leading/trailing 约束添加到图像堆栈视图上的 selected，这也会将前导添加到 collectionview，但不会添加尾随；这肯定是冲突的）。

要为堆栈视图内的所有视图设置布局边距，select:

Stack View > Size Inspector > Layout Margins > Fixed

注意："Fixed" 选项以前称为 "Explicit"，如屏幕截图所示。

然后添加填充：

Answer 6

如果您只需要前导填充，那么您可以将堆栈视图的对齐方式设置为 "Trailing"，然后您就可以自由地为其包含的每个子视图指定唯一的前导约束。

作为奖励，您还可以将堆栈视图的对齐方式设置为 "Center"，然后您可以使用 Leading and/or Trailing constraints 为每个项目在两侧提供自己的填充。

Answer 7

swift 3: 您只需要将偏移量设置为：

firstView.leadingAnchor.constraint(equalTo: parentView.leadingAnchor, constant: 200).isActive = true

确保在您 parentView.addArrangdSubView(firstView)

之后设置此约束

Answer 8

我们所做的是添加透明组件（例如，UIButton/UIView）作为 UIStackView 的第一个和最后一个子组件。然后设置约束这些不可见子项的宽度来调整padding。

Answer 9

这个问题已经有了很好的答案，不过，有一个建议是使用 spacing 属性来设置视图之间的间距。对于第一个和最后一个视图，可以有两个选项，要么按照@tolpp 的建议设置插图，要么添加附加到父级（stackview）的约束，并使用常量添加填充。

Answer 10

解决方案是在堆栈视图中有一个常规视图来保存您想要添加约束的任何视图，然后您可以为与堆栈视图中的视图相关的项目添加约束。这样，您的原始视图可以在堆栈视图中具有前导和尾随约束。

这可以在界面生成器中以编程方式完成。

Answer 11

只需在堆栈视图的开头添加一个空视图（同时限制其宽度and/or高度）：

stackView.insertArrangedSubview(UIView().constrain(width: 0, height: 0), at: 0)

and/or结尾：

stackView.addArrangedSubview(UIView().constrain(width: 0, height: 0))

我创建了这个简单的 UIView 扩展来添加约束：

extension UIView {
    func constrain(width: CGFloat, height: CGFloat) -> Self {
        NSLayoutConstraint.activate([
            widthAnchor.constraint(equalToConstant: width),
            heightAnchor.constraint(equalToConstant: height)
        ])

        return self
    }
}

Answer 12

将堆栈视图对齐设置为“居中”。之后你可以给每个子视图不同的前导和尾随。

如何添加前导填充以在 UIStackView 中添加视图

How to add leading padding to view added inside an UIStackView

uiscrollview

ios

swift

uistackview