iOS 带有自动布局的ScrollView

示例

使用scrollview和自动布局的简单步骤。

  • 使用单视图应用程序创建一个新项目

  • 选择默认的viewcontroller,然后从属性检查器将其屏幕大小更改为iPhone-4inch。

  • 如下所示向您的视图控制器视图添加滚动视图,并将背景色设置为蓝色

在此处输入图片说明

  • 对其添加约束,如下图所示

在此处输入图片说明

这将是什么,只需将scrollview的每个边缘粘贴到viewcontroller的视图上

方案1:

现在说我们的内容很大,我们希望它既可以水平滚动又可以垂直滚动。

为了这,

  • 将UIView添加到frame(0,0,700,700)的滚动视图中。让其赋予橙色背景色以进行不同的标识。

在此处输入图片说明

接下来是重要部分,我们需要它水平和垂直滚动。

  • 选择橙色视图并添加以下约束

    在此处输入图片说明

让我解释一下我们在上述步骤中所做的事情。

  • 我们将高度和宽度固定为700。

  • 我们将尾随空间设置为scrollview = 0,这告诉scrollview内容是水平可滚动的。

  • 我们将底部空间设置为scrollview = 0,这告诉scrollview内容是垂直可滚动的。

现在运行项目并检查。

方案2:让我们考虑一个方案,在该方案中,我们知道内容宽度将与滚动宽度相同,但是高度大于scrollview。

请按照以下步骤垂直滚动内容。

  • 在上述情况下,删除宽度约束。

  • 更改橙色视图的宽度以匹配滚动视图的宽度。

  • 按住Ctrl键从橙色视图拖动到滚动视图,并添加等宽约束。

在此处输入图片说明

  • 并做了!!!只需运行并检查它是否垂直滚动

方案3:

现在我们只想水平滚动而不是垂直滚动。

请按照以下步骤水平滚动内容。

  • 撤消所有更改以实现如下约束(即恢复实现垂直和水平滚动的原始约束

在此处输入图片说明

  • 检查橙色视图的框架,该框架应为(0,0,700,700)

  • 删除橙色视图的高度限制。

  • 更改橙色视图的高度以匹配滚动视图的高度。

  • 按住Ctrl键从橙色视图拖动到滚动视图,并添加相等的高度约束。

在此处输入图片说明

  • 并做了!!!只需运行并检查它是否垂直滚动