Advanced Auto Layout:Working with Scroll Views

Working with Scroll Views使用滚动视图工作

When working with scroll views, you need to define both the size and position of the scroll view’s frame within its superview, and the size of the scroll view’s content area. All of these features can be set using Auto Layout.

使用滚动视图时，你需要在它的父视图定义的大小和滚动视图的框架位置和滚动视图的内容区域的大小。所有这些功能可以设置使用自动布局。

To support scroll views, the system interprets constraints differently, depending on where the constraints are located.为了支持滚动视图，系统会根据约束所在的不同来解释约束。

• Any constraints between the scroll view and objects outside the scroll view attach to the scroll view’s frame, just as with any other view.在滚动视图之外的滚动视图和对象之间的任何约束都附加到滚动视图的框架上，就像其他视图一样。

• For constraints between the scroll view and its content, the behavior varies depending on the attributes being constrained:对于滚动视图和它的内容之间的约束，行为取决于被约束的属性：

  • Constraints between the edges or margins of the scroll view and its content attach to the scroll view’s content area.滚动视图的边或边之间的约束及其内容附加到滚动视图的内容区域。

  • Constraints between the height, width, or centers attach to the scroll view’s frame.高度、宽度或中心之间的约束连接到滚动视图的框架上.

• You can also use constraints between the scroll view’s content and objects outside the scroll view to provide a fixed position for the scroll view’s content, making that content appear to float over the scroll view.还可以使用滚动视图的内容和滚动视图之外的对象之间的约束，为滚动视图的内容提供一个固定的位置，使该内容在滚动视图上浮动。

For most common layout tasks, the logic becomes far easier if you use a dummy view or layout group to contain the scroll view’s content. When working in Interface Builder, the general approach is shown below:

对于大多数常见的布局任务，如果使用虚视图或布局组来包含滚动视图的内容，逻辑会变得更容易。在接口生成器中工作时，一般方法如下：

1. Add the scroll view to the scene.将滚动视图添加到场景中。

2. Draw constraints to define the scroll view’s size and position, as normal.
   绘制约束以定义滚动视图的大小和位置，为正常。

3. Add a view to the scroll view. Set the view’s Xcode specific label to Content View.
   向滚动视图添加视图。设置视图的Xcode具体标签内容观。

4. Pin the content view’s top, bottom, leading, and trailing edges to the scroll view’s corresponding edges. The content view now defines the scroll view’s content area.将内容视图的顶部、底部、引导和尾随边缘固定到滚动视图的相应边缘。内容视图现在定义了滚动视图的内容区域。

   REMEMBER记得

   The content view does not have a fixed size at this point. It can stretch and grow to fit any views and controls you place inside it.内容视图在这一点上没有固定大小。它可以拉伸和增长，以适应任何意见和控制你在里面。

5. (Optional) To disable horizontal scrolling, set the content view’s width equal to the scroll view’s width. The content view now fills the scroll view horizontally.（可选）禁用水平滚动，设置内容视图的宽度等于滚动视图的宽度。内容视图现在水平地填充滚动视图。

6. (Optional) To disable vertical scrolling, set the content view’s height equal to the scroll view’s height. The content view now fills the scroll view horizontally.（可选）禁用垂直滚动，设置内容视图的高度等于滚动视图的高度。内容视图现在水平地填充滚动视图。

7. Lay out the scroll view’s content inside the content view. Use constraints to position the content inside the content view as normal.在内容视图中设置滚动视图的内容。使用约束将内容视图中的内容定位为正常。

   IMPORTANT重要

   Your layout must fully define the size of the content view (except where defined in steps 5 and 6). To set the height based on the intrinsic size of your content, you must have an unbroken chain of constraints and views stretching from the content view’s top edge to its bottom edge. Similarly, to set the width, you must have an unbroken chain of constraints and views from the content view’s leading edge to its trailing edge.

   您的布局必须完全定义内容视图的大小（除了定义在步骤5和步骤6）。要根据内容的内在大小来设置高度，必须有一个完整的约束链和视图，从内容视图的顶部边缘延伸到它的底部边缘。同样，要设置宽度，必须有一个完整的约束链和视图，从内容视图的前缘到它的后缘。

   If your content does not have an intrinsic content size, you must add the appropriate size constraints, either to the content view or to the content.

   如果内容没有内在内容大小，则必须向内容视图或内容添加适当的大小限制。

   When the content view is taller than the scroll view, the scroll view enables vertical scrolling. When the content view is wider than the scroll view, the scroll view enables horizontal scrolling. Otherwise, scrolling is disabled by default.

   当内容视图高于滚动视图时，滚动视图可以垂直滚动。当内容视图比滚动视图更宽时，滚动视图启用水平滚动。否则，默认情况下禁用滚动。