iOS 在启用“自动布局”的情况下滚动内容

示例

该项目是一个完整的示例，完全在Interface Builder中完成。您应该可以在10分钟或更短的时间内完成它。然后，您可以将学习到的概念应用于自己的项目。

在这里，我仅使用UIViews，但它们可以表示您喜欢的任何视图（即按钮，标签等）。我还选择了水平滚动，因为此格式的故事板截图更加紧凑。但是，垂直滚动的原理相同。

关键概念

• 本UIScrollView应该只使用一个子视图。这是一个“ UIView”，用作内容视图，可容纳您希望滚动的所有内容。

• 使内容视图和滚动视图的父级具有相等的高度以进行水平滚动。（垂直滚动的宽度相等）

• 确保所有可滚动内容的宽度均已设置并且固定在所有侧面。

开始一个新项目

它可以只是一个单视图应用程序。

故事板

在此示例中，我们将进行水平滚动视图。选择View Controller，然后在Size Inspector中选择Freeform。确定宽度1,000和高度300。这只是给我们在情节提要板上腾出空间来添加将滚动的内容。

添加滚动视图

添加aUIScrollView并将所有四个边固定到视图控制器的根视图。

添加内容视图

将一个UIView子视图添加到滚动视图。这是关键。不要尝试向滚动视图添加很多子视图。只需添加一个即可UIView。这将是您要滚动的其他视图的内容视图。将内容视图固定到所有四个侧面的滚动视图。

等高

现在，在“文档大纲”中，Command单击内容视图和滚动视图的父视图，以同时选择它们。然后将高度设置为相等（将Control </ kbd从“内容视图”拖动到“滚动视图”>）。这也是关键。因为我们正在水平滚动，所以滚动视图的内容视图将不知道它应该有多高，除非我们以这种方式设置它。

注意：

• 如果要使内容垂直滚动，则将内容视图的宽度设置为等于滚动视图的父视图的宽度。

添加内容

加三个UIViews并赋予它们所有约束。我为所有内容使用了8点利润。

限制条件：

• 绿色视图：钉住顶部，左侧和底部边缘。使宽度为400。

• 红色视图：固定顶部，左侧和底部边缘。使宽度为300。

• 紫色视图：固定所有四个边缘。使宽度等于剩余空间（在这种情况下为268）。

设置宽度约束也是关键，以便滚动视图知道其内容视图的宽度。

已完成

就这样。您现在可以运行您的项目。它的行为应类似于此答案顶部的滚动图像。

进一步研究

• iOS：如何使自动布局在ScrollView上工作

• 如何在Interface Builder中使用自动布局配置UIScrollView

• YouTube视频教程：UIScrollView-如何在屏幕上保持视图