陷入 iOS 自动布局泥潭

Posted 2023-02-27

【中文标题】陷入 iOS 自动布局泥潭

【英文标题】：Stuck in iOS AutoLayout Mire

【发布时间】：2014-04-21 01:30:52

【问题描述】：

我有一个 UIScrollView……在那个 UIScrollView 里面是一个 UIView（内容容器）……在那个内容容器里面是 3 个视图……

标签 另一个 UIView (A) 另一个 UIView (B)

所有三个都是以编程方式创建的

2 和 3 都是从单独的 ReST 调用中加载的...所以在加载视图时，它们都是 30pt 高的微调器。

在其中一个或两个调用返回后，我想正确调整它们的大小（顶部将获得一个 320x320 的图像），底部将获得一个表格（大小目前尚未确定）...

我正在尝试实现此间距容器顶部 - 20pt - 标签 - 20pt - 内容 A - 20pt - 内容 B - 容器底部

我在内部使用以下 -(void) updateViewConstraints

    [_containerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[label]-20-[content A]-20-[content B]"
                                                                       options:0
                                                                       metrics:nil
                                                                         views:viewsDictionary]];

这是获取 A 内容的调用返回后的样子：

我真的已经准备好刺伤我的眼睛了......我不知道为什么这会如此困难。内容 B 的框架如下所示：Other Frame: 0, 150, 320, 30, Bounds: 0, 0, 320, 30

我最终想要做的是创建一个 UIScrollView，它允许我滚动视图以查看将显示在底部的图像和表格......我有 UIScrollView 和容器视图（ _containerView = UIView) 作为 IB 中的 IBOutlets。

【问题讨论】：

自动布局和滚动视图太可怕了！我感觉到你的痛苦。您需要确保滚动视图中的所有项目都有大小，并以某种方式限制在滚动视图的所有边缘。或者，如果您不能给它们一个大小，请将它们限制在滚动视图超级视图上。例如在垂直滚动视图中，内部视图的左右边缘通常可以约束滚动视图超级视图。

视图 A 是否包含微调器，然后是图像视图，作为子视图？还是视图 A 是一个微调器，然后将其从视图层次结构中移除，然后将图像视图直接插入为滚动视图的子视图？

【参考方案1】：

你还没有提到你的表格视图的外观。如果表格视图只有一个部分，最简单的解决方案可能是给它三个部分。在第一部分放置一个单元格，包含标签。在第二部分放置一个单元格，包含“A”内容的微调器或图像视图。将“B”内容放在第三部分。

如果你不能这样做，这里有另一种方法。像这样设置视图层次结构的“静态”成员：

scrollView - UIScrollView
  scrollContentView - UIView
    label - UILabel
    aContainer - UIView
    bContainer - UIView

像这样设置垂直约束：

V:|-[scrollContentView]-|
V:|-[label]-[aContainer]-[bContainer]-|

插入 A 微调器作为 aContainer 的子视图，并像这样设置它的约束：

V:|[aSpinner]|

将 B 微调器作为 bContainer 的子视图插入，并以相同方式设置其约束：

V:|[bSpinner]|

当区域 A 的图像到达时，从其父视图中删除 aSpinner。这将消除aSpinner 和aContainer 之间的约束。将aImageView 添加为aContainer 的子视图并为其设置约束：

V:|[aImageView]|

当区域 B 的表数据到达时，从其父视图中删除 bSpinner。将bTableView 添加为bContainer 的子视图并为其设置约束：

V:|[bTableView]|

您需要弄清楚表格视图的高度，并为其设置约束。您可能会发现 this answer 很有用。

【参考方案2】：

AutoLayout 据称是一个很好的布局引擎。但是我从来没有在现实世界中看到过这种情况，对我来说这只是一个令人头疼的问题。

我建议禁用 AutoLayout（您可以在 xib 文件的文档检查器中执行此操作）并使用旧的/经过验证的 springs 和 struts 系统。当您需要对 springs/struts 过于复杂的布局时，请在视图控制器中编写一些自定义代码来处理它。