iOS用代码让控件自适应布局

很长一段时间都是在xib上直接给控件添加约束来实现自适应布局的。

WeChat_1458303780.jpeg

如上图所示，选中要添加约束的控件，然后点击右下角的这个图标

2.pic.jpg

再根据实际情况设置好后，点击最下面的这个，就成功添加约束了。

WeChat_1458303932.jpeg

一直很好奇如果用代码的方式添加约束是怎么样的，于是今天就尝试使用原生的vfl（原生代码添加约束）和SDAutoLayout（一个很著名的第三方库）来添加约束

一、vfl

/**
 *使用原生AutoLayout代码
 */
UILabel *labelBlack = [[UILabel alloc]init];
labelBlack.backgroundColor = [UIColor blackColor];
[labelBlack setTranslatesAutoresizingMaskIntoConstraints:NO];

[self.view addSubview:labelBlack];

NSDictionary *dic = @{
                      @"labelBlack":labelBlack
                      };

NSString *vfl = @"V:|-25-[labelBlack(80)]";
NSString *vfl1 = @"H:|-25-[labelBlack(80)]";

[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl options:0 metrics:nil views:dic]];
[self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:vfl1 options:0 metrics:nil views:dic]];

上图字符串vfl中的V表示纵向坐标，H表示横向坐标，｜表示父视图的边界，小括号里面表示宽度和高度，中括号表示控件字典中对应的key，然后把约束添加上去就实现了让labelBlack距离父视图顶部25，距离父视图左边25，宽和高都是80，效果如下图

WeChat_1458305169.jpeg

二、SDAutoLayout
首先需要把SDAutoLayout pod到项目中，然后在需要使用到的文件顶部#import "UIView+SDAutoLayout.h"就可以使用了。

/**
 *使用SDAutoLayout
 */
UILabel *labelBlue = [[UILabel alloc]init];      
labelBlue.backgroundColor = [UIColor blueColor];

 [self.view addSubview:labelBlue];
    
labelBlue.sd_layout.rightSpaceToView(self.view,25).topSpaceToView(self.view,25).widthIs(80).heightIs(80);

如上图所示，代码的意思清晰明了，轻松实现让labelBlue距离父视图顶部25，右边距25，宽和高都是80的效果

WeChat_1458306622.jpeg

这篇文章其实是起抛砖引玉的作用，满足我好奇心的同时也把探索的这份愉悦分享给大家

对vfl感兴趣的可以去查阅官方文档和看有关的介绍
对SDAutoLayout感兴趣的可以上github学习更多的用法

有不明白的地方可在下方留言，互相学习交流