Auto Layout可视化格式

来源:互联网 发布:怎样避免手机淘宝同款 编辑:程序博客网 时间:2024/06/08 21:27

要始终牢记一点:所有的约束都是NSLayoutConstraint类的成员,无论你是以何种形式创建他们的。


下列代码片段演示了使用可视化格式(VFL)创建约束。


[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[view1]-8-[view2]" options:NSLayoutFormatAlignAllLeading metrics:nil views:NSDictionaryOfVariableBindings(view1, view2)]];

或:

NSString *hvfl = @"H:|-20-[redView]-20-|";

NSDictionary *views = @{@"redView" : redView};//NSDictionary *views = NSDictionaryOfVariableBindings(redView);

NSDictionary *metrics = @{@"space" : @20};

NSArray *hlcs = [NSLayoutConstraint constraintsWithVisualFormat:hvfl options:kNilOptions metrics:metrics views:views];

[self.view addConstraints:hlcs];

Format:VFL语句。

options:对齐方式。通过给选项参数赋0值来忽略选项。

metrics:VFL语句中用到的变量值。

views:VFL语句中用到的控件。


注意:

1.前缀指定(H:或V:),当忽略坐标时,约束默认为水平布局;

2.每个视图的变量名出现在方括号中(例如[view1]);

3.字符串中视图名称的顺序与布局中视图的请求顺序匹配。这个顺序一般是从顶到底或者从左到右;



变量绑定:

可以通过NSDictionaryOfVariableBindings( )来创建。他根据传入的变量来建立一个字典,使用变量的名称作为键,使用变量指向的对象作为值。

例如这个调用:

NSDictionaryOfVariableBindings(leftLabel, rightLabel);

就会创建下列这个字典:

@{@"leftLabel" : leftLabel, @"rightLabel" : rightLabel};



格式字符串结构:

用于创建约束的格式字符串要遵循一种如下指定的语法:

(<orientation>:)?(<superview><connection>)? <view>(<connection><view>) * (<connection><superview>)?


格式字符串部件:

可视化格式字符串:


1.水平或垂直放置:

H: 或 V:

例如:V:[view1]-15-[view2]   将view2放到其顶部距离view1底部15点的位置


2.视图:

[item]

例如: [view1]   视图绑定字典将方括号所包围的名称同一个视图实例相匹配


3.父视图:

|

例如:H|[view1]|  使view1的宽度尺寸同父视图的一致


4.关系:

==

<=

>=

例如: H:[view1]-(>=20)-[view2]

使view2的前缘距离view1后至少20点


5.度量:

metric

例如::[view1(<=someWidth)] V:[view1]-mySpacing-[view2] 度量是键。someWidth和mySpacing必须在传递的度量字典中映射为NSNumber值


6.齐平对齐

[item][item]

例如:H:[view1][view2] 使view1的后缀同view2的前缘齐平


7.灵活间隔

[item]-(>=0)-[item]

例如:[view1]-(>=0)-[view2] 根据需要,视图可以伸展分离开,“至少分离0点”


8.固定间隔

[item]-gap-[item]

例如:V:[item]-20-[item] 使view1的底部距离view2的顶部20点


9.固定距离(视图到视图)

[item]--[item]

例如:[item]-[item]在两个视图间留下一个小的固定空间(8点)


10.固定高度或宽度

[item(==size)]

[item(size)]

例如:[view1(50)] 使view1沿着某个坐标轴的范围刚好50点


11.最大和最小宽度/高度

[item(>=size)]

[item(<=size)]

例如:[view1(>=50)][view1(>=50)] 限制view1在某个坐标轴上的最大或者最小尺寸


12.同另一个视图匹配高度/宽度

[item(==item)]

[item(<=item)]

[item(>=item)]

例如:[view1(==view2)]使view1沿着某个坐标的尺寸和view2的一致


13.和父视图齐平对齐

|[item]

[item]|

例如:V:|[view1] 使view1的顶部和父视图顶部齐平


14.相对于父视图的inset

|-[item]

[item]-|

例如:|-[view1]在某个坐标轴上,在父视图和view1之间放置一个固定的间隔(20点)


15.相对于父视图的自定义inset

|-gap-[item]

[item]-gap-|

例如:H:|-15-[view1] 将视图嵌入父视图,并使其距离父视图前缘15点


16.优先级(从0到1000)

@value

例如:[view1(<=50@20)] 设置view1在某个坐标轴上的最大尺寸为50点,优先级为一个很低的值(20)


0 0
原创粉丝点击