Content Hugging: A Brief Embrace
At the end of yesterday's post we hovered over the input boxes for Content Compression Resistance Priority and discovered that in short it simply means 'Resistance to being made smaller'. And from hovering over the equivalent input boxes for Content Hugging Priority (CHP) we see that Hugging defines the resistance to being made larger.
It is this "resistance to being made larger", or hugging, that I want now to briefly look at in a rather contrived example here:
1. You can either begin with the same project as last time and remove the spacer view from your view controller, or you can drag out two buttons and connect restraints to the edges closest the superview and to the bottom of the superview before proceeding.
2. Once you've completed step 1, add a background colour to the buttons that remain.
3. Stretch the leftmost button so that it almost touches the rightmost one and then connect the two buttons horizontally by dragging out a constraint between the them. (As always selecting the top option when the small list appears.)
5. Build and Run in an iPhone simulator or on a iPhone.
Notice that the buttons far from appearing as they do in the storyboard are actually inverted in their sizings.
A button naturally wants to be the size dictated by its contents and if both values were set equal then the compiler would complain that there was ambiguity over what was to happen and the horizontal constraint would be coloured red. (This isn't a good sign. Your aim should always be to eradicate ambiguity and to see all constraints coloured blue otherwise behaviour will be unpredictable.)
Breaking Constraints
It should be noted here for completeness that we could double click the constraint (between the two buttons) and set its priority beneath the level of the hugging priority of the two views so that the constraint gives way under pressure. (For more information on setting constraint priority see yesterday's post.)
Note: Next week (on Monday), I will explore constraints in more depth looking at them in relation to constants, multipliers, ratios and relations. Stay tuned! It's going to be essential reading.
Note: Next week (on Monday), I will explore constraints in more depth looking at them in relation to constants, multipliers, ratios and relations. Stay tuned! It's going to be essential reading.
Conclusion
In terms of Auto Layout inside storyboards this series has already covered quite a few angles: centring views, fixed constraints, aspect ratio, equal heights and widths, fixed heights and widths, class sizes, compression resistance, and hugging priority. But still there are some buttons we haven't pressed and boxes we haven't checked.As noted above, I'll be looking in the next post at the fine-tuning of constraints through the use of multipliers, ratios, constants and relations. This will be a fairly in-depth post, covering areas that at first seem fairly unimportant but actually blossom into an area of essential knowledge for using Auto Layout. After that I'll be moving on to write about Alignment Constraints before venturing into an exploration of the newly introduced UIStackView.
Comments
Post a Comment