iOS AutoLayout自动布局中级开发教程(9)-VisualFormat可视化格式字符串构成

VisualFormat的精髓- 可视化的字符串如何构成?

当我们在使用

1. NSArray *hCons=[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[_button1(100)]-50@750-[button2(==_button1)]|" options:NSLayoutFormatAlignAllTop metrics:0 views:NSDictionaryOfVariableBindings(_button1,button2) ];  
2.     
3.   [self.view addConstraints:hCons];  

1. NSArray *vCons=[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(100)-[_button1(100)]" options:0 metrics:0 views:@{@"_button1":_button1,@"button2":button2}];  
2.     [self.view addConstraints:vCons];  

方法创建和使用约束的时候,最关键的语句就是:

1. @"H:|-[_button1(100)]-50@750-[button2(==_button1)]|"  

这种的字符串了,今天给大家详细介绍一下,这个部件的构成!

1. #pragma mark - 常用visualFormat表达式构成  
2.   
3.     符号:H , V ;  H代表水平方向 ,V代表垂直方向(水平和垂直的英文首字母)  

1. 符号:-  ;代表两个视图之间的间隔,默认的子视图之间的标准间隔是8;子视图与父视图之间默认是20  

1. 符号:[];中括号的里面是视图的名称,如果是属性的话,应该加上 _下划线,例如  [_view]  

1. 符号:| ;竖线代表父视图(或者父视图的边界)  

1. 符号:();数值的表达式,可以是不等式,等式,或者一个数字,包括负数,可以设置宽度(使用@"H:[view2(100)]")或者高度(使用@"V:[_view2(==100)]")  

1. 符号:@;代表 在  A@B中,A的优先级是B数值;当 A这个约束的值和和同方向上的约束产生冲突时,会按照优先级来调整尺寸  

1. 水平方向  @"H:|-[_view1(99)]-20@1000-[_view2(==_view1)]-15-|"  
2. 解释:水平方向上的约束,属性 view1左边界距离父视图为20(注意: - 符号,默认与父视图是20的距离);_view1与_view2之间的间隔是20,且它的优先级是1000;[_view1(99)]代表 _view1的宽度是99;_view2的宽度等于_view1的宽度;_view2距离父视图15  
3. 注意,此处的_view是 由于 view是一个属性  
4. 垂直方向  @"V:|-[view1(100)]-(-20)-[view2]|"垂直方向上,view1左边距离父视图  
5.   
6. 技巧:可以使用stringWithFormat创建,参数可以变化的约束 如  @"H:|[_button1(%d)]"  ,100  

1. #pragma mark - 常用visualFormat常用示例  

1. 设置宽度或者高度或者等宽

@"H:[button(100)]",//button的宽度是或者@"H:[button(==100)]"

@"H:[button(==button1)]" 或者  @"H:[button(button1)]"  //button的宽度==button1的宽度

@"H:[button(>=20,<=60)]"// button的宽度大于等于20,小于等于60

高度把  H换成 V即可

2.设置边界距离:

@"H:|[button]-|" //button右边距离父视图为标准(默认)间隔为20,左边距离父视图为0;

@"H:|-33-[button]-0-|" //button左边距离父视图33,右边距离父视图为0

垂直方向,类似

3.设置视图之间的距离

@"V:|[button]-9-[button2]"  ,//button距离上边界是0,距离button2是9 ,此 约束中没有关于button2右边界的描述

@"H:[button1][button2]"  //水平方向,button1/2之间的距离是0,其他等效的写法有

@"H:[button]-0-[button2]"

@"H:[button1]-(0)-[button2]'

@"H:[button1]-(==0)-[button2]"

@"H:[button1]-(>=0,<=0)-[button2]" //添加多个条件时用逗号隔开

@"H:[button]-(==0@750)-[button2]"//设置间距的优先级

@"H:[button]-(>=0,<=80)-[button2]" 

4.设置约束的优先级,在冲突发生时有妥善的解决办法

@"H:|-200@750-[button(300)]-20-|" //button距离父视图的左边界为200优先级为750, 而约束默认的优先级是1000>750所以在 此整个水平方向的约束中有冲突的话,此 200会被忽略,有限满足其他优先级高的!

5.添加可以变化的约束值

@"H:[button1]-space-[button2]"

1. metrics字典对应的是  :  NSDictionary *metrics=@{@"space":@100};  

1. 设置button1和button2的间距是  字典 metrics中的   space =100   

更多原文:http://blog.csdn.net/yangbingbinga/article/details/43673233