如何添加前导填充以添加到 UIStackView 内的视图

Question

这是我的设置：我有一个

UIScrollView

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

UIStackView

：

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

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

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

Answer 1

当

isLayoutMarginsRelativeArrangement

属性为 true 时，堆栈视图将相对于其布局边距来布局其排列视图。

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

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

UIStackView

Answer 2

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

（例如，如果我在图像堆栈视图上添加前导/尾随约束，这也会向集合视图添加前导，但不添加尾随；并且肯定会发生冲突）。

要为 stackview 内的所有视图设置布局边距，请选择：

Stack View > Size Inspector > Layout Margins > Fixed

注意：

"Fixed"

选项以前称为

"Explicit"

，如屏幕截图所示。

然后添加填充：

Answer 3

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

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

提示，您完全可以使用 Interface Builder 来完成此操作。换句话说，不需要为其编写代码。

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

将 stackview 对齐方式设置为“居中”。之后，您可以为每个子视图指定不同的前导和尾随。

Answer 6

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

作为奖励，您还可以将堆栈视图的对齐方式设置为“居中”，然后您可以使用前导和/或尾随约束为每个项目在两侧提供自己的填充。

Answer 7

迅捷3： 您只需设置偏移量：

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

确保此约束在您之后设置

parentView.addArrangdSubView(firstView)

Answer 8

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

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

Answer 9

这个问题已经有很好的答案了， 不过，有一个建议是，使用

spacing

属性来设置视图之间的间距。对于第一个和最后一个视图，可以有两个选项，要么按照 @tolpp 建议设置插图，要么添加附加到父级（stackview）的约束，并使用常量添加填充。

Answer 10

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

Answer 11

xib / Storyboard 技巧是在 uistackview 的开头和结尾添加 uiview，并在其上添加宽度约束。说清楚以确保它不会出现。

Answer 12

最新答案：

您现在可以轻松地将所需的任何填充添加到堆栈视图中。

isLayoutMarginsRelativeArrangement = true
directionalLayoutMargins = NSDirectionalEdgeInsets(
           top: 8, leading: 8, bottom: 8, trailing: 8)

在堆栈视图中，我添加了一些视图...[我想在第 N 个特定视图上添加填充]

您只需将第 N 个视图放入 hori 堆栈视图中即可。

然后像平常一样设置填充，

directionalLayoutMargins

。

几乎总是当你有一个垂直堆栈视图时，每个“行”本身就是一个堆栈视图。 （这样你就可以操纵它的对齐、填充等）

Answer 13

看来解决办法很简单。而不是：

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

我刚刚写道：

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