iOS_autoLayout(VFL)

来源:互联网 发布:淘宝买ipad知乎 编辑:程序博客网 时间:2024/04/29 09:52

SLayoutConstraint的第二个类方法

+ (NSArray *)constraintsWithVisualFormat:(NSString *)format                                  options:(NSLayoutFormatOptions)opts                                  metrics:(NSDictionary *)metrics                                    views:(NSDictionary *)views;
  • 其中format就是VFL字符串,比如@"H:|-10-[view]-20-|",一会详细说明。
  • opts是枚举参数,默认是0
    typedef NS_OPTIONS(NSUInteger, NSLayoutFormatOptions) {    NSLayoutFormatAlignAllLeft = (1 << NSLayoutAttributeLeft),    NSLayoutFormatAlignAllRight = (1 << NSLayoutAttributeRight),    NSLayoutFormatAlignAllTop = (1 << NSLayoutAttributeTop),    NSLayoutFormatAlignAllBottom = (1 << NSLayoutAttributeBottom),    NSLayoutFormatAlignAllLeading = (1 << NSLayoutAttributeLeading),    NSLayoutFormatAlignAllTrailing = (1 << NSLayoutAttributeTrailing),    NSLayoutFormatAlignAllCenterX = (1 << NSLayoutAttributeCenterX),    NSLayoutFormatAlignAllCenterY = (1 << NSLayoutAttributeCenterY),    NSLayoutFormatAlignAllBaseline = (1 << NSLayoutAttributeBaseline),    NSLayoutFormatAlignAllLastBaseline = NSLayoutFormatAlignAllBaseline,    NSLayoutFormatAlignAllFirstBaseline NS_ENUM_AVAILABLE_IOS(8_0) = (1 << NSLayoutAttributeFirstBaseline),    NSLayoutFormatAlignmentMask = 0xFFFF,    /* choose only one of these three     */    NSLayoutFormatDirectionLeadingToTrailing = 0 << 16, // default    NSLayoutFormatDirectionLeftToRight = 1 << 16,    NSLayoutFormatDirectionRightToLeft = 2 << 16,      NSLayoutFormatDirectionMask = 0x3 << 16,  };
  • metrics是自定义的一个字典,这个字典里面的key可以写在format字串中。编译器解析时,自动替换为metrics字典中的value。比如:
    NSDictionary * metrics = @{@"left":@5,@"right":@5,@"height":@150.0};   NSString * format = @"|-left-[view]-right-|";
    这个一看就明白的,不用这个,设置为nil
  • views是设置约束所有view的字典。比如:
    NSDictionary *viewsDictionary = NSDictionaryOfVariableBindings(view);
    这个宏的作用是把view映射成字典[NSDictionary dictionaryWithObjectsAndKeys:view, @"view", nil];

VFL

苹果开发团队可能觉得添加单个constraint的API比较长,于是就有了VFL(Visual format language)
上面提到的@"H:|-10-[view]-20-|",意思就是view距离superview的左边10点,右边20点,这样是不是就可以确定了这个view的宽度了?
其中H:表示横向,|表示父视图边缘,-10-表示10点距离,[view]表示子视图。
下面详细说明,参考:AutoLayout详解+手把手实战
V:表示纵向
H:表示横向
|表示父视图边缘
-表示距离
>=表示视图间距、宽度或高度必须大于或等于某个值
<=表示视图间距、宽度或高度必须小宇或等于某个值
==表示视图间距、宽度或高度必须等于某个值
@表示>=<===限制,最大为1000

示例:

  1. |-[view]-|视图处在父视图的左右边缘内
  2. |-[view]视图处在父视图的左边缘
  3. |[view]视图和父视图左边对齐
  4. -[view]-设置视图的宽度高度
  5. |-30.0-[view]-30.0-|表示离父视图 左右间距30
  6. [view(200.0)]表示视图宽度为200.0
  7. |-[view(view1)]-[view1]-|表示视图宽度一样,并且在父视图左右边缘内
  8. V:|-[view(50.0)]视图高度为50
  9. V:|-(==padding)-[imageView]->=0-[button]-(==padding)-|表示离父视图的距离
    Padding,这两个视图间距必须大于或等于0并且距离底部父视图为padding
  10. [wideView(>=60@700)]视图的宽度为至少为60不能超过 700
  11. 如果没有声明方向默认为水平H:(原文写的V:

代码

UIView *view = [[UIView alloc] init];view.backgroundColor = [UIColor brownColor];view.translatesAutoresizingMaskIntoConstraints = NO;[self.view addSubview:view];//通过宏映射成[NSDictionary dictionaryWithObjectsAndKeys:v1, @"v1", v2, @"v2", nil];NSDictionary *viewsDictionary = NSDictionaryOfVariableBindings(view);//约束1 横向[self.view addConstraints: [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-10-[view]-20-|"                                         options:0                                         metrics:nil                                           views:viewsDictionary]];//约束2 纵向[self.view addConstraints: [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-100-[view]-200-|"                                         options:0                                         metrics:nil                                           views:viewsDictionary]];


文/guaker(简书作者)
原文链接:http://www.jianshu.com/p/385070898e77
著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”。
0 0