如何使用自动布局使超级视图适合最大的内在大小子视图

Posted 2023-02-23

【中文标题】如何使用自动布局使超级视图适合最大的内在大小子视图

【英文标题】：How to have superview fit to largest intrinsic size subview with autolayout

【发布时间】：2017-02-08 16:47:04

【问题描述】：

我有一列具有内在尺寸（图像、标签等）的多个动态子视图。如何让超级视图适合自动布局中的子视图。

如果子视图不是动态的，我只会将最大子视图的前沿/后沿约束到超级视图。像这样

我认为我可以与前沿对齐，然后将尾部约束设置为 >= 8，逻辑是“如果子视图太窄，后沿可以大于 8，但如果子视图宽扩展超级视图，因此至少有 8 个后沿。”但是IB不喜欢这样

注意事项：

无法使用堆栈视图 子视图具有动态宽度。因此，在示例中，任何行都可能是最宽的。

【参考方案1】：

按照以下步骤，

向主视图添加一个视图（比如视图 A）。 将所有三个标签（例如标签 1、标签 2、标签 3）作为子视图添加到视图 A。 将视图 A 固定到其所有四个侧面的超级视图。将顶部、底部、左侧和右侧的约束更改为大于等于 (>=)10，其中根据需要设置优先级（因为如果内容扩展，可以避免视图 A 超出屏幕）。 给标签1添加约束，即固定到视图A的顶部，左右两边，常量等于0。标签1底部固定到标签2顶部等于10，其中约束优先级根据需要设置. 也按照相同的步骤标记 2。 对标签 3 执行相同的步骤。即，将其固定到标签 2 的底部和视图 A 的右侧、左侧。将其固定到视图 A 的底部，其中底部约束应等于 0，优先级设置为低。

您可以根据自己的要求更改约束值。它会起作用的。 您可以将任何标签可以收缩的压缩阻力优先级更改为低。

更新：对于下面提到的 git 链接

为 ViewA 添加以下约束，

ViewA 中心 X 和 Y 到 SuperView 中心 X 和 Y (=0 @1000) ViewA 前导和 SuperView 前导 (>=10 @1000) ViewA 尾随和 SupreView 尾随 (>=10 @1000) ViewA 顶部和 SuperView 顶部 (>=10 @1000) ViewA 底部和底部尾随 (>=10 @1000) Image1 to superview Leading,top (=0 @1000) Image1 到超级视图尾随 (>=0 @1000) Image1 到 Image2 底部 (=10 @1000) Image2 到 superview 前导 (=0 @1000) Image2 到超级视图尾随 (>=0 @1000) Image2 到 Image3 底部 (=10 @1000) Image3 到 superview 前导 (=0 @1000) Image3 到超级视图尾随 (>=0 @1000) Image3 到 superView 底部 (=0 @999)

然后选择 ViewA 并设置更新帧，仍然会出现红色标记，表示缺少约束。您仍然可以按照 xcode 的建议添加缺少的约束，但将其设置为 在构建时删除。更新框架并运行。希望它能按照您的要求工作。

【讨论】：

从 label1/2/3 到 viewA 的约束优先级是多少？您说 label3 到 viewA 的底部约束是 low 优先级，但是 label1 顶部、前导、尾随到 viewA 呢？ label2 引导到 viewA 的尾部，label3 引导到 viewA 的尾部。另外为什么从 label3 到 viewA 的底部约束设置为低？我玩了一些东西，如果我把内容拥抱放得很高，这有点工作，但 IB 一直抱怨限制。我把我所做的事情放在这里github.com/iwllyu/TestAutoLayout。那是针对 xcode 7.3 的

标签 3 底部和视图底部垂直间距约束设置为零且优先级较低。其余所有约束都是必需的。希望我很清楚。

我试过了，xcode 抱怨约束

我已经检查了你的代码。视图控制器场景笔尖约束与我上面提到的不同。我从来没有提到我可以看到标签容器的宽度限制。在下一个场景中，容器中有图像。请添加图像以查看图像并检查。它需要大小。由于没有图像，它无法决定其内在大小。

您可以使用 >= 作为所有图像的尾随约束，否则图像可能会拉伸。

【参考方案2】：

好的，这就是我的工作方式。不确定这是否是最好的方法。

将所有尾随约束设置为>= 在超级视图上设置宽度 为超级视图宽度约束创建一个出口 在您的 ViewController 中，覆盖 viewDidLayoutSubviews()
计算所有子视图的最大宽度 将边距添加到该宽度 将超级视图宽度常量设置为计算的最大值