UIStackView 和 Auto Layout Anchor 的区别

Posted 2023-03-10

技术标签:

【中文标题】UIStackView 和 Auto Layout Anchor 的区别【英文标题】：Difference between UIStackView and Auto Layout Anchor 【发布时间】：2020-07-09 14:09:08 【问题描述】：

我刚刚学习了UIStackView，并试图掌握自己将自动布局单独应用于每个 UI 元素与使用堆栈视图之间的区别。

假设您有 5 个UILabels，并且您希望将它们平均间隔开。我可以使用自动布局锚之类的东西：

var previous: UILabel?

for label in [label1, label2, label3, label4, label5] 
    label.heightAnchor.constraint(equalToConstant: 88).isActive = true
    
    if let previous = previous 
        label.topAnchor.constraint(equalTo: previous.bottomAnchor, constant: 10).isActive = true
     else 
        label.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor, constant: 0).isActive = true
    
    
    previous = label

或视觉格式语言：

let viewsDictionary = ["label1": label1, "label2": label2, "label3": label3, "label4": label4, "label5": label5]
view.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|[label1(labelHeight@999)]-[label2(label1)]-[label3(label1)]-[label4(label1)]-[label5(label1)]-(>=10)-|", options:[], metrics: metrics, views: viewsDictionary))

或使用堆栈视图并将分布设置设置为沿主轴的equalSpacing。

这些是粗略的示例，但我是否正确理解您几乎可以使用自动布局锚或使用视觉格式语言完成堆栈视图所做的所有事情，但堆栈视图使其更容易？

或者使用自动布局锚或视觉格式语言无法实现的堆栈视图是否有独特的好处？

【问题讨论】：

【参考方案1】：

视觉格式语言有很多的限制。我的印象（可能是错误的）是 Apple 甚至不再开发它 - 它只是为了向后兼容。

对于您的简单布局示例，您是对的。您可以对循环执行与堆栈视图相同的操作。

但是...假设您希望这 5 个标签在屏幕上垂直居中？还是在另一个视图中？如果它们在堆栈视图中，您只需限制堆栈视图的位置。

或者，假设您想在运行时添加更多标签（或其他视图），或者在label2 和label3 之间插入label-2A？使用循环约束，您会遇到问题。使用堆栈视图，stack.insertArrangedSubview(label2A, at: 2)（索引从零开始），您就完成了。

堆栈视图还具有许多其他排列功能，可以让设计复杂的 UI 变得非常简单。

搜索 UIStackView 以获取一些示例 - 或者甚至只是浏览此处标记为 uistackview 的一些帖子...我想您很快就会看到优势。

【讨论】：