Objective-C语言——AutoLayout自动布局

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {

    [super viewDidLoad];

  

    /*

        AutoLayout 由来

     iOS6之后出现的一种新的布局方式，用于取代原先的 Autoresizing 系统的布局方式

     

     AutoLayer 是指定视图和父视图 或 视图和兄弟视图的关系来布局

     

     在 AutoLayer 当中，我们使用约束来描述视图与视图之间的关系

     

     OC 专门为开发者封装了一个类 NSLayoutConstraint 来帮助开发者描述布局

     */

    

//    [NSLayoutConstraint constraintWithItem:<#(nonnull id)#> attribute:<#(NSLayoutAttribute)#> relatedBy:<#(NSLayoutRelation)#> toItem:<#(nullable id)#> attribute:<#(NSLayoutAttribute)#> multiplier:<#(CGFloat)#> constant:<#(CGFloat)#>];

    /*

     参数的意义:

     Item:约束中两个视图对象

     attribute:描述视图的对齐特征

     relatedBy：描述两个视图 attribute 关系

     multiplier：缩放比例

     constant：偏移量

     

     视图1（Item）.属性（attribute）  关系（relatedBy） 视图2（Item）.属性（attribute）*缩放比例（multiplier） + 偏移量（constant）

     

     

     视图1.左边 == 视图2.左边 * 1 + 0

     [NSLayoutConstraint constraintWithItem:视图1 attribute:左边 relatedBy:等于 toItem:视图2 [attribute:左边 multiplier:1 constant:0];

     

     

     视图1.宽度 == 100

     [NSLayoutConstraint constraintWithItem:视图1 attribute:宽度 relatedBy:等于 toItem: nil attribute:宽度 multiplier:1 constant:100];

     

     */

    UIView *view1 = [UIView new];

    view1.backgroundColor = [UIColor purpleColor];

    //启动 autoLayer 布局

    view1.translatesAutoresizingMaskIntoConstraints = NO;

    [self.view addSubview:view1];

    // X轴

    NSLayoutConstraint *constraintX = [NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeCenterX multiplier:1 constant:0];

    [self.view addConstraint:constraintX];

    

    // Y轴

    NSLayoutConstraint *constraintY = [NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeCenterY relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeCenterY multiplier:1 constant:0];

    [self.view addConstraint:constraintY];

    

    // 宽度

    NSLayoutConstraint *constraintWidth = [NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeWidth multiplier:1 constant:100];

    [self.view addConstraint:constraintWidth];

    //高度

    NSLayoutConstraint *constraintHeight = [NSLayoutConstraint constraintWithItem:view1 attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeHeight multiplier:1 constant:100];

   [self.view addConstraint:constraintHeight];

    

    

    UIView *view2 = [[UIView alloc] init];

    view2.backgroundColor = [UIColor yellowColor];

    

    

    //布局启动

    view2.translatesAutoresizingMaskIntoConstraints = NO;

    [self.view addSubview:view2];

    

    NSLayoutConstraint *constraintX2 = [NSLayoutConstraint constraintWithItem:view2 attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:view1 attribute:NSLayoutAttributeTrailing multiplier:1 constant:0];

    [self.view addConstraint:constraintX2];

    

    NSLayoutConstraint *constraintY2 = [NSLayoutConstraint constraintWithItem:view2 attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:view1 attribute:NSLayoutAttributeBottom multiplier:1 constant:0];

    [self.view addConstraint:constraintY2];

    

    

    NSLayoutConstraint *constraintWidth2 = [NSLayoutConstraint constraintWithItem:view2 attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:view1 attribute:NSLayoutAttributeWidth multiplier:0.5 constant:0];

    [self.view addConstraint:constraintWidth2];

    

    NSLayoutConstraint *constraintHeight2 = [NSLayoutConstraint constraintWithItem:view2 attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:view1 attribute:NSLayoutAttributeHeight multiplier:1 constant:0];

    [self.view addConstraint:constraintHeight2];

    

    

}

- (void)didReceiveMemoryWarning {

    [super didReceiveMemoryWarning];

    // Dispose of any resources that can be recreated.

}

@end