autolayout - sizeClass - 1

来源：互联网发布：als推荐算法编辑：程序博客网时间：2024/05/16 04:22

先上点干货：

别人的大神的博客：

超赞的纯代码自动布局：http://jixuqianxing.github.io/blog/2014/12/11/20141212/

自动布局详细：http://www.cnblogs.com/wayne23/p/3935453.html

VFL语句详述：http://www.cocoachina.com/industry/20131108/7322.html

超赞的总结：http://blog.csdn.net/liangliang103377/article/details/40082271

方到用时才恨少啊！！！http://grayluo.github.io/WeiFocusIo/autolayout/2015/01/24/autolayout1/

新发现：http://doc.okbase.net/u013263917/archive/121406.html

根据上面的文章我总结一个自己学习篇章，转和总结以上的精华内容。

iOS6.0以后新增了一个新特性，自动布局Autolayout布局特性，在storyboard和xib文件中，会发现下面的选项：

这就是我们需要重点学习的两个： auto layout 和 size classes

当勾选上之后，以前传统的frame布局都会失去作用！

在代码中需要设置：

autoView.translatesAutoresizingMaskIntoConstraints = NO;

之后将自动布局视图加在父视图上面：

[self.view addSubview:autoView];

因为自动布局约束的建立规则如下（下面）。

之后定义响应的布局约束，并在父视图添加约束条件：

NSArray *constraints1 ＝ autoViewXXXXXConcreateCondition;      [self.view addConstraints:constraints1];

根据上面，可以用iOS的反射判断是否在该view上是否响应自动布局:

if ([self.view respondsToSelector:@selector(addConstraints:)]){    //自动布局}else{    //传统布局}

自动布局的规则：

我们来看到单独添加约束的方法：

/* Create constraints explicitly.  Constraints are of the form "view1.attr1 = view2.attr2 * multiplier + constant"  If your equation does not have a second view and attribute, use nil and NSLayoutAttributeNotAnAttribute. */+(instancetype)constraintWithItem:(id)view1 attribute:(NSLayoutAttribute)attr1 relatedBy:(NSLayoutRelation)relation toItem:(id)view2 attribute:(NSLayoutAttribute)attr2 multiplier:(CGFloat)multiplier constant:(CGFloat)c;

同时考虑到每一个参数的意义：

注意到上面的参数使用的是left和right，结合下面的会知道，下面使用的是leading和trailing （NSLayoutAttributeLeading和NSLayoutAttributeTrailing）。

这位大牛的第一个例子：（http://www.cnblogs.com/wayne23/p/3935453.html）很清晰地讲解了上面的用法：

UIButton *button = [UIButton buttonWithType:UIButtonTypeRoundedRect];[button setTitle:@"测试按钮" forState:UIControlStateNormal];[button sizeToFit];[button setBackgroundColor:[UIColor yellowColor]];button.translatesAutoresizingMaskIntoConstraints = NO;[self.view addSubview:button];NSLayoutConstraint *constraint;//上边距constraint = [NSLayoutConstraint              constraintWithItem:button              attribute:NSLayoutAttributeTop              relatedBy:NSLayoutRelationEqual              toItem:self.view              attribute:NSLayoutAttributeTop              multiplier:1.0f              constant:50.0f];[self.view addConstraint:constraint];//左边距constraint = [NSLayoutConstraint              constraintWithItem:button              attribute:NSLayoutAttributeLeading              relatedBy:NSLayoutRelationEqual              toItem:self.view              attribute:NSLayoutAttributeLeading              multiplier:1.0f              constant:100.0f];[self.view addConstraint:constraint];//右边距constraint = [NSLayoutConstraint              constraintWithItem:button              attribute:NSLayoutAttributeTrailing              relatedBy:NSLayoutRelationEqual              toItem:self.view              attribute:NSLayoutAttributeTrailing              multiplier:1.0f              constant:-100.0f];[self.view addConstraint:constraint];//下边距constraint = [NSLayoutConstraint              constraintWithItem:button              attribute:NSLayoutAttributeBottom              relatedBy:NSLayoutRelationEqual              toItem:self.view              attribute:NSLayoutAttributeBottom              multiplier:1.0f              constant:-350.0f];[self.view addConstraint:constraint];

上面的效果大概就是：

相信观察代码也不难理解，就是上左右下（分别是 top left right bottom地设置约束）。为了进一步验证我将上面的代码修改如下：

    /** autolayout自动布局设置了方法：translatesAutoresizingMaskIntoConstraints = NO 之后Frame的概念就要完全抛弃它 **/    UIView* cotainView = [[UIView alloc] init];    [cotainView setBackgroundColor:[UIColor grayColor]];    [cotainView setFrame:CGRectMake(20, 60, 260, 400)];    [self.view addSubview:cotainView];            UIButton* button = [UIButton buttonWithType:UIButtonTypeRoundedRect];    [button setTitle:@"测试按钮" forState:UIControlStateNormal];    [button sizeToFit];    [button setBackgroundColor:[UIColor yellowColor]];    button.translatesAutoresizingMaskIntoConstraints = NO;    [cotainView addSubview:button];    NSLayoutConstraint* constraint;        //上边距    constraint = [NSLayoutConstraint constraintWithItem:button                                              attribute:NSLayoutAttributeTop                                              relatedBy:NSLayoutRelationEqual                                                 toItem:cotainView                                              attribute:NSLayoutAttributeTop                                             multiplier:1.0f                                               constant:50.0f];    [cotainView addConstraint:constraint];        //左边距    constraint = [NSLayoutConstraint constraintWithItem:button                                              attribute:NSLayoutAttributeLeading                                              relatedBy:NSLayoutRelationEqual                                                 toItem:cotainView                                              attribute:NSLayoutAttributeLeading                                             multiplier:1.0f                                               constant:60.0f];    [cotainView addConstraint:constraint];        //attribute上下一样,上面是子视图，下面是            //右边距    constraint = [NSLayoutConstraint constraintWithItem:button                                              attribute:NSLayoutAttributeTrailing                                              relatedBy:NSLayoutRelationEqual                                                 toItem:cotainView                                              attribute:NSLayoutAttributeTrailing                                             multiplier:1.0f                                               constant:-20.0f];    [cotainView addConstraint:constraint];        //constant约束条件的常数可以有负数， 定义的顺序是上左，同时注意到下面两个的constant是负数值        //    constraint = [NSLayoutConstraint constraintWithItem:button                                              attribute:NSLayoutAttributeBottom                                              relatedBy:NSLayoutRelationEqual                                                 toItem:cotainView                                              attribute:NSLayoutAttributeBottom                                             multiplier:1.0f                                               constant:-20.0f];    [cotainView addConstraint:constraint];

结果如下：

也相当好理解吧！就是这个约束不在self.view和button之间产生，而是button和containView中产生。

同时也要注意到一个小细节，上面的sizeToFit是会对大小产生作用的，就是button会变成title的大小，但是经过autolayout的约束后就会遵循约束的条件。但是进一步验证，将它输出后发现：

    NSLog(@"button autolayout changed :%@", NSStringFromCGRect(button.bounds));

输出的是sizeToFit的内容！就是说明，autolayout是页面的约束条件作用，而对控件本身的内容却是不做影响的，所以要小心啊，千万不能还停留在传统的frame定义和的概念。

所以学东西的时候要灵活！所以继续探讨，大牛的例子都是上左下右都制定好了约束，那如果去掉其中的一个呢？有没有想过？例如把底部约束去掉，运行。得到下面的结果：

结果很明显就是底部的约束明显失去，而上左右都存在原来制定的约束，所以也说明了sizeToFit为啥还是原来的值，嘻嘻，原来如此，当约束失效、不完整、冲突等等sizeToFit这个捍卫内容frame的作用就很突出啦！

待续...

如果上面引用大牛们的例子产生任何不好的影响，请在评论区提醒哦，小弟马上修改！谢谢！

0 0