码迷,mamicode.com
首页 > 其他好文 > 详细

纯代码Autolayout的三种方法

时间:2016-07-07 17:23:58      阅读:195      评论:0      收藏:0      [点我收藏+]

标签:

Autolayout讲解较多的就是xib和storyboard用法,本文主要记录纯代码的Autolayout使用方法:

方法1.苹果原生的方法,这种方法虽然简单但是太过繁杂,可用性很差

    //宽度=superView高度
    [superView addConstraint:[NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:superView attribute:NSLayoutAttributeWidth multiplier:1 constant:0]];
    //高度=40
    [superView addConstraint:[NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeHeight multiplier:0 constant:40]];
    //view1底部距离superView底部距离为0
    [superView addConstraint:[NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:superView attribute:NSLayoutAttributeBottom multiplier:1 constant:0]];

方法2.VFL方法:

//view1距离superview两端距离都为0
  [superView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[view1]|" options:0 metrics:nil views:NSDictionaryOfVariableBindings(view1)]];
    //view1高度为40,距离底端距离为0
  [superView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[view1(==40)]" options:0 metrics:nil views:NSDictionaryOfVariableBindings(view1)]];
  • V:[view1][view2(==view1)]|
  • V表示竖直布局(vertical),先是一个view1,其下方紧接一个宽度等于view1宽度的view2,view2距离父视图底部边缘距离为0
  • H:|-[view1]-[view2]-[view3(>=20)]-|
  • H表示水平布局,view1距离父视图左边缘默认间隔宽度,之后是view2距离view1间隔默认宽度;再之后是宽度不小于20的view3,它和view2以及父视图右边缘的间距都是默认宽度。(竖线‘|‘ 表示superview的边缘,“-|”表示默认距离,“|”表示距离边缘为0)

注意:

-(void)addConstraint:(NSLayoutConstraint *)constraint;

用来将约束添加到view。在添加时唯一要注意的是添加的目标view要遵循以下规则:

1.对于两个同层级view之间的约束关系,添加到他们的父view上

技术分享

 

2对于两个不同层级view之间的约束关系,添加到他们最近的共同父view上

技术分享

3对于有层次关系的两个view之间的约束关系,添加到层次较高的父view上

技术分享

方法3.第三方库Masonry

    [view1 setTranslatesAutoresizingMaskIntoConstraints:NO];
    [view1 mas_makeConstraints:^(MASConstraintMaker *make) {
        make.leading.width.equalTo(superView);
        make.height.equalTo(@40);
        
    }];

      

 

                

参考原文档:         

    http://blog.csdn.net/sxfcct/article/details/8776928       

    http://www.zhihu.com/question/37095424              

masonry下载网址:                  

   https://github.com/SnapKit/Masonry

纯代码Autolayout的三种方法

标签:

原文地址:http://www.cnblogs.com/sunjianfei/p/5650412.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!