Content Hugging Priorities And Content Compression Resistance Priorities

At times, some of the apples API are a lot confusing and really hard to understand. Same is the case with content hugging priority and content compression resistance priorities. So lets dive in and understand what they are all about.

Content Hugging Priority

Hugging priority comes into action when available content size is more than the total size of the content. Content size can be defined in Vertical and Horizontal axis. Hence we have Content Hugging Priority for Vertical axis and Content Hugging Priority for horizontal axis.

Lets understand the bolded statement with an horizontal axis example.
Suppose we create a view like this, where 1,2,3,4 and 5 are equality constraints with some constant.

Here the available content size is the width of the screen , and total size of the content is the sum of intrinsic width of Product and Apple Macbook.

Obviously, the available width is more than the actually required width. This creates a a confusion for autolayout engine as to which of the labels to be expanded, so to full fill the extra available width.

This confusion is created as 3,4 and 5 are equality constraints. Had been any one of them be ‘greater than or equal’ constraint, this confusion would have not existed on the first place.

The Content Hugging Priority resolves this confusion. Setting any one of the labels Content Hugging Priority to greater than the other does the trick, and the one with higher priority hugs its content more and make the other expand more than its intinsic content.

So if we set the primary label’s (label with ‘Product’) hugging priority to default high

primaryLabel.setContentHuggingPriority(UILayoutPriorityDefaultHigh, forAxis:.Horizontal)

and for secondary label’s(label with ‘Apple Macbook’) hugging priority to default low

secondaryLabel.setContentHuggingPriority(UILayoutPriorityDefaultLow, forAxis:.Horizontal)

We get to see this,

When we reverse the relative priorities, and make primaryLabel hug its content with less priority than the secondaryLabel,

primaryLabel.setContentHuggingPriority(UILayoutPriorityDefaultLow, forAxis:.Horizontal)
secondaryLabel.setContentHuggingPriority(UILayoutPriorityDefaultHigh, forAxis:.Horizontal)

we get to see this,

Makes sense right? So now lets look what’s content compression resistance all about.


Content Compression Resistance Priority

Content hugging priority comes in action when there is lesser content to display, than the available size. Content compression resistance priority is exactly opposite. It comes into action when content requires more size than the available.

For example if product name would have been “Apple Macbook Pro — Retina”.

With this long text, both “Product” and “Apple Macbook Pro Retina 2013” cannot fit together without truncating/diminishing.

But the who decides which one should truncate? Its the content compression resistance priority.

So if we set content compression resistance priority of primary label higher than the secondary label, the secondary label would truncate. So with,

primaryLabel.setContentCompressionResistancePriority(UILayoutPriorityDefaultHigh, forAxis: .Horizontal)
secondaryLabel.setContentCompressionResistancePriority(UILayoutPriorityDefaultLow, forAxis: .Horizontal)

we get to see this,

And when, content compression resistance priority of primary label is set lower than the secondary label, the primary label would truncate. So with,

primaryLabel.setContentCompressionResistancePriority(UILayoutPriorityDefaultLow, forAxis: .Horizontal)
secondaryLabel.setContentCompressionResistancePriority(UILayoutPriorityDefaultHigh, forAxis: .Horizontal)

we get to see this,

You can find the complete gist over here to play with priorities and their behaviour.

Cheers !!!

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.