iOS Auto Layout

Auto Layout是什么

Auto Layout是一个基于constraint(约束)的布局系统，它根据UI元素之间约束关系来调整UI元素的位置和大小。

Auto Layout解决什么问题

• 更容易适配不同分辨率设备的屏幕(iPhone 6 Plus, iPhone 6, iPhone 5s/5, iPhone 4s/4)

• 当设备旋转时不需要做额外处理

• 使用constraint来描述布局逻辑，更利于理解和清晰

如何使用Auto Layout

Auto Layout中约束的类对应是NSLayoutConstraint, 而创建NSLayoutConstraint对象主要有两种方式，第一种是

1 2 3 4 5 6 7

+ (id)constraintWithItem:(id)view1                attribute:(NSLayoutAttribute)attribute1                relatedBy:(NSLayoutRelation)relation                   toItem:(id)view2                attribute:(NSLayoutAttribute)attribute2               multiplier:(CGFloat)multiplier                 constant:(CGFloat)constant;

上面方法主要意思是，某个view1的attribute1等于(小于或等于/大于或等于)某个view2的attribute2的multiplier倍加上constant。而attribute主要由表示位置(上/下/左/右)和大小(宽/高)的以下几个值：

1 2 3 4 5 6 7 8 9 10 11 12 13 14

typedef enum: NSInteger {    NSLayoutAttributeLeft = 1,    NSLayoutAttributeRight,    NSLayoutAttributeTop,    NSLayoutAttributeBottom,    NSLayoutAttributeLeading,    NSLayoutAttributeTrailing,    NSLayoutAttributeWidth,    NSLayoutAttributeHeight,    NSLayoutAttributeCenterX,    NSLayoutAttributeCenterY,    NSLayoutAttributeBaseline,    NSLayoutAttributeNotAnAttribute = 0 } NSLayoutAttribute;

简化一下，使用公式可以表达为：

1	view1.attribute1 = view2.attribute2 * multiplier + constant

第二种方式是：

1 2 3 4

+ (NSArray *)constraintsWithVisualFormat:(NSString *)format                                   options:(NSLayoutFormatOptions)opts                                   metrics:(NSDictionary *)metrics                                     views:(NSDictionary *)views;

这种方式主要是采用Visual Format Language(可视化格式语言)来描述约束布局，虽然语法比较简洁，但是可读性比较差和容易出错。

Auto Layout存在问题

虽然Auto Layout在布局view方面是非常强大和灵活，但是创建constraint的语法过于繁杂，引用Masonry一个例子：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37

UIView *superview = self; UIView *view1 = [[UIView alloc] init]; view1.translatesAutoresizingMaskIntoConstraints = NO; view1.backgroundColor = [UIColor greenColor]; [superview addSubview:view1]; UIEdgeInsets padding = UIEdgeInsetsMake(10, 10, 10, 10); [superview addConstraints:@[     //view1 constraints     [NSLayoutConstraint constraintWithItem:view1                                  attribute:NSLayoutAttributeTop                                  relatedBy:NSLayoutRelationEqual                                     toItem:superview                                  attribute:NSLayoutAttributeTop                                 multiplier:1.0                                   constant:padding.top],     [NSLayoutConstraint constraintWithItem:view1                                  attribute:NSLayoutAttributeLeft                                  relatedBy:NSLayoutRelationEqual                                     toItem:superview                                  attribute:NSLayoutAttributeLeft                                 multiplier:1.0                                   constant:padding.left],     [NSLayoutConstraint constraintWithItem:view1                                  attribute:NSLayoutAttributeBottom                                  relatedBy:NSLayoutRelationEqual                                     toItem:superview                                  attribute:NSLayoutAttributeBottom                                 multiplier:1.0                                   constant:-padding.bottom],     [NSLayoutConstraint constraintWithItem:view1                                  attribute:NSLayoutAttributeRight                                  relatedBy:NSLayoutRelationEqual                                     toItem:superview                                  attribute:NSLayoutAttributeRight                                 multiplier:1                                   constant:-padding.right],  ]];

如此简单的一个例子都要编写这么多行代码，想象一下如果创建多个view的constraint时会多么痛苦啊。另一个方式是采用Visual Format Language (VFL)，虽然语法比较简洁，但是可读性比较差和容易出错。