让 ScrollView 与自动布局和故事板一起工作

Getting ScrollView to Work with Autolayout and Storyboard

我正在尝试为我想要构建的应用程序制作一个非常简单的布局 - 但我似乎正在努力使用 ScrollView 并通过 Storyboard 让它工作。基本上我正在尝试在下面构建:

我已经使用几个教程完成了约束 - 但它要么不滚动,要么看起来不对。有什么建议吗?

我收到以下警告:

设置滚动视图内View的宽高约束。

如果宽度固定,则添加约束使 View 宽度等于 Scrollview。

如果高度可变,则设置当前高度并将其优先级更改为 750。

例如,在下图中,我设置了视图的宽度和高度。

请注意,如果高度可变,则 View 必须知道它的高度,基于视图内容高度

请记住,ScrollView 中的 View 必须具有明确的大小(使用 scrollview 布局时不要使其大小明确)。通常情况下,你可以用根View或者固定值来布局View的宽度。 View's Height 你也固定值或布局里面的视图(里面的视图必须有明确的高度→ View's height can caculated)。这是我的经验,希望对你有帮助:))

在使用约束进行布局时,您必须为 UIScrollView 提供 contentSize。

例如:

您可以将 View 的宽度设置为等于 scrollView,因为这将提供 scrollview 内容的宽度。然后,为了提供内容高度,垂直布局红色和黄色视图,并使用它们提供视图的高度。这意味着您必须为黄色视图提供初始高度,或者您可以使用提供 intrinsicContentSize 的视图来确定黄色视图高度,这样您就不必手动更改它。

另外我认为你必须删除 redview top == layout guide top,并添加 redview top == View top 和 yellowview bottom == View bottom

设置scrollView内view的高度和宽度。如果视图高度是固定的,则设置约束,对于可变高度的视图,设置该视图的高度并将其与 viewController 作为 NSLayoutConstrains 连接并以编程方式更改,并使用

更新 scrollView 的高度

scrollView.contenSize.height = 固定视图高度 + 可变视图高度

也可以更改滚动视图的高度。

为了 UIScrollView 完美运行,您需要做的是确保 UIScrollView 中的 content view 可以推断其高度 总是。我将 UIScrollView 的子视图称为 内容视图 。也就是说,您需要做的是:

  • 为您的 UIScrollView 添加前导、尾随、顶部和底部。并向您的 内容视图 添加前导、顶部、尾随和底部到 UIScrollView。现在 Xcode 应该抱怨缺少约束。您现在需要做的是向 UIViewController 的主视图添加一个等高和等宽约束,并为等高约束提供一个优先级,假设为 250。
  • 现在向您的红色视图
  • 添加前导、顶部和尾随以及固定高度约束
  • 现在向黄色视图 添加前导、尾随、顶部和底部。现在您可以以编程方式设置 yellow view 的高度或向其中添加内容,从而允许 yellow view 推断其高度,这反过来又会让内容视图知道它的高度。

低优先级等高约束的作用是为 内容视图 提供足够的约束,这样 Xcode 就不会抱怨,并且由于优先级较低,它如果里面的内容太大无法完全显示在屏幕上,就会崩溃。

注意:保持您的视图层次结构与实际相同。

使 ScrollView 工作的键

  • UIScrollView 应该只使用一个子视图。这是一个 UIView 用作内容视图以容纳您希望滚动的所有内容。
  • 使内容视图和滚动视图的 父视图 具有相等的垂直滚动宽度(或相等的水平滚动高度)。如果 ScrollView 在一个复杂的布局中,有时将 ScrollView 放在它自己的父内容视图中会更容易。这样可以更轻松地将子项宽度(或高度)与父项匹配。
  • 确保所有可滚动内容都具有设置的宽度并且固定在所有边上。

我的完整答案是 here