使用自動布局的步驟是:
1工腋、使用代碼自動布局(autolayout) frame就會失效蚊伞,所以 不需要再去設(shè)置視圖的frame世曾,另外虱歪,使用代碼自動布局的時候 需要禁用translatesAutoresizingMaskIntoConstraints = NO匆帚;
2熬词、綁定視圖與字符串
3、添加約束
關(guān)于橫向豎向的設(shè)置:
橫向:距離父視圖左側(cè)100 視圖本身的寬度最小是100 距離父視圖右側(cè)100
H:|-50-[view1(>=100)]-50-|
豎向:距離父視圖頂部150 視圖本身高度是40
V:|-100-[view1(30)]
注意:|表示父視圖 吸重,-本身表示一段距離互拾, -距離-表示指定距離,[字符串表示的視圖] 表示參照視圖嚎幸,[字符串表示的視圖(視圖的寬高 或者 最小最大的寬高摩幔、相對寬高)]中的()小括號千萬不要丟掉。
第一種添加約束的方法:
- (void)demo1{
UIView *view = [UIView new];
// 1鞭铆、禁用
view.translatesAutoresizingMaskIntoConstraints = NO;
view.backgroundColor = [UIColor grayColor];
[self.view addSubview:view];
// 2或衡、綁定視圖和字符串
NSDictionary *views = NSDictionaryOfVariableBindings(view);
// 3、添加約束
// NSLayoutConstraint 約束的類
/*
VisualFormat:VFL語句
options:基于哪一個選項(基于方向去計算布局)
metrics:綁定數(shù)值 與字符串
views:綁定視圖 與字符串
*/
/*
橫向:距離父視圖左側(cè)100 視圖本身的寬度最小是100 距離父視圖右側(cè)100
豎向:距離父視圖頂部150 視圖本身高度是40
可視化語言
H:|-100-[view(>=100)]-100-|
V:|-100-[view(40)]
*/
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-100-[view(>=100)]-100-|" options:NSLayoutFormatAlignAllLeft metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-100-[view(40)]" options:NSLayoutFormatAlignAllLeft metrics:nil views:views]];
}
第二種添加約束的方法:
UIView *view1 = [self createView:@"UIView" addView:self.view];
UIView *view2 = [self createView:@"UIView" addView:self.view];
view1.backgroundColor = [UIColor redColor];
view2.backgroundColor = [UIColor grayColor];
// 2车遂、綁定
NSDictionary *views = NSDictionaryOfVariableBindings(view1,view2);
// 3封断、添加約束
/*
view2:
橫向:距離父視圖左側(cè)100 view2寬度最小是100 距離父視圖右側(cè)是100
豎向:距離view1 50 view2的高度和view1相同
可視化語言
view1:
H:|-100-[view(>=100)]-100-|
V:|-100-[view(40)]
view2:
H:|-100-[view2(>=100)]-100-|
V:[view1]-50-[view2(view1)]
*/
// view1:
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-100-[view1(>=100)]-100-|" options:NSLayoutFormatAlignAllLeft metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-100-[view1(40)]" options:NSLayoutFormatAlignAllLeft metrics:nil views:views]];
// view2:
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-100-[view2(>=100)]-100-|" options:NSLayoutFormatAlignAllLeft metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[view1]-50-[view2(view1)]" options:NSLayoutFormatAlignAllLeft metrics:nil views:views]];
}
第三種添加約束的方法:
- (void)demo3{
/*
研究發(fā)現(xiàn):
兩個視圖 豎向 是有交集的
-> 嘗試把兩個豎向的約束 放到一起
view1:
V:|-150-[view1(40)]
view2:
V:[view1]-50-[view2(view1)]
放到一起:
V:|-150-[view1(40)]-50-[view2(view1)]
*/
UIView *view1 = [self createView:@"UIView" addView:self.view];
UIView *view2 = [self createView:@"UIView" addView:self.view];
view1.backgroundColor = [UIColor redColor];
view2.backgroundColor = [UIColor grayColor];
// 2、綁定
NSDictionary *views = NSDictionaryOfVariableBindings(view1,view2);
// view1:
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-100-[view1(>=100)]-100-|" options:NSLayoutFormatAlignAllLeft metrics:nil views:views]];
// view2:
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-100-[view2(>=100)]-100-|" options:NSLayoutFormatAlignAllLeft metrics:nil views:views]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-150-[view1(40)]-50-[view2(view1)]" options:NSLayoutFormatAlignAllLeft metrics:nil views:views]];
}
第四種添加約束的方法:
- (void)demo4{
UIView *view1 = [self createView:@"UIView" addView:self.view];
UIView *view2 = [self createView:@"UIView" addView:self.view];
view1.backgroundColor = [UIColor redColor];
view2.backgroundColor = [UIColor grayColor];
// 2舶担、綁定
NSDictionary *views = NSDictionaryOfVariableBindings(view1,view2);
// 所有約束的 VFL數(shù)組
NSArray *constraints = @[@"H:|-100-[view1(>=100)]-100-|",@"H:|-100-[view2(>=100)]-100-|",@"V:|-150-[view1(40)]-50-[view2(view1)]"];
for (int i = 0; i < constraints.count; i++) {
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:constraints[i] options:NSLayoutFormatAlignAllLeft metrics:nil views:views]];
}
}
第五種添加約束的方法:
- (void)demo5{
UIView *view1 = [self createView:@"UIView" addView:self.view];
UIView *view2 = [self createView:@"UIView" addView:self.view];
view1.backgroundColor = [UIColor redColor];
view2.backgroundColor = [UIColor grayColor];
// 2坡疼、綁定
NSDictionary *views = NSDictionaryOfVariableBindings(view1,view2);
NSNumber *leftSpace = @100;
NSNumber *rightSpace = @100;
NSNumber *view1TopSpace = @150;
NSNumber *view1MinWidth = @100;
NSNumber *view1Hight = @40;
NSNumber *view2TopSpace = @50;
NSDictionary *metrics = NSDictionaryOfVariableBindings(leftSpace,rightSpace,view1MinWidth,view1Hight,view1TopSpace,view2TopSpace);;
NSArray *constraints = @[@"H:|-leftSpace-[view1(>=view1MinWidth)]-rightSpace-|",@"H:|-leftSpace-[view2(view1)]-rightSpace-|",@"V:|-view1TopSpace-[view1(view1Hight)]-view2TopSpace-[view2(view1)]"];
for (int i = 0; i < constraints.count; i++) {
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:constraints[i] options:NSLayoutFormatAlignAllLeft metrics:metrics views:views]];
}
}