自动布局的基本理解

Posted 2023-03-15

【中文标题】自动布局的基本理解

【英文标题】：Basic Understanding of Autolayout

【发布时间】：2015-03-26 00:06:31

【问题描述】：

我已经观看了 2012/13/14 和 CS193P 的所有相关 Autolayout WWDC 视频，以及来自其他一些可信来源的教程。使用这些知识和一些尝试和错误，我已经能够使用 Autolayout 创建一些相当复杂的屏幕，但有时我遇到了一个绊脚石，这表明我对 Autolayout 的理解并不完整。所以我重新创建了一个我能想到的最简单的场景来展示一个非常有用的问题：

在这种情况下，我们有两种观点：

左视图固定在屏幕的顶部、底部和左侧 右视图固定在屏幕的顶部、底部和右侧 两个视图之间存在水平间距约束

垂直定位由顶部和底部约束确定，没有错误，但视图都报告“缺少约束”，因为它们“需要约束：X 位置或宽度”。

我认为左视图的 X 位置是通过固定到左侧来确定的，并且它的宽度会根据需要增加/缩小，以便在其自身和固定到右侧的视图之间仍有空间对。

我可以看到 Autolayout 知道 哪些 视图会增长以满足另一个视图是一个问题 - 但我认为通过给一个视图更高的视图来解决这个问题水平抗压优先（或水平拥抱）。更耐压缩或具有更高拥抱值的视图将保持其在 Canvas 中的宽度，而另一个视图将更改其宽度以满足约束。更改这些优先级值不会影响缺少的约束错误。

从屏幕截图中可以看出，在左侧的“错位视图”部分中，有一个视图的预期宽度是其画布值的两倍以上，还有一个视图的预期宽度为 0。这与我们需要对宽度进行约束的错误相匹配，但为什么呢？

我相信理解为什么会这样有助于理解更复杂的自动布局关系。提前致谢！

【问题讨论】：

抗压性和拥抱优先级适用于由视图内容确定的视图尺寸。由于您的视图是空的，因此 Autolayout 没有任何“线索”来指导视图的大小。尝试在您的两个视图中添加一些标签并对其大小设置一些约束，并且应该解决缺少的约束

这里是帮助你理解自动布局的帖子slicode.com/…

【参考方案1】：

Content Hugging 和 Compression Resistance 优先级仅应用于视图的固有内容大小。您的视图没有任何内在的内容大小，因此它们不相关。 （Paulw11 的评论是不正确的，即如果视图具有具有固有内容大小的子视图，则这些优先级将生效。那些 子视图 将具有有意义的内容拥抱和抗压缩优先级，但包含视图不会。 )

如果您添加具有内在内容大小的子视图并添加约束以有效地将这些子视图的大小与包含视图的大小相关联，那就足够了。

否则，您需要为一个或两个视图提供明确的宽度约束。如果您愿意，这些约束可以具有非必需的优先级，如果您同时提供两者，它们的优先级可以（应该）不同，以便一个优先级在另一个之前被打破。你甚至可以在不同的优先级应用多个宽度约束来实现不同的布局。 （作为一个简单的示例，您可以创建要求视图宽度大于或等于一定数量的约束。这样，如果需要，具有相对低优先级首选宽度的视图仍会缩小以适应其他视图的更高-优先首选宽度，但仅限于此。）

【讨论】：

感谢您的回答和解释。当然，视图是空的这一事实阻止了它们具有内在大小，并且很好地澄清了拥抱和阻力仅与内在大小有关。

【参考方案2】：

所有其他约束都设置得很好。一个失踪。 在这两个视图之间设置等宽。如果您没有看到您想要的布局，请调整这两个之间的水平间距，红色视图相对于超级视图的前导空间和蓝色的尾随空间相对于 superview 的视图。

【讨论】：

“设置相等宽度”确实适用于这样的空视图。谢谢！