如何动态调整滚动视图高度

Question

我在使用自动布局约束时遇到了 UIScrollView 的问题。我有以下视图层次结构

-view
  -scrollView
    -view A
    -view B

在View中，A或View B里面的内容根据收到的响应而增加。所以请帮我如何根据内容设置滚动视图高度。

Answer 1

如果您使用自动布局，则需要设置约束：

- viewA.top = scrollView.top
- viewA.height = 100 (or make the view autosizing the same way as scrollview)
- viewB.top = viewA.bottom
- viewB.height = 100 (or make the view autosizing the same way as scrollview)
- viewB.bottom = scrollView.bottom

这将允许您使滚动视图适应内容大小。 现在您需要在父视图上为滚动视图设置约束。

- scrollView.top = view.top + 100 (just an example)

对你来说最重要的是在滚动视图中的所有子视图之间有约束，加上第一个需要对滚动视图的顶部有顶部约束，最后一个必须连接到滚动视图的底部。

该规则适用于您想要“自动调整”高度的所有视图 - 例如自动调整UITableViewCells

Answer 2

在 IB 中使用 scrollView 必须为 ViewA 和 ViewB 的高度设置约束。如果不设置scrollView不能设置他的高度。

您必须将滚动视图边距的约束设置为超级视图。

Answer 3

来自 Apple 开发人员关于 Auto Layout Guide 的部分名称“Working with Scroll Views”为您的问题提供了明确的解决方案

对于大多数常见的布局任务，如果您使用 包含滚动视图内容的虚拟视图或布局组。 在 Interface Builder 中工作时，显示了一般方法 下面：

1. 将滚动视图添加到场景中。
2. 绘制约束来定义 像往常一样滚动视图的大小和位置。
3. 为滚动添加视图 看法。将视图的 Xcode 特定标签设置为 Content View。
4. 将内容视图的顶部、底部、前导和后沿固定到滚动条 视图的对应边。内容视图现在定义了滚动 视图的内容区域。
5. （可选）要禁用水平滚动，请将内容视图的宽度设置为等于滚动视图的宽度。内容视图现在水平填充滚动视图。
6. （可选）要禁用垂直滚动，请将内容视图的高度设置为等于滚动视图的高度。内容视图现在水平填充滚动视图。
7. 在内容视图中布置滚动视图的内容。使用约束在内容视图中正常定位内容。

通过代码进行自动布局的另一件重要的事情是 通过此代码禁用从自动调整大小掩码到约束的转换：

scrollView.translatesAutoresizingMaskIntoConstraints = false;
viewA.translatesAutoresizingMaskIntoConstraints = false;
viewB.translatesAutoresizingMaskIntoConstraints = false;

所以你的视图层次结构是：

-view
  -scrollView
    -scrollContentView
      -view A
      -view B

scrollView 的约束类似于普通视图，例如，您希望 scrollView 占据其父视图中的所有空间。

[scrollView.leadingAnchor constraintEqualToAnchor:view.leadingAnchor];
[scrollView.trailingAnchor constraintEqualToAnchor:view.trailingAnchor];
[scrollView.topAnchor constraintEqualToAnchor:view.topAnchor];
[scrollView.bottomAnchor constraintEqualToAnchor:view.bottomAnchor];

和scrollContentView类似

[scrollContentView.leadingAnchor constraintEqualToAnchor: scrollView.leadingAnchor];
[scrollContentView.trailingAnchor constraintEqualToAnchor: scrollView.trailingAnchor];
[scrollContentView.topAnchor constraintEqualToAnchor: scrollView.topAnchor];
[scrollContentView.bottomAnchor constraintEqualToAnchor: scrollView.bottomAnchor];

最后是viewA和viewB的约束，将viewA的底部引脚设置为viewB的顶部

[viewA.leadingAnchor constraintEqualToAnchor: scrollContentView.leadingAnchor];
[viewA.trailingAnchor constraintEqualToAnchor: scrollContentView.trailingAnchor];
[viewA.topAnchor constraintEqualToAnchor: scrollContentView.topAnchor];
[viewA.bottomAnchor constraintEqualToAnchor: viewB.topAnchor];

[viewB.leadingAnchor constraintEqualToAnchor: scrollContentView.leadingAnchor];
[viewB.trailingAnchor constraintEqualToAnchor: scrollContentView.trailingAnchor];
[viewB.topAnchor constraintEqualToAnchor: viewA.bottomAnchor];
[viewB.bottomAnchor constraintEqualToAnchor: scrollContentView.topAnchor];