IOS约束

使用代码实现Autolayout的方法

• 创建约束

+(id)constraintWithItem:(id)view1attribute:(NSLayoutAttribute)attr1relatedBy:(NSLayoutRelation)relationtoItem:(id)view2attribute:(NSLayoutAttribute)attr2multiplier:(CGFloat)multiplierconstant:(CGFloat)c;* view1 ：要约束的控件* attr1 ：约束的类型（做怎样的约束）* relation ：与参照控件之间的关系* view2 ：参照的控件* attr2 ：约束的类型（做怎样的约束）* multiplier ：乘数* c ：常量

• 添加约束

 - (void)addConstraint:(NSLayoutConstraint *)constraint;- (void)addConstraints:(NSArray *)constraints;

• 注意 一定要在拥有父控件之后再添加约束
  关闭Autoresizing功能（非常有用，很多时候布局出来得不到想要的结果都是因为系统自动布局功能没有关闭）view.translatesAutoresizingMaskIntoConstraints = NO;

---

使用代码实现Autolayout的方法2 - VFL
使用VFL创建约束数组
+ (NSArray *)constraintsWithVisualFormat:(NSString *)formatoptions:(NSLayoutFormatOptions)optsmetrics:(NSDictionary *)metricsviews:(NSDictionary *)views;

• format ：VFL语句*
• opts ：约束类型* metrics ：VFL语句中用到的具体数值*
• views ：VFL语句中用到的控件
  使用下面的宏来自动生成views和metrics参数
  NSDictionaryOfVariableBindings(...)

VFL语句 研究代码

.h
//
//  ViewController.h
//  Constraint
//
//  Created by 陶亚利 on 16/6/29.
//  Copyright © 2016年 陶亚利. All rights reserved.
//

#import 

@interface ViewController : UIViewController


@end

.m
//
//  ViewController.m
//  Constraint
//
//  Created by 陶亚利 on 16/6/29.
//  Copyright © 2016年 陶亚利. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()
{
    
    UIView *firstView;
    UIView *secondView;
    UIView *thirdView;
    
    
    UIView *view1;
    UIView *view2;
    UIView *view3;
    UIView *view4;
    UIView *view5;
}


@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
//    /**
//     第一个view
//     */
//    firstView = [[UIView alloc]init];
//    firstView.translatesAutoresizingMaskIntoConstraints = NO;
//    firstView.backgroundColor = [UIColor blueColor];
//    [self.view addSubview:firstView];
//    
//    /**
//     第二个view
//     */
//    secondView = [[UIView alloc]init];
//    secondView.translatesAutoresizingMaskIntoConstraints = NO;
//    secondView.backgroundColor = [UIColor brownColor];
//    [self.view addSubview:secondView];
//    
//    /**
//     第三个view
//     */
//    thirdView = [[UIView alloc]init];
//    thirdView.translatesAutoresizingMaskIntoConstraints = NO;
//    thirdView.backgroundColor = [UIColor yellowColor];
//    [self.view addSubview:thirdView];
//    
//    /**绑定三个view*/
//    NSDictionary *dic_bind = NSDictionaryOfVariableBindings(firstView,secondView,thirdView);
//    /**设置view之间的间距和高度*/
//    NSDictionary *dic_Constraint = @{ @"padding":@(10.f),
//                                      @"height":@(150.f)
//                                      };
//    
//    /**
//     *  第一个view添加约束
//     */
//    /**垂直方向居中对齐*/
//    NSLayoutConstraint *first_CenterY = [NSLayoutConstraint constraintWithItem:firstView attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeCenterY multiplier:1 constant:0];
//    
//    /**垂直方向添加高度约束*/
//    NSArray *first_V = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[firstView(height)]" options:0 metrics:dic_Constraint views:dic_bind];
//    [self.view addConstraints:@[first_CenterY]];
//    [self.view addConstraints:first_V];
//    
//    
//    /**
//     *  第二个view添加约束
//     */
//    /**垂直方向居中对齐*/
//    NSLayoutConstraint *second_CenterY = [NSLayoutConstraint constraintWithItem:secondView attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeCenterY multiplier:1 constant:0];
//    
//    /**垂直方向添加高度约束*/
//    NSArray *second_V = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[secondView(height)]" options:0 metrics:dic_Constraint views:dic_bind];
//    [self.view addConstraint:second_CenterY];
//    [self.view addConstraints:second_V];
//    
//    /**
//     *  第三个view添加约束
//     */
//    /**垂直方向居中对齐*/
//    NSLayoutConstraint *third_CenterY = [NSLayoutConstraint constraintWithItem:thirdView attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeCenterY multiplier:1 constant:0];
//    
//    /**垂直方向添加高度约束*/
//    NSArray *third_V = [NSLayoutConstraint constraintsWithVisualFormat:@"V:[thirdView(height)]" options:0 metrics:dic_Constraint views:dic_bind];
//    [self.view addConstraints:@[third_CenterY]];
//    [self.view addConstraints:third_V];
//    
//    /**给三个view添加水平约束等宽等间距*/
//    NSArray * allConstraint_H = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-padding-[firstView]-10-[secondView(firstView)]-padding-[thirdView(secondView)]-padding-|" options:0 metrics:dic_Constraint views:dic_bind];
//    [self.view addConstraints:allConstraint_H];
    
    
    
//    return;
    
    
    
    view1 = [[UIView alloc] init];
    view1.translatesAutoresizingMaskIntoConstraints = NO;
    view1.backgroundColor = [UIColor greenColor];
    [self.view addSubview:view1];
    
    
    view2 = [[UIView alloc] init];
    view2.translatesAutoresizingMaskIntoConstraints = NO;
    view2.backgroundColor = [UIColor redColor];
    [self.view addSubview:view2];
    
    view3 = [[UIView alloc] init];
    view3.translatesAutoresizingMaskIntoConstraints = NO;
    view3.backgroundColor = [UIColor blackColor];
    [self.view addSubview:view3];
    
    
    view4 = [[UIView alloc] init];
    view4.translatesAutoresizingMaskIntoConstraints = NO;
    view4.backgroundColor = [UIColor blueColor];
    [self.view addSubview:view4];
    
    view5 = [[UIView alloc] init];
    view5.translatesAutoresizingMaskIntoConstraints = NO;
    view5.backgroundColor = [UIColor orangeColor];
    [self.view addSubview:view5];
    
    
    
//    [self addTextConstraints];
    
    [self addTextConstraints2];
}

- (void) addTextConstraints{
    
    
    //     "H:|[page1(==view)][page2(==view)][page3(==view)][page4(==view)][page5(==view)]|", options: .AlignAllTop | .AlignAllBottom, metrics: nil, views: views)
    
    
    NSDictionary *widthAndHeight = @{@"spaceH":@(20.f),@"height":@(100.f)};
    
    //    NSArray *arrH1 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-(spaceH)-[view1(>=50)]-(spaceH)-[view2]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view1,view2)];
    
    NSArray *arrV1 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(spaceH)-[view1(height)]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view1)];
    
    //    [self.view addConstraints:arrH1];
    [self.view addConstraints:arrV1];
    
    //    NSArray *arrH2 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-(20)-[view1(>=50)]" options:0 metrics:0 views:NSDictionaryOfVariableBindings(view1)];
    //    NSArray *arrV2 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(20)-[view1(100)]" options:0 metrics:0 views:NSDictionaryOfVariableBindings(view1)];
    
    
    
    
    //    NSLayoutConstraint *layoutL = [NSLayoutConstraint constraintWithItem:blueView attribute:(NSLayoutAttributeLeft) relatedBy:(NSLayoutRelationEqual) toItem:self.view attribute:(NSLayoutAttributeLeft) multiplier:1 constant:10];
    
    
    //    NSLayoutConstraint *view2left = [NSLayoutConstraint constraintWithItem:view2 attribute:(NSLayoutAttributeLeft) relatedBy:NSLayoutRelationLessThanOrEqual toItem:view1 attribute:(NSLayoutAttributeRight) multiplier:1 constant:20];
    //
    //    NSLayoutConstraint *view2right = [NSLayoutConstraint constraintWithItem:view2 attribute:(NSLayoutAttributeRight) relatedBy:NSLayoutRelationEqual toItem:self.view attribute:(NSLayoutAttributeRight) multiplier:1 constant:-20];
    //
    //    NSArray *arrH2 = @[
    //                       view2left,
    //                       view2right
    //                       ];
    
    //    NSArray *arrH2 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:[view1]-(spaceH)-[view2(>=50)]-(spaceH)-[view3]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view1,view2,view3)];
    
    NSArray *arrV2 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(spaceH)-[view2(100)]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view2)];
    
    
    //    [self.view addConstraints:arrH2];
    [self.view addConstraints:arrV2];
    
    
    
    //    NSArray *arrH3 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:[view2]-(spaceH)-[view3(>=50)]-(spaceH)-[view4]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view2,view3,view4)];
    
    NSArray *arrV3 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(spaceH)-[view3(100)]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view3)];
    
    
    //    [self.view addConstraints:arrH3];
    [self.view addConstraints:arrV3];
    
    
    
    
    
    //    NSArray *arrH4 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:[view3]-(spaceH)-[view4(>=50)]-(spaceH)-[view5]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view3,view4,view5)];
    
    NSArray *arrV4 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(spaceH)-[view4(100)]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view4)];
    
    
    //    [self.view addConstraints:arrH4];
    [self.view addConstraints:arrV4];
    
    
    
    
    
    //    NSArray *arrH5 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:[view4]-(spaceH)-[view5(>=50)]-(spaceH)-|" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view4,view5)];
    
    NSArray *arrV5 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(spaceH)-[view5(100)]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view5)];
    //    [self.view addConstraints:arrH5];
    [self.view addConstraints:arrV5];
    
    NSArray *arrWedth = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-(spaceH)-[view1]-(spaceH)-[view2(view1)]-(spaceH)-[view3(view1)]-(spaceH)-[view4(view1)]-(spaceH)-[view5(view1)]-(spaceH)-|" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view1,view2,view3,view4,view5)];
    
    [self.view addConstraints:arrWedth];

}



- (void) addTextConstraints2{
    
    NSDictionary *widthAndHeight = @{@"spaceH":@(20.f),@"height":@(100.f),@"Fheight":@(-100.f)};
    
    //    NSArray *arrH1 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-(spaceH)-[view1(>=50)]-(spaceH)-[view2]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view1,view2)];
    
    NSArray *arrV1 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(spaceH)-[view1(height)]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view1)];
    
    //    [self.view addConstraints:arrH1];
    [self.view addConstraints:arrV1];
    
    
//    //    NSArray *arrH2 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:[view1]-(spaceH)-[view2(>=50)]-(spaceH)-[view3]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view1,view2,view3)];
//    
//    NSArray *arrV2 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(spaceH)-[view2(100)]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view2)];
//    
//    
//    //    [self.view addConstraints:arrH2];
//    [self.view addConstraints:arrV2];
//    
//    
//    
//    //    NSArray *arrH3 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:[view2]-(spaceH)-[view3(>=50)]-(spaceH)-[view4]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view2,view3,view4)];
//    
//    NSArray *arrV3 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(spaceH)-[view3(100)]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view3)];
//    
//    
//    //    [self.view addConstraints:arrH3];
//    [self.view addConstraints:arrV3];
//    
//    
//    
//    
//    
//    //    NSArray *arrH4 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:[view3]-(spaceH)-[view4(>=50)]-(spaceH)-[view5]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view3,view4,view5)];
//    
//    NSArray *arrV4 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(spaceH)-[view4(100)]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view4)];
//    
//    
//    //    [self.view addConstraints:arrH4];
//    [self.view addConstraints:arrV4];
//    
//    
//    
//    
//    
//    //    NSArray *arrH5 = [NSLayoutConstraint constraintsWithVisualFormat:@"H:[view4]-(spaceH)-[view5(>=50)]-(spaceH)-|" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view4,view5)];
//    
//    NSArray *arrV5 = [NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(spaceH)-[view5(100)]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view5)];
//    //    [self.view addConstraints:arrH5];
//    [self.view addConstraints:arrV5];
    
    
    NSArray *arrWedth = [NSLayoutConstraint constraintsWithVisualFormat:@"H:|-(spaceH)-[view1]-(spaceH)-[view2(view1)]-(spaceH)-[view3(view1)]-(spaceH)-[view4(view1)]-(spaceH)-[view5(view1)]-(spaceH)-|" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view1,view2,view3,view4,view5)];
    
    [self.view addConstraints:arrWedth];
    
    
//    NSArray *arrV =     [NSLayoutConstraint constraintsWithVisualFormat:@"V:[view1]-(height)-[view2(view1)]-(height)-[view3(view1)]-(height)-[view4(view1)]-(height)-[view5(view1)]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view1,view2,view3,view4,view5)];

    NSArray *arrV =     [NSLayoutConstraint constraintsWithVisualFormat:@"V:[view1]-(Fheight)-[view2(view1)]-(Fheight)-[view3(view1)]-(Fheight)-[view4(view1)]-(Fheight)-[view5(view1)]" options:0 metrics:widthAndHeight views:NSDictionaryOfVariableBindings(view1,view2,view3,view4,view5)];
    
    [self.view addConstraints:arrV];
    
}



- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end

---

使用代码实现Autolayout的方法3 - Masonry（重点，这套框架还是响应式函数编程的典范，研究响应式函数编程必学）

• 使用步骤
  1.添加Masonry文件夹的所有源代码到项目中
  2.添加2个宏、导入主头文件
  // 只要添加了这个宏，就不用带mas_前缀

define MAS_SHORTHAND

// 只要添加了这个宏，equalTo就等价于mas_equalTo

define MAS_SHORTHAND_GLOBALS

// 这个头文件一定要放在上面两个宏的后面

import "Masonry.h"

• 添加约束的方法
  // 这个方法只会添加新的约束
  [view makeConstraints:^(MASConstraintMaker *make) { }];
  // 这个方法会将以前的所有约束删掉，添加新的约束
  [view remakeConstraints:^(MASConstraintMaker *make) { }];
  // 这个方法将会覆盖以前的某些特定的约束
  [view updateConstraints:^(MASConstraintMaker *make) { }];
• 约束的类型
  1.尺寸：width\height\size
  2.边界：left\leading\right\trailing\top\bottom
  3.中心点：center\centerX\centerY
  4.边界：edges