天天看點

AutoLayout中的Content Hugging 和 Content Compression Resistance

iOS6中引入了AutoLayout,極大的友善了UI元素的布局,現在已經過去一年了,并且大部分裝置的系統也已經更新到了iOS6,是時候要使用此項技術了。

在AutoLayout的學習中有兩個概念官方文檔講述的不是很清楚,今天花費了2個小時的時間研究了一下,在此總結一下。

Content Hugging 和 Content Compression Resistance

這兩個屬性對有intrinsic content size的控件(例如button,label)非常重要。通俗的講,具有intrinsic content size的控件自己知道(可以計算)自己的大小,例如一個label,當你設定text,font之後,其大小是可以計算到的。關于intrinsic content size官方的解釋:

Custom views typically have content that they display of which the layout system is unaware. Overriding this method allows a custom view to communicate to the layout system what size it would like to be based on its content. This intrinsic size must be independent of the content frame, because there’s no way to dynamically communicate a changed width to the layout system based on a changed height, for example.

好了,了解了intrinsic content size的概念之後,下面就重點讨論Content Hugging 和 Content Compression Resistance了。

UIView中關于Content Hugging 和 Content Compression Resistance的方法有:

- (UILayoutPriority)contentCompressionResistancePriorityForAxis:(UILayoutConstraintAxis)axis

- (void)setContentCompressionResistancePriority:(UILayoutPriority)priority forAxis:(UILayoutConstraintAxis)axis

- (UILayoutPriority)contentHuggingPriorityForAxis:(UILayoutConstraintAxis)axis

- (void)setContentHuggingPriority:(UILayoutPriority)priority forAxis:(UILayoutConstraintAxis)axis

大概的意思就是設定優先級的。

Hugging priority 确定view有多大的優先級阻止自己變大。

Compression Resistance priority确定有多大的優先級阻止自己變小。

很抽象,其實content Hugging就是要維持目前view在它的optimal size(intrinsic content size),可以想象成給view添加了一個額外的width constraint,此constraint試圖保持view的size不讓其變大:

view.width <= optimal size

此constraint的優先級就是通過上面的方法得到和設定的,content Hugging預設為250.

Content Compression Resistance就是要維持目前view在他的optimal size(intrinsic content size),可以想象成給view添加了一個額外的width constraint,此constraint試圖保持view的size不讓其變小:

view.width >= optimal size

此預設優先級為750.

還是很抽象,好吧,下面舉個例子就明白了。

[objc]  view plain copy print ?

AutoLayout中的Content Hugging 和 Content Compression Resistance
AutoLayout中的Content Hugging 和 Content Compression Resistance
  1. button1 = [UIButton buttonWithType:UIButtonTypeRoundedRect];  
  2. button1.translatesAutoresizingMaskIntoConstraints = NO;  
  3. [button1 setTitle:@"button 1 button 2" forState:UIControlStateNormal];  
  4. [button1 sizeToFit];  
  5. [self.view addSubview:button1];  
  6. NSLayoutConstraint *constraint = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeLeading multiplier:1.0f constant:100.0f];  
  7. [self.view addConstraint:constraint];  
  8. constraint = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeTop multiplier:1.0f constant:100.0f];  
  9. [self.view addConstraint:constraint];  
  10. constraint = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeTrailing multiplier:1.0f constant:-150.0f];  
  11. constraint.priority = 751.0f;  
  12. [self.view addConstraint:constraint];  

運作效果如下:

AutoLayout中的Content Hugging 和 Content Compression Resistance

代碼很容易了解,建立一個button,設定其constraint,使其距離頂部100,距離左邊100,距離右邊150,注意右邊的constraint的優先級我們設定的為751.0,此時autolayout系統會去首先滿足此constraint,再去滿足Content Compression Resistance(其優先級為750,小于751)。

當我們把751變為749的時候,效果如下:

AutoLayout中的Content Hugging 和 Content Compression Resistance

這時就是先滿足了Content Compression Resistance的constraint,因為其優先級高。

下面舉的例子為Content Hugging的例子,代碼如下:

[cpp]  view plain copy

  1. button1 = [UIButton buttonWithType:UIButtonTypeRoundedRect];  
  2. button1.translatesAutoresizingMaskIntoConstraints = NO;  
  3. [button1 setTitle:@"button 1 button 2" forState:UIControlStateNormal];  
  4. [button1 sizeToFit];  
  5. [self.view addSubview:button1];  
  6. NSLayoutConstraint *constraint = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeLeading multiplier:1.0f constant:100.0f];  
  7. [self.view addConstraint:constraint];  
  8. constraint = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeTop multiplier:1.0f constant:100.0f];  
  9. [self.view addConstraint:constraint];  
  10. constraint = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeTrailing multiplier:1.0f constant:-10.0f];  
  11. constraint.priority = 251.0f;  
  12. [self.view addConstraint:constraint];  

運作效果如下:

AutoLayout中的Content Hugging 和 Content Compression Resistance

當把優先級priority改為249的時候,效果如下:

AutoLayout中的Content Hugging 和 Content Compression Resistance

這個就不用解釋了吧。