• 纯代码Autolayout的三种方法


    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);
            
        }];

          

    //上下左右边距
    -(void)masonryTest1{
        
        UIView *blueView=[[UIView alloc]init];
        blueView.backgroundColor=[UIColor blueColor];
        [self.view addSubview:blueView];
        
        UIView *redView=[[UIView alloc]init];
        redView.backgroundColor=[UIColor redColor];
        [self.view addSubview:redView];
        
        [blueView mas_makeConstraints:^(MASConstraintMaker *make) {
    //        make.width.mas_equalTo(100);
    //        make.height.mas_equalTo(100);
    //        make.left.equalTo(self.view.mas_left).with.offset(10);
    //        make.top.equalTo(self.view.mas_top).with.offset(20);
            
            make.edges.equalTo(self.view).with.insets(UIEdgeInsetsMake(10, 10, 10, 100));
        }];
        
        [redView mas_makeConstraints:^(MASConstraintMaker *make) {
            
            make.height.mas_equalTo(blueView.mas_height);
            make.left.equalTo(blueView.mas_right).with.offset(10);
            make.right.equalTo(self.view.mas_right).with.offset(-10);
            make.top.equalTo(blueView.mas_top).with.offset(0);
        
        }];
        
    }
    // test2: 中心点与self.view相同,宽度为400*400
    -(void)masonryTest2{
        UIView *view = [UIView new];
        [view setBackgroundColor:[UIColor redColor]];
        [self.view addSubview:view];
        [view mas_makeConstraints:^(MASConstraintMaker *make) {
            make.center.equalTo(self.view);
            make.size.mas_equalTo(CGSizeMake(200,200));
        }];
    }

                    

    参考原文档:         

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

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

    masonry下载网址:                  

       https://github.com/SnapKit/Masonry

  • 相关阅读:
    thinkphp header模块中的CSS格式也要写在home页中,不然无效
    thinkphp header模块中设为首页的JS代码需要写在HOME页中
    dubbo框架-学习-dubbo原理
    java-面试题为什么redis这么快
    jsp学习——九大内置对象
    日志平台使用记录
    java-消息队列相关-activeMQ
    java——比较难和底层的面试题
    学习之道——感觉东西多不知道如何下手怎么办
    java-Freemarker-模板引擎学习
  • 原文地址:https://www.cnblogs.com/sunjianfei/p/5650412.html
Copyright © 2020-2023  润新知