title: How Does Scrollview Work With Autolayout, and Why Does Setting the Bottom Vertical Space Constraint Make it Work?
body: <p>I'm trying to understand how UIScrollView works in an auto layout environment. So far I've tried reading the Apple documentation, Stack Overflow research, Google research, and studying Matt Neuberg's working example.</p>
  
  <p>The Apple 6.1 documentation says:</p>
  
  <blockquote>
    <p>The central notion of a UIScrollView object (or, simply, a scroll
    view) is that it is a view whose origin is adjustable over the content
    view. It clips the content to its frame, which generally (but not
    necessarily) coincides with that of the application’s main window. A
    scroll view tracks the movements of fingers and adjusts the origin
    accordingly. The view that is showing its content “through” the scroll
    view draws that portion of itself based on the new origin, which is
    pinned to an offset in the content view. The scroll view itself does
    no drawing except for displaying vertical and horizontal scroll
    indicators. The scroll view must know the size of the content view so
    it knows when to stop scrolling; by default, it “bounces” back when
    scrolling exceeds the bounds of the content.</p>
  </blockquote>
  
  <p>Based on this, let's walk through how constraints ought to be set up.</p>
  
  <p>To make it easier to discuss, lets say we have 3 views as a general case - the default main view controller view (A), its subview being a UIScrollview (B), and the UIScrollview has a single subview which is a UIView (C). Let's say we want (C) to be 1000 units tall.</p>
  
  <p>So we go into the interface builder, select the view controller in the story board and on the attributes inspector tab change the size to freeform. For views (A), (B), and (C) we change the height to 1000 on the size inspector tab.</p>
  
  <p><strong>Constraints Between (A) and Main Window</strong></p>
  
  <p>Time to setup constraints. The documentation clearly states "(The Scrollview) clips the content to its frame, which generally (...) coincides with that of the application’s main window". In our example (A) will coincide with the application main window and no constraints are necessary for this. </p>
  
  <p><strong>Constraints Between (A) and (B)</strong></p>
  
  <p>Now the documentation was clear about having (B) coincide exactly with (A), so we'll set up 4 constraints between them, leading space, trailing space, top space, and bottom space to superview all with a constant of 0.</p>
  
  <p><strong>Constraints Between (B) and (C)</strong></p>
  
  <p>The documentation is not so straight forward here. It says that (B)'s origin is adjustable over (C), so (B) should definitely be smaller than (C). Since we know the scrolling is only going to be up and down, we can constrain the left and right edged between (B) and (C) to zero, and we always want it to be in the middle so we'll add a center x alignment. We'll add 3 constraints between them, leading space and trailing space to superview with a constant of 0, and center x alignment. In order to position the view we need something for the top and bottom, and honestly I'm not sure how these constraints should be set up based on the documentation. Based on imitating Matt Neuberg's <a href="https://github.com/mattneub/Programming-iOS-Book-Examples/tree/master/ch20p573scrollViewAutoLayout2" rel="noreferrer">example</a> I made them top space to superview with a constant of zero, and bottom space to superview with whatever constant it generates by default. This bottom space to superview constraint is special (apparently), from now on it shall be referred to as "specialConstraint".</p>
  
  <p>So... what?! We started this paragraph out by saying (B) should definitely be smaller than (C), and ended it by setting up constraints to make them exactly the same size. <em>Question 1 - Why is this?</em></p>
  
  <p><strong>Constraints on (C) by Itself</strong></p>
  
  <p>We know that (C) must be larger than (B) so that (B) has something to scroll over, and (C) should determine its size based on its own constraints. Easy enough, we set 1 constraint, height = 1000.</p>
  
  <p><strong>specialConstraint</strong></p>
  
  <p>Now we create an outlet for specialConstraint in the view controller, and in the viewDidLoad method we set self.specialConstraint.constant = 0; This means that the bottom of the content view should be pinned exactly to the bottom of the scroll view, which would give you nothing to scroll down over. But this works in Matt Neuberg's example. <em>Question 2 - why is this?</em></p>
  
  <p><strong>What's Really Happening When a Scrollview Scrolls</strong></p>
  
  <p>I would think the logical thing to do would be to have the frame of the scroll view fixed, and the origin of the content view (or the content offset) move around with the scrolling and the content shows the scrollview like a window. Similar to viewing a paper through a hole in a wall by sliding the paper around.</p>
  
  <p>However, based on my reading the scrollview's frame is actually doing the moving, like a magnifying glass over a fixed page.</p>
  
  <p><em>Question 3 - Can someone please explain what's happening when a scrollview scrolls, which object's frame origin is actually changing, and why is it done this way?</em></p>
  
  <p><em>Question 4 - Can anyone explain how the constraints should be set between (A), (B), and (C) in plain English?</em></p>