本文首發(fā)地址

AutoLayout約束是蘋果官方給定得約束信息。對(duì)于這個(gè)約束和UIView+AutoLayout.h延展的用法類似，不過加上了延展之后，不用寫VFL語言

下面先看看以autolayout實(shí)現(xiàn)的效果為例我們講解一下

20151128112537287.png

下面開始上代碼以用戶名和密碼為例，來說說，

    UITextField * userNameTextFiled = [[UITextField alloc] init];
    userNameTextFiled.borderStyle = UITextBorderStyleRoundedRect;
    userNameTextFiled.placeholder = @"用戶名";
    userNameTextFiled.translatesAutoresizingMaskIntoConstraints=NO;
    [self.view addSubview:userNameTextFiled];
    
    UITextField * userPwdTextFiled = [[UITextField alloc] init];
    userPwdTextFiled.borderStyle = UITextBorderStyleRoundedRect;
    userPwdTextFiled.placeholder = @"密碼";
    userPwdTextFiled.translatesAutoresizingMaskIntoConstraints=NO;
    [self.view addSubview:userPwdTextFiled];

在這里有兩點(diǎn)必須說明：
1：在對(duì)控件allo的時(shí)候我們一定忘掉設(shè)置他得CGRectMake
2：也是重中之重的，不然會(huì)導(dǎo)致嚴(yán)重的性能問題，一定要對(duì)當(dāng)前控件的
translatesAutoresizingMaskIntoConstraints的屬性設(shè)置為NO，不然無法使用。。。
首先看看這兩個(gè)約束的方法

- (void)addConstraint:(NSLayoutConstraint *)constraint NS_AVAILABLE_IOS(6_0); // This method will be deprecated in a future release and should be avoided.  Instead, set NSLayoutConstraint's active property to YES.
- (void)addConstraints:(NSArray<__kindof NSLayoutConstraint *> *)constraints NS_AVAILABLE_IOS(6_0); // This method will be deprecated in a future release and should be avoided.  Instead use +[NSLayoutConstraint activateConstraints:].

這里有兩個(gè)方法，一個(gè)是添加的數(shù)組，一個(gè)添加屬性約束，我們?cè)谟肰FL約束的時(shí)候，一定要是用addConstraints的約束方法名。。。。

下面開始說約束的VFL代碼

NSDictionary * views = NSDictionaryOfVariableBindings(userPwdTextFiled,userNameTextFiled);
    
 NSDictionary *metrics = @{@"padding":@10,@"leftPadding":@10,@"rightPadding":@10,@"height":@40,@"width":@50};   
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"|-30-[userNameTextFiled]-30-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(userNameTextFiled)]];
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-50-[userNameTextFiled(==40)]" options:0 metrics:nil views:views]];
    
    
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"|-30-[userPwdTextFiled]-30-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(userPwdTextFiled)]];
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[userNameTextFiled]-40-[userPwdTextFiled(==userNameTextFiled)]" options:0 metrics:nil views:views]];

看到方法中有
參數(shù)為字典類型參數(shù)的views，他代表的是，你要添加約束的對(duì)象的集合。。切記一定要把你坐相對(duì)布局約束的對(duì)象添加進(jìn)去。。。
參數(shù)為字典類型參數(shù)的metrics, 這里你可以隨意的設(shè)置你想要的間隔的屬性名稱。。?？梢苑旁赩FL的語言里隨意的加入

下面介紹VFL語言語法格式

H：代表水平方向 H:| 代表水平方向距離父視圖
V：代表垂直方向 V:| 代表垂直方向距離父視圖

H:[BackView(320)] 代表水平方向BackView的寬度為320
V:[BackView(320)] 代表垂直方向BackView的寬度為320

|-30-[userNameTextFiled]-30-|
代表userNameTextFiled控件距離父視圖水平方向的左邊和右邊的距離為30，
H:|-30-[userNameTextFiled]-30-|
V:|-50-[userNameTextFiled(==40)]
代表userNameTextFiled控件距離父視圖垂直方向的的距離為50 ，并且高度為40

設(shè)置某個(gè)控件作為父視圖 并設(shè)置距離
V:[userNameTextFiled]-40-[userPwdTextFiled(==userNameTextFiled)]
代表userPwdTextFiled控件距離 userNameTextFiled控件的垂直方向的距離為40 并且他的高度等于userNameTextFiled的高度

如果我們用上metrics
NSDictionary *metrics = @{@"padding":@30,@"leftPadding":@10,@"rightPadding":@10,@"height":@40,@"width":@50};//

我們?cè)趯懠s束的時(shí)候就可以
H:|-padding-[firstButon(==width)]
V:[userPwdTextFiled]-padding-[firstButon(==height)]

注意的是！！?。?！
我們?cè)趯慥FL語言的時(shí)候，
1：一定要確定后面views和metrics里頭包含的內(nèi)容必須有我們要用到得屬性和view
2：我們?cè)趯慔 , V的時(shí)候一定要大寫，不然會(huì)報(bào)錯(cuò)。。。。。

1：首先看

- (void)addConstraint:(NSLayoutConstraint *)constraintNS_AVAILABLE_IOS(6_0);// This method will be deprecated in a future release and should be avoided.  Instead, set NSLayoutConstraint's active property to YES.

這個(gè)方法如何使用。。（本人覺得這個(gè)方法用起來很爽，東西太多。。。）
代碼如下

    //垂直居中
    [self.view addConstraint:[NSLayoutConstraint constraintWithItem:BackView
                                                          attribute:NSLayoutAttributeCenterY
                                                          relatedBy:NSLayoutRelationEqual
                                                             toItem:self.view
                                                          attribute:NSLayoutAttributeCenterY
                                                         multiplier:1
                                                           constant:0]];
    //水平居中
    [self.view addConstraint:[NSLayoutConstraint constraintWithItem:BackView
                                                          attribute:NSLayoutAttributeCenterX
                                                          relatedBy:NSLayoutRelationEqual
                                                             toItem:self.view
                                                          attribute:NSLayoutAttributeCenterX
                                                         multiplier:1
                                                           constant:0]];

   //約束條件
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:[BackView(320)]" options:0 metrics:metrics views:viewsButton]];
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[BackView(350)]" options:0 metrics:metrics views:viewsButton]];

上面的代碼就是他得用法，設(shè)置水平居中，設(shè)置垂直居中，在設(shè)置他得大小水平方向?qū)挾葹?20，垂直方向高度為350，這樣就可以控制居中顯示。。。。
下面說一下具體參數(shù)
constraintWithItem:要設(shè)置的控件的名稱
attribute：要設(shè)置的控件的屬性
relatedBy：相對(duì)關(guān)系（NSLayoutRelationEqual）
toItem：相對(duì)于哪個(gè)視圖
attribute：相對(duì)于哪個(gè)視圖的屬性
multiplier：相對(duì)縮放比例
constant