ios - 使用 Navbar 和 Tab Bar 滚动以及具有动态高度的容器 View

Question

我正在尝试使用选项卡栏和导航栏在 IB 中布置我的详细信息屏幕。但是，模拟器运行时的显示存在三个问题:

1. 屏幕顶部有空隙，
2. 动态标签内容超出了底部的容器 View
3. 滚动条没有到达内容的底部。
   
   Screenshot of simulator displaying the issues described
   

我的问题是我应该如何设置约束才能解决上述问题？

我有很多限制，我不确定我哪里出错了，或者什么是展示我到目前为止所采取的步骤的最佳方式。但是here is a screenshot of my constraints以下是我到目前为止所采取的约束/步骤的总结:

1. 主视图只包含一个 subview : ScrollView 。 ScrollView 固定在主视图的顶部、前导和尾部，底部固定在底部布局指南中。顶部，

2. ScrollView 只有 1 个 subview (“内容 View ”)。内容 View 固定到顶部 + 64，前导、尾随、底部固定到 super View ，并且它与主视图具有相同的高度和宽度。

3. 内容 View 包含图像、食谱标题 subview 和阴影背景 subview 。 Shadow Background subview 包含另一个带有一些动态高度标签的 subview 。我有限制将这些容器的前导边和尾随边固定到 super View 。我有顶部、底部、前导、尾随约束将这些 subview 固定到父 View 和/或彼此，以便从上到下形成一条链。

4. 阴影背景 View 包含动态高度标签。除了没有底部约束的最后一个标签外，标签还具有顶部、前导、尾部和底部的引脚约束。

我没有任何更新布局的代码——目前所有内容都在 IB 中。

非常感谢任何帮助!

Answer 1

哈利路亚!在度过了令人沮丧的整整一周之后，我终于在 IB 中找到了用于布局 ScrollView + 导航栏 + 标签栏 + 动态标签高度的神奇公式。

我原来的问题是由以下错误引起的:

• Adjust Scroll View Insets 应该设置为 false
• 内容 View 顶部和底部固定不正确
• 在某些 subview 上缺少一些高度
• 最后一个 subview 没有正确固定在底部

也许并非所有这些步骤都是必需的，也许这不是最完美的解决方案，但这对我有用。 Here is a diagram of the solution for those that prefer pictures.

1. 主视图 -> 属性检查器 -> 取消选中 Adjust Scroll View Insets 复选框。
2. 添加 ScrollView 。这是主视图的唯一 subview 。将顶部、前导、尾随空间固定到主视图。将底部固定到底部布局指南。
3. 添加一个 subview (将其命名为“内容 View ”)。这是 ScrollView 的唯一子项。将顶部、前导、尾随空间固定到 ScrollView 。使用常量 -49 将底部固定到 ScrollView 以说明选项卡栏。同时将其高度和宽度设置为与主视图相等。
4. 向内容 View 添加一个 subview 。 Top 固定到 Superview，常量为 62 以说明 Nav Bar。前导和尾随被固定到 Superview。 View 还需要一个高度——给它一个固定值或一个最小值，如果它是动态内容(例如:高度 >- 20)。您可能还需要为高度限制赋予较低的优先级，例如 250。
5. 根据需要继续添加兄弟 subview 。将顶部固定到上一个同级 subview 。将 Leading 和 Trailing 固定到 Superview。最后一个兄弟 subview 应该固定到 super View 。每个 subview 都需要一个高度。从顶部 subview 到底部需要有一个连续的约束链(顶部和底部引脚、高度)，以避免“ ScrollView 具有不明确的可滚动内容高度”警告并使滚动正常工作。
6. 跳一支快乐的舞。

希望这对其他人有帮助。