------------ VFL API介紹 ------------

 1.NSLayoutConstraint API
 
 + (NSArray *)constraintsWithVisualFormat:(NSString *)format options:(NSLayoutFormatOptions)opts
 metrics:(NSDictionary *)metrics
 views:(NSDictionary *)views;
 參數(shù)介紹:
 
 format:此參數(shù)為你的vfl語句，比如:@"H:|-[button]-|"
 
 opts:枚舉參數(shù)，默認寫0，具體跟據(jù)你所實現(xiàn)的需求去選擇你想要的枚舉
 
 metrics:這里是一個字典，當在format中使用了動態(tài)數(shù)據(jù)比如上現(xiàn)這句:@"H:|-[button(==width)]-|",表示這個button的寬度為width,那么這個參數(shù)去哪里找呢？就是在這個字典里面找到key對就的值，如果沒有找到這個值，app就會crash.
 
 views:顧名思義，這是傳所有你在vfl中使用到的view，那在上面這句例子中的應該怎么傳呢？結(jié)果是這樣的：NSDictionaryOfVariableBindings(button).如果你使用到了多個view，就可以這樣NSDictionaryOfVariableBindings(button,button1,button3...),這個名字也要跟參數(shù)format中的一一對應，缺一不可.注意這一點，否則會crash
 
 2.UIView API
 
 - (void)addConstraints:(NSArray *)constraints;
 在上面1中返回值類型是NSArray,而現(xiàn)在這個方法的參數(shù)也剛好是一個NSArray類型。那么直接把上一個方法的返回值當作這個方法的參數(shù)就可以了。如果你有多個VFL，你也可以利用可變數(shù)組( NSMutableArray)把這多個VFL返回的數(shù)據(jù)拼在一起，然后再調(diào)用addConstraints:方法。

1:單控件的使用

///第一個aButton
UIButton *aButton = [UIButton buttonWithType:UIButtonTypeCustom];
[aButton setTitle:@"點擊一下" forState:UIControlStateNormal];
aButton.backgroundColor = [UIColor blackColor];

///PS:值得注意的是,在用代碼創(chuàng)建的UIView時，一定要加上下面這句代碼，如果沒有上面這一行，你的約束將不生效,控制臺會輸出一連串的錯誤.
aButton.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addSubview:aButton];

/**
這里的意思是：aButton在水平方向上距離它的superView，左右各20px，比如在這里他的大小就是 屏幕寬-20*2=280.在@"H:|-[aButton]-|"這個語句中，其中"H:"是表示這是水平方向上的約束，"|"是表示superView，"-"表示一個間隔空間，這個間隔如果是如superView之間的，那么就是20px,如果是兩個同級別的view，比如@"[aButton]-[bButton]"，那么這里表示的是8px.
上面說的都是默認值，如果不想要默認，想緊貼著邊，可以這樣寫：@"H:|-(0)-[aButton]-(0)-|" ;這樣就是緊貼著了。
*/

NSArray *contraints1 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[aButton]-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(aButton)];

/**
跟上面有點不同,@"V:|-20-[button(==30)]",其中"V:"中代表這是垂直方向上的約束,"|-20-"這里的意思就是距離頭部為20px，相當于y坐標為20。后面的"[aButton(==30)]"，是指定這個aButton的高度為30px.y坐標固定了，高度固定了，那這個view的約束就完成了。如果你有需要，你的高度值（或者其他同類型的）可以使用>=,==,<=來表示，甚至你可以組合來用，像上面的30，你可以指定一個區(qū)別，比如:(>=30,<=40)，這同樣也是可以的。如果你想表達他的優(yōu)先級別,可以使用@"V:|-20-[aButton(==30@1000)]",這個@1000，就是他的級別了。你可以適配XIB或者SB對它的優(yōu)先級做更多的處理.
*/

NSArray *contraints2 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-20-[aButton(==30)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(aButton)];

[self.view addConstraints:contraints1];
[self.view addConstraints:contraints2];

2:多控件之間關聯(lián)使用

///第二個bButton
UIButton *bButton = [UIButton buttonWithType:UIButtonTypeCustom];
[bButton setTitle:@"我是第二個bButton" forState:UIControlStateNormal];
bButton.backgroundColor = [UIColor blueColor];

bButton.translatesAutoresizingMaskIntoConstraints = NO;

[self.view addSubview:bButton];

///添加H水平約束

NSArray *contraints3 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[bButton]-|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(bButton)];

/**
VFL語句為：@"V:[aButton]-[bButton(==30)]"，這里用到了兩個view在VFL語句里面。剛才我們也說到，"-"在同一級別的View上使用的時候表示的間距為8個像素點,整一句的意思就是bButton的y坐標離aButton有8個像素點.在不使用auto layout的時候，可以這樣表達CGRectGetMaxY(aButton.frame)+8.
當然，如果想距離50像素可以這樣寫：@"V:[aButton]-50-[bButton(==30)]";

添加V垂直約束 (最后面字典views后的參數(shù)跟 format 中出現(xiàn)的要一一對應，缺一不可.否則會報aButton is not a key in the views dictionary)比如 VFL 出現(xiàn)了兩個button，那么后面也要有這兩個button
*/

NSArray *contraints4 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[aButton]-[bButton(==30)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(aButton,bButton)];

[self.view addConstraints:contraints3];
[self.view addConstraints:contraints4];

///注釋了上面的 添加contraints4 , 再改一下上面這一句VFL

NSArray *contrainst5 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[aButton]-[bButton(==height)]" options:0 metrics:@{@"height":@30} views:NSDictionaryOfVariableBindings(aButton,bButton)];

[self.view addConstraints:contrainst5];

//再次運行，你會發(fā)現(xiàn)，效果是一樣的。這樣你就知道怎么動態(tài)去給view加上高度或者寬度，或是其他間距了吧？

/**
那么，如何做到兩個View，或是多個View之間等高，或者等寬呢？能用VFL可以做到嗎？除了通過上面的直接賦值寬高的數(shù)值外，VFL還提供了另外一種寫法用于等寬等高上。

接著上面，我們改一下代碼
*/

NSArray *contrainst6 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[bButton(aButton)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(aButton,bButton)];

NSArray *contrainst7 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[aButton]-[bButton(aButton)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(aButton,bButton)];

//通過@"H:|-[button1(button)]"，@"V:[button]-[button1(button)]"，這兩句就可以輕松實現(xiàn)等寬等高了！

[self.view addConstraints:contrainst6];
[self.view addConstraints:contrainst7];

pragma 3：最后對格式的字符串作一個總結(jié)介紹

/**
 
 功能　　　　　　　　表達式
 
 水平方向  　　　　　　  H:  Horizontal
 
 垂直方向  　　　　　　  V:  Vertical
 
 Views　　　　　　　　 [view]
 
 SuperView　　　　　　|
 
 關系　　　　　　　　　>=,==,<=
 
 空間,間隙　　　　　　　-
 
 優(yōu)先級　　　　　　　　@value
 
 */

///例子

UIView *aView = [[UIView alloc]init];
aView.backgroundColor = [UIColor cyanColor];
[self.view addSubview:aView];

//沒有這句的話，而又加了下面兩句 addConstrainsts 則 aView 都不會顯示在self.view上，即使上一句寫了 addSubview。
aView.translatesAutoresizingMaskIntoConstraints = NO;

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-40-[aView(==50)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(aView)]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[bButton]-30-[aView(==50)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(aView,bButton)]];


UIView *bView = [[UIView alloc]init];
bView.backgroundColor = [UIColor purpleColor];
[self.view addSubview:bView];

bView.translatesAutoresizingMaskIntoConstraints = NO;

///實現(xiàn)與aView等大小
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:[aView]-50-[bView(aView)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(aView,bView)]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[bButton]-30-[bView(aView)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(bButton,bView,aView)]]; //注意后面字典中出現(xiàn)的views一定要與FLV里出現(xiàn)的一致，不能少,多了可以，如寫上aButton也沒關系。


///這樣就可以根據(jù)（如果有一個裝文字的label，算出其rect）大小設置view的大小了
CGFloat fload = 100;
NSDictionary *dic = @{@"width":@(fload),@"height":@50};

UIView *cView = [[UIView alloc]init];
cView.backgroundColor = [UIColor grayColor];
[self.view addSubview:cView];

cView.translatesAutoresizingMaskIntoConstraints = NO;

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:[bView]-50-[cView(==width)]" options:0 metrics:dic views:NSDictionaryOfVariableBindings(bView,cView)]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[bButton]-30-[cView(==height)]" options:0 metrics:dic views:NSDictionaryOfVariableBindings(bButton,cView)]];



///根據(jù)文字大小來決定view的長度
UILabel *label1 = [[UILabel alloc]init];
label1.backgroundColor = [UIColor yellowColor];
label1.text = @"abcdefghijklmnddsafksajfkjwiojfaj";
label1.translatesAutoresizingMaskIntoConstraints = NO;
[self.view addSubview:label1];

///計算文字長度
float width = [label1 textRectForBounds:CGRectMake(0, 0, CGFLOAT_MAX, 30) limitedToNumberOfLines:1].size.width;
NSDictionary *dic2 = @{@"width2":@(width)};
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-40-[label1(==width2)]" options:0 metrics:dic2 views:NSDictionaryOfVariableBindings(label1)]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[cView]-50-[label1(==30)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(cView,label1)]];

//另一種計算文字長度的方法
//CGRect rect = [label.text boundingRectWithSize:CGSizeMake(CGFLOAT_MAX, high) options:NSStringDrawingUsesLineFragmentOrigin attributes:@{NSFontAttributeName:[UIFont systemFontOfSize:label.font.pointSize]} context:nil];
//float width = rect.size.width;