iOS SDAutoLayout布局体验（1）

之前使用过Masonry后对布局有了新的体验，设置控件的位置不单单是x,y，width和height的设置。在Masonry中比如UILabel,UIButton等UI控件采用Masonry是可以不用设置width和height的，Masonry中已实现自适应。使用Masonary在有些布局中着实带来了布局的新视觉。

一直听说SDAutoLayout，不过一只没有机会真正研究和使用，借此没有任务的机会来体验一把。

SDAutoLayout的简介和资料

项目git地址：
SDAutoLayout（一行代码搞定自动布局！）
github地址 https://github.com/gsdios/SDAutoLayout

SDAutoLayout的作者还提供了一些视频资料：
基础版视频教程：http://www.letv.com/ptv/vplay/24038772.html
进阶版视频教程：http://www.letv.com/ptv/vplay/24381390.html
原理简介视频教程：http://www.iqiyi.com/w_19rt0tec4p.html

下面开始SDAutoLayout的体验之旅：

开始前准备

下载SDAutoLayout，导入头文件#import "SDAutoLayout.h"

1、在控制器中添加一个view0

UIView *view0 = [UIView new];
view0.backgroundColor = [UIColor redColor];
[self.view addSubview:view0];

//开始布局
view0.sd_layout
    .leftSpaceToView(self.view,20) 
    .topSpaceToView(self.view,80)
    .heightIs(130)
    .widthRatioToView(self.view,_widthRatio);

leftSpaceToView(view,number)
/* 左边到其参照view之间的间距，参数为“(View 或者 view数组, CGFloat)” /
** number这里相当于到其左边view的间隔,

heightIs
/* 高度值，参数为“(CGFloat)” /
**以Is结尾的属性表示要传一个具体值设置宽或高，比如widthIs等

widthRatioToView(view,number)
/* 宽度是参照view宽度的多少倍，参数为“(View, CGFloat)” /
**以RatioToView结尾表示宽或高等是view的number倍

效果图：

2、view0中添加一个view1

UIView *view1 = [UIView new];
view5.backgroundColor = [UIColor yellowColor];
[view0 addSubview:view1];
view1.sd_layout
    .centerYEqualToView(view0)
    .rightSpaceToView(view0, 10)
    .widthRatioToView(view0, 0.5)
    .heightIs(20);

centerYEqualToView(view)
/* centerY与参照view相同，参数为“(View)” /
** 表示为设置当前视图的centerY与view的centerY相同

效果图：

3、动态改变view0的布局

//初始化视图比例
_widthRatio = 0.4;
//初始化计时器    
_timer = [NSTimer scheduledTimerWithTimeInterval:0.8 target:self selector:@selector(animation) userInfo:nil repeats:YES];

- (void)animation{
    if (_widthRatio >= 0.4) {
        _widthRatio = 0.1;
    } else {
        _widthRatio = 0.4;
    }
    // 开启动画
    [UIView animateWithDuration:0.8 animations:^{
        self.view0.sd_layout
        .widthRatioToView(self.view, _widthRatio);
        [self.view0 updateLayout]; // 调用此方法开启view0动画效果
        [self.view5 updateLayout]; // 调用此方法开启view5动画效果
    }];
}

- (void)viewDidDisappear:(BOOL)animated{
    [_timer invalidate];
    _timer = nil;
}

updateLayout
/* 更新布局（主动刷新布局，如果你需要设置完布局代码就获得view的frame请调用此方法） /
就是改变布局后，调用该方法会重现进行frame的计算

效果图：

4、在view1中加入两个子view(testLabel和testView)
，然后设置view1高度根据子view内容自适应

    UIView *view1 = [UIView new];
    view1.backgroundColor = [UIColor grayColor];
    self.view1 = view1;
    [self.view addSubview:view1];

    UILabel *subview1 = [UILabel new]; // 初始化子view1
    subview1.text = @"这个紫色的label会根据这些文字内容高度自适应；而这个灰色的父view会根据紫色的label和橙色的view具体情况实现高度自适应。\nGot it! OH YAEH!";
    subview1.backgroundColor = [UIColor purpleColor];

    UIView *subview2 = [UIView new];    // 初始化子view2
    subview2.backgroundColor = [UIColor orangeColor];

    // 将子view添加进父view
    [self.view1 sd_addSubviews:@[subview1, subview2]];

    /*测试1*/
    subview1.sd_layout
    .leftSpaceToView(self.view1, 10)
    .rightSpaceToView(self.view1, 10)
    .topSpaceToView(self.view1, 10)
    .autoHeightRatio(0); // 设置文本内容自适应，如果这里的参数为大于0的数值则会以此数值作为view的高宽比设置view的高度

    subview2.sd_layout
    .topSpaceToView(subview1, 10)
    .widthRatioToView(subview1, 1)
    .heightIs(30)
    .leftEqualToView(subview1);

//     /*测试2*/
//    subview2.sd_layout
//    .leftSpaceToView(self.view1, 10)
//    .rightSpaceToView(self.view1, 10)
//    .topSpaceToView(self.view1, 10)
//    .heightIs(30);
//    
//    subview1.sd_layout
//    .topSpaceToView(subview2, 10)
//    .widthRatioToView(subview2, 1)
//    .leftEqualToView(subview2)
//    .autoHeightRatio(0);


    // view1使用高度根据子view内容自适应，所以不需要设置高度，而是设置“[self.view1 setupAutoHeightWithBottomView:testView bottomMargin:10];”实现高度根据内容自适应
    self.view1.sd_layout
    .leftSpaceToView(self.view, 10)
    .topSpaceToView(self.view, 80)
    .rightSpaceToView(self.view, 10);

    //设置根据底部视图计算view1的高度
    [self.view1 setupAutoHeightWithBottomView:subview1 bottomMargin:10];

本人尝试交换subview1和subview2的位置也同样适用，如测试2所示
效果图：

整理一个博客在谷歌上总是崩溃，重复整理了好几遍，我也是醉了。