autoLayout

 frame  原点  自身的尺寸 来确定 自身位置
 
 autoLayout  根据参照视图的位置  来定义自己的位置
 
 
 autoLayout相对布局  约束视图和视图之间的关系 来分配 屏幕上的位置
 
 //     使用VFL(Visual Format Language  视觉格式语言)通过添加字符串 来约束视图和视图之间的关系
 
 使用autoLayout 必须把translatesAutoresizingMaskIntoConstraints禁用才可以使用
 相对布局是找一个参照物 拿参照物当做基础，设置他和参照物的相对距离 来设置自己的位置
 
 VFL 需有 横向(H:) 竖向(V:) 两个方向的约束
 -50- 两个视图之间的距离
 H:横向
 | 表示他的父视图
 -50- 表示后面视图 与前面视图的距离 （后面视图是textField，前面视图是他的父视图）
 [textField(>=200)] 要约束视图的宽  (>=200)允许最小的宽度是200  如果是竖向  就是允许最小的高度
 
 @"H:|-50-[textField(>=200)]-50-|"
 
 距离坐边原点距离50   右边边界距离50    允许视图的最小宽度是200
 
 
 V: 竖向
 
 使用autolayout适配的时候  以最小尺寸设备 为基准
 
 //    视图 使用属性的时候   绑定key  需要绑定它真实的名字  _titleLable
 //    self.titleLable = _titleLable
 
 */

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor grayColor];
    [self demo5];
    

}

//一个视图
- (void)demo1{
    UIView *view = [[UIView alloc]init];
//   如果使用autolayout。 translatesAutoresizingMaskIntoConstraints这个属性必须禁用
    view.translatesAutoresizingMaskIntoConstraints = NO;
    view.backgroundColor = [UIColor redColor];
    [self.view addSubview:view];
    
//    VFL 横向 竖向布局
//    @"H:"设置横向布局
//    @"H:|-20-"设置横向布局 距离父视图的左侧边距
//    @"H:|-20-[view(>=200)]"设置横向布局 距离父视图的左侧边距 设置View横向的尺寸 不低于200
//    @"H:|-20-[view(>=200)]-20-|"设置横向布局 距离父视图的左侧边距 设置View横向的尺寸 不低于200 设置右侧与父视图之间的间距
    
//    竖向布局
//    @"V:|-40-[view(>=200)]-20-|"
    
//    使用VFL 需要把视图对象（视图）与 他的名字（字符串）绑定起来
    NSDictionary *views = NSDictionaryOfVariableBindings(view);
//    给self.view 和 view 添加约束
//    addConstraints 添加约束
//    NSLayoutConstraint 添加具体约束的类
//    + (NSArray *)constraintsWithVisualFormat:(NSString *)format options:(NSLayoutFormatOptions)opts metrics:(NSDictionary *)metrics views:(NSDictionary *)views
//    format :VFL   opts:同意按照某个方向去布局    metrics：绑定参数   views绑定视图的参数
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat: @"H:|-20-[view(>=200)]-20-|" options:0 metrics:nil views:views]];
    
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:  @"V:|-40-[view(>=200)]-20-|" options:0 metrics:nil views:views]];
    
}
//两个视图
- (void)demo2{
    UIView *view = [[UIView alloc]init];
    //   如果使用autolayout。 translatesAutoresizingMaskIntoConstraints这个属性必须禁用
    view.translatesAutoresizingMaskIntoConstraints = NO;
    view.backgroundColor = [UIColor redColor];
    [self.view addSubview:view];
    
    UIView *view1 = [[UIView alloc]init];
    //   如果使用autolayout。 translatesAutoresizingMaskIntoConstraints这个属性必须禁用
    view1.translatesAutoresizingMaskIntoConstraints = NO;
    view1.backgroundColor = [UIColor yellowColor];
    [self.view addSubview:view1];
    
    NSDictionary *views = NSDictionaryOfVariableBindings(view,view1);
//    添加红色VIew 横向的约束
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-20-[view(>=200)]-20-|" options:0 metrics:nil views:views]];
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-40-[view(50)]-10-[view1]" options:0 metrics:nil views:views]];

    
//    添加黄色视图约束
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-20-[view1(>=200)]-20-|" options:0 metrics:nil views:views]];
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[view]-10-[view1(50)]" options:0 metrics:nil views:views]];
}
//优化demo2
- (void)demo3{
    UIView *view = [[UIView alloc]init];
    //   如果使用autolayout。 translatesAutoresizingMaskIntoConstraints这个属性必须禁用
    view.translatesAutoresizingMaskIntoConstraints = NO;
    view.backgroundColor = [UIColor redColor];
    [self.view addSubview:view];
    
    UIView *view1 = [[UIView alloc]init];
    //   如果使用autolayout。 translatesAutoresizingMaskIntoConstraints这个属性必须禁用
    view1.translatesAutoresizingMaskIntoConstraints = NO;
    view1.backgroundColor = [UIColor yellowColor];
    [self.view addSubview:view1];
    
//    UIView *view3 = [[UIView alloc]init];
//    //   如果使用autolayout。 translatesAutoresizingMaskIntoConstraints这个属性必须禁用
//    view3.translatesAutoresizingMaskIntoConstraints = NO;
//    view3.backgroundColor = [UIColor yellowColor];
//    [self.view addSubview:view3];

    NSDictionary *views = NSDictionaryOfVariableBindings(view,view1);
    //    添加红色VIew 横向的约束
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-20-[view(>=200)]-20-|" options:0 metrics:nil views:views]];
//    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-40-[view(50)]-10-[view1(50)]" options:0 metrics:nil views:views]];
    
    
    //    添加黄色视图约束
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-20-[view1(>=200)]-20-|" options:0 metrics:nil views:views]];
    
//    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-20-[view3(>=200)]-20-|" options:0 metrics:nil views:views]];

//    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:[view]-10-[view1(50)]" options:0 metrics:nil views:views]];
//    view和view1的高度都是50 让View 的高度就是View的
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-40-[view(50)]-10-[view1(view)]" options:0 metrics:nil views:views]];
    
}

- (void)demo4{
    NSArray *colorList = @[[UIColor redColor],[UIColor yellowColor],[UIColor purpleColor]];
    for (int i = 0; i < 3; i ++) {
        UIView *view = [[UIView alloc]init];
        view.backgroundColor = colorList[i];
        view.tag = 100+i;
        view.translatesAutoresizingMaskIntoConstraints = NO;
        [self.view addSubview:view];
    }
    
    UIView *redView = (UIView *)[self.view viewWithTag:100];
    UIView *yellowView = (UIView *)[self.view viewWithTag:101];
    UIView *purpleView = (UIView *)[self.view viewWithTag:102];
    
    NSDictionary *views = NSDictionaryOfVariableBindings(redView,yellowView,purpleView);
//    两个视图横向的约束
    NSArray *constraints = @[@"H:|-20-[redView(>=200)]-20-|",@"H:|-20-[yellowView(>=200)]-20-|",@"H:|-20-[purpleView(>=200)]-20-|"];
    
    for (NSString *VFL in constraints) {
        [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:VFL options:0 metrics:nil views:views]];
    }
    
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-40-[redView(50)]-10-[yellowView(redView)]-10-[purpleView(redView)]" options:0 metrics:nil views:views]];
}

- (void)demo5{
    NSArray *colorList = @[[UIColor redColor],[UIColor yellowColor],[UIColor purpleColor]];
    for (int i = 0; i < 3; i ++) {
        UIView *view = [[UIView alloc]init];
        view.backgroundColor = colorList[i];
        view.tag = 100+i;
/*注意*/view.translatesAutoresizingMaskIntoConstraints = NO;
        [self.view addSubview:view];
    }
    
    UIView *redView = (UIView *)[self.view viewWithTag:100];
    UIView *yellowView = (UIView *)[self.view viewWithTag:101];
    UIView *purpleView = (UIView *)[self.view viewWithTag:102];
    
    NSDictionary *views = NSDictionaryOfVariableBindings(redView,yellowView,purpleView);
    //    两个视图横向的约束
//    红色视图与黄色视图之间的关系，红色和purple视图之间的关系
    NSArray *HList = @[@"H:|-20-[redView(>=200)]-20-|",@"H:|-20-[yellowView(>=100)]-10-[purpleView(yellowView)]-20-|"];
    
    NSArray *VList = @[@"V:|-40-[redView(50)]-10-[yellowView(redView)]",@"V:|-40-[redView(50)]-10-[purpleView(redView)]"];
    
    for (int i = 0; i < HList.count; i ++){
        
        [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:HList[i] options:0 metrics:nil views:views]];
        
        [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:VList[i] options:0 metrics:nil views:views]];
    }
    

   }