IOS6之AutoLayout（一）

IOS6之AutoLayout（一）

http://blog.csdn.net/zfpp25_/article/details/8861221

IOS6之AutoLayout（二）

http://blog.csdn.net/zfpp25_/article/details/8861855

IOS6之AutoLayout（三）

http://blog.csdn.net/zfpp25_/article/details/8861958

IOS6之AutoLayout（四）

http://blog.csdn.net/zfpp25_/article/details/8862040

IOS6之AutoLayout（五）

http://blog.csdn.net/zfpp25_/article/details/8862157

IOS6出現之後，新建一個ViewController，從NIB文件初始化，然後添加到window上。然後用5.0模擬器去執行項目，會發現app崩潰了。原因就是IOS6之後，NIB文件的選項中多了AutoLayout屬性，而IOS6之前是不支持的，所以項目崩潰了，解決辦法是取消AutoLayout就可以在5的模擬器上運行了。但一味的避開AutoLayout這個新特性也不是辦法，所以研究了下。

AutoLayout是什麼？

Before iOS6, layout was mainly by autosizing, also known as the “springs and struts” method. In iOS6, we will use AutoLayout, which will make it easier to design interfaces for various sceen sizes.

簡單的理解就是爲了實現屏幕中控件的佈局，android開發時候，佈局是件很痛苦的事情，因爲，android的屏幕型號太多了。幸好IOS到目前爲止比android程序員在屏幕適配上輕鬆許多。

爲什麼要使用AutoLayout？

IOS設備的尺寸會漸漸的更新，所以早點適應相對佈局來完成UI界面是必要的。

如何使用AutoLayout？

下面會詳細的講解：

例1：我們以前創建一個按鈕，按鈕的frame爲 CGRect(20, 30, 280, 44) 的按鈕，我們會毫不猶豫的這樣寫：

UIButton *firstButton = [UIButtonbuttonWithType:UIButtonTypeRoundedRect];
[firstButtonsetTitle:@"FirstFirstFirstFirst"forState:UIControlStateNormal];
firstButton.frame = CGRect(20, 30, 280, 49);
[self.viewaddSubview:firstButton];

這樣很簡單的就實現了按鈕在self.view中的的絕對佈局。

下面來看看，使用AutoLayout相對佈局，同樣的一個按鈕是怎麼實現的：

UIButton *firstButton = [UIButton buttonWithType:UIButtonTypeRoundedRect];
[firstButtonsetTitle:@"FirstFirstFirstFirst"forState:UIControlStateNormal];
[firstButton sizeToFit];
firstButton.translatesAutoresizingMaskIntoConstraints =NO;
[self.viewaddSubview:firstButton];

//開始相對佈局

//首先，先對其按鈕的左邊和self.view左邊的距離

   

NSLayoutConstraint *constraint = [NSLayoutConstraint
                                     constraintWithItem:firstButton
                                     attribute:NSLayoutAttributeLeading
                                     relatedBy:NSLayoutRelationEqual
                                     toItem:self.view
                                     attribute:NSLayoutAttributeLeading
                                     multiplier:1.0f
                                     constant:20.f];
   [self.view addConstraint:constraint];

    //然後，先對其按鈕的右邊和self.view右邊的距離

constraint = [NSLayoutConstraint
              constraintWithItem:firstButton
              attribute:NSLayoutAttributeTrailing
              relatedBy:NSLayoutRelationEqual
              toItem:self.view
              attribute:NSLayoutAttributeTrailing
              multiplier:1.0f
              constant:-20.f];
[self.view addConstraint:constraint];

//然後，先對其按鈕的上邊和self.view上邊的距離

    

constraint = [NSLayoutConstraint
                  constraintWithItem:firstButton
                  attribute:NSLayoutAttributeTop
                  relatedBy:NSLayoutRelationEqual
                  toItem:self.view
                  attribute:NSLayoutAttributeTop
                  multiplier:1.0f
                  constant:30.f];
    [self.view addConstraint:constraint];

    //最後，先對其按鈕的下邊和self.view下邊的距離

    

constraint = [NSLayoutConstraint
                  constraintWithItem:firstButton
                  attribute:NSLayoutAttributeBottom
                  relatedBy:NSLayoutRelationEqual
                  toItem:self.view
                  attribute:NSLayoutAttributeBottom
                  multiplier:1.0f
                  constant:((30 +44) - (460-44))];
 [self.view addConstraint:constraint];

同樣也實現了一個按鈕，但代碼量實在是翻了幾倍，現在可以理解android程序員的痛苦了。

那麼上面相對佈局的代碼中，一些關鍵點如何理解呢？下面做簡單介紹：

0、translatesAutoresizingMaskIntoConstraints：

The translatesAutoresizingMaskIntoConstraints property is set to NO, so our constraints will not conflict with the old “springs and struts” method.

1、NSLayoutConstraint類，是IOS6引入的，字面意思是“約束”、“限制”的意思，實現相對佈局，就依靠這個類了；

2、怎麼理解這個方法調用：

NSLayoutConstraint *constraint = [NSLayoutConstraint
                                   constraintWithItem:firstButton        firstButton是我們實例化的按鈕
                                   attribute:NSLayoutAttributeLeading    firstButton的左邊
                                   relatedBy:NSLayoutRelationEqual       firstButton的左邊與self.view的左邊的相對關係
                                   toItem:self.view                      指定firstButton的相對的對象是self.view
                                   attribute:NSLayoutAttributeLeading    相對與self.view的左邊（NSLayoutAttributeLeading是左邊的意思）
                                   multiplier:1.0f                                       （後文介紹）
                                   constant:20.f];                       firstButton左邊相對self.view左邊，偏移了20.0f
    [self.view addConstraint:constraint];                                將這個約束添加到self.view上

3、其他部分代碼同理，這樣就不難理解了：

NSLayoutAttributeTrailing  右邊

NSLayoutAttributeTop    上邊

NSLayoutAttributeBottom  下邊

4、這個難理解嗎？constant:((30 + 44) - (460-49))];  

按鈕上沿座標距selfview的上沿是30，打算讓按鈕的高度爲44, 屏幕的總高度爲460,再去掉tabBar的高度49。那按鈕的下沿距離self.view的下沿的距離是多少 ？

IOS相對佈局應該可以理解了，後續會繼續更新～

轉載請保留，原文鏈接：http://write.blog.csdn.net/postedit/8861221

若發現有不合適或錯誤之處，還請批評指正，不勝感激。