前言

作為一個剛?cè)腴T的IOS開發(fā)人員，最開始的時候是在XIB上拖動去畫界面。隨著業(yè)務(wù)的需求增長，我們會發(fā)現(xiàn)這種方式的布局已經(jīng)不能滿足我們的要求。為解決這種情況，我們會去用代碼去寫布局。在這一過程中，我自己是經(jīng)歷了兩步。第一次是在寫布局時自己去計算控件的位置，包括控件的x、y、width、height。這種處理方法在最開始的時候，還是可以去接受的，但是后來在處理一些居中布局以及UILbel的寬度等于內(nèi)容的寬度的情況下，這種方法會顯得很繁瑣、很愚蠢。為此我轉(zhuǎn)到了第二步-使用NSLayoutConstraint去寫布局，這個過程中自己學(xué)到了很多，在后續(xù)的過程中遇到布局的問題也就小case了。

因為現(xiàn)在的iPhone手機(jī)屏幕已經(jīng)越來越多，所以在寫布局時，一定要寫響應(yīng)式的布局，在所有的屏幕上的顯示要趨于一致。

NSLayouyConstraint

在提到代碼響應(yīng)式布局時，就不得不提到NSLayoutContraint，通過對控件添加一個或幾個約束，就能得到我們想要的結(jié)果。xib的布局也是使用這個給各種控件添加約束。

在給控件添加約束的過程中，主要是這個方法[NSLayoutConstraint constraintWithItem:需要添加約束的控件 attribute:需要約束的屬性 elatedBy:和參照控件屬性的關(guān)系 toItem:參照的控件 attribute:參照控件的屬性 multiplier:比例 constant:固定數(shù)值]。

針對上面的這個方法的作用有一個表達(dá)式可以很好描述:

需要添加約束的控件.需要約束的屬性 =  參照控件.參照屬性 * 比例 + 固定數(shù)值

參數(shù)說明

attribute

attribute：控件的屬性，包括上(NSLayoutAttributeTop)下(NSLayoutAttributeBottom)左(NSLayoutAttributeLeft)右(NSLayoutAttributeRight)邊距、寬度(NSLayoutAttributeWidth)、高度(NSLayoutAttributeHeight)、水平(NSLayoutAttributeCenterX)和垂直(NSLayoutAttributeCenterY)對其等, 詳細(xì)的說明可以去參照NSLayoutAttribute這個枚舉類型

elateBy

elateBy: 需要約束控件屬性和參照控件屬性之間的關(guān)系，包括小于等于(NSLayoutRelationLessThanOrEqual)、等于(NSLayoutRelationEqual)和大于等于(NSLayoutRelationGreaterThanOrEqual)

multiplier

multiplier: 參照控件屬性的比例，是一個浮點型的數(shù)值

constant

constant: 在比例基礎(chǔ)上增加一個固定的數(shù)值

下面提供兩個約束的例子

//self.customTitleLabel 和self.customTitleView垂直方向保持居中對齊
[NSLayoutConstraint constraintWithItem:self.customTitleLabel
                             attribute:NSLayoutAttributeCenterY
                             relatedBy:NSLayoutRelationEqual
                                toItem:self.customTitleView
                             attribute:NSLayoutAttributeCenterY
                            multiplier:1.0f
                              constant:0.0f].active = YES;

//self.customTitleImageView 緊跟著 self.customTitleLabel右側(cè)顯示
[NSLayoutConstraint constraintWithItem:self.customTitleImageView
                             attribute:NSLayoutAttributeLeft
                             relatedBy:NSLayoutRelationEqual
                                toItem:self.customTitleLabel
                             attribute:NSLayoutAttributeRight
                            multiplier:1.0f
                              constant:3.0f].active = YES;

注意：在寫完約束之后需要手動去激活，這也就是上面最后把active置成YES的原因。