title: Using AutoLayout and ensuring bounds of parent view to fit subviews when resized
body: <p>I really wish I could get my head around auto layout. It seems that whenever I read an abstract description of how things are supposed to work it makes sense, but whenever I actually try and put it into practise it always causes massive headaches. So, apologies if there is already an answer out there for this but I couldn't find one.</p>
  
  <p>The problem should be relatively simple. I have a container view, which contains two subviews, shown here in hideous colours for maximum readability :) :</p>
  
  <p><img src="https://i.stack.imgur.com/2lBTh.png" alt="enter image description here"></p>
  
  <p>The bottom (black) view, should remain at it's current size and maintain the spacing between it and the red view, and the spacing between itself and the bottom of yellow view.
   The red view I want to be able to dynamically change its height, causing the black view to shift up/down accordingly whilst the yellow view resizes to fit both the red+black views. </p>
  
  <p>For the black view, I've added constraints to:</p>
  
  <ul>
  <li>Set the height to 94</li>
  <li>Pin the leading and trailing space to superview</li>
  <li>Set the top space to the red view at 51.</li>
  <li>Set the bottom space to the yellow view at 20.</li>
  </ul>
  
  <p><img src="https://i.stack.imgur.com/FPmsX.png" alt="enter image description here"></p>
  
  <p>I am trying to understand what seemingly-mystical set of constraints I need to add in order that, when the red view is resized vertically, the black view stays its current distance from the red view and maintains its size, and the outer container view resizes accordingly so that it contains the red view + black view + vertical spacing between the views. </p>
  
  <p>For the red view, I've added constraints to pin the top, left and right spacing to superview, but have had no luck working out the vertical constraints. Currently I've got a constraint pinning the height =114 with a priority of 999 and a constraint with height >=114 with a priority of 1000 thinking this would ensure the view is always at least 114 in height... </p>
  
  <p><img src="https://i.stack.imgur.com/blwzB.png" alt="enter image description here"></p>
  
  <p>The fun starts when I try and manually set the height of the red view.... I've added a button on the view, and when the button is pressed, I manually set the bounds of the red view. (The red view's default height is 114):</p>
  
  <pre><code>CGRect bounds = self.redView.bounds;
  bounds.size.height = 300;
  self.redView.bounds = bounds;
  </code></pre>
  
  <p>When I run this and press the button, the view goes from this:</p>
  
  <p><img src="https://i.stack.imgur.com/QHeuv.png" alt="enter image description here"></p>
  
  <p>To this:</p>
  
  <p><img src="https://i.stack.imgur.com/LZEn9.png" alt="enter image description here"></p>
  
  <p>To me this makes no sense whatsoever. Why does this result in:</p>
  
  <ul>
  <li>The Y origin of the red view changing? Particularly when there is a "required" constraint telling it to stay 20pts from the top of yellow view.</li>
  <li>The spacing between the red and black views breaking down, even though the constraint on the spacing between them is "required"?</li>
  <li>The vertical size of yellow view not changing. Again, despite the spacing between red+black, and me having tried just about every combination I can think of in terms of compression resistance and content hugging priority.....</li>
  </ul>
  
  <p>I really want to understand this, so would be really grateful if someone can explain what additional constraints / changes to constants are required, but more importantly WHY they are required, because to me it doesn't seem clear at all how the layout system comes up with its answers....</p>
  
  <p>Any clarification much appreciated.</p>
  
  <p>Thanks in advance</p>
  
  <p>(All code above is running on iOS 7 and built with Xcode 5.0.2).</p>