iOS PureLayout使用

PureLayout是iOS Auto Layout的終端API，強大而簡單。由UIView、NSArray和NSLayoutConstraint類別組成。

PureLayout為大多數Auto Layout用例提供了一個開發者友好型的界面

github地址: https://github.com/PureLayout/PureLayout

看看這張圖的布局

• 下面是在pureLayout中經常使用的五個參數(There are 5 specific attribute types, which are used throughout most of the API)
  1.ALEdge
  2.ALDimension
  3.ALAxis
  4.ALMargin available in iOS 8.0 and higher only
  5.ALMarginAxis available in iOS 8.0 and higher only

 

大家直接照着下面代碼敲一遍吧, 就差不多會了.

//
//  ViewController.m
//  PureLayoutDemo
//
//  Created by Jackey on 2017/3/15.
//  Copyright © 2017年 com.zhouxi. All rights reserved.
//

#import <PureLayout.h>

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    

    //藍色view位於中心, 大小是50pt
    UIView *blueView = [[UIView alloc] init];
    [blueView setBackgroundColor:[UIColor blueColor]];
    [self.view addSubview:blueView];    //注意要先添加到父件上, 再調整
    
    //設置在父件中心
    [blueView autoCenterInSuperview];
    //設置大小
    [blueView autoSetDimensionsToSize:CGSizeMake(50.0, 50.0)];
    
    
    
    
    //紅色view頂部與藍色view底部位置一樣, 左邊與藍色的右邊一樣, 寬度跟藍色view一樣, 高度40pt
    UIView *redView = [[UIView alloc] init];
    [redView setBackgroundColor:[UIColor redColor]];
    [self.view addSubview:redView];
    
    //設置紅色view頂部跟藍色view的底部對齊
    [redView autoPinEdge:ALEdgeTop toEdge:ALEdgeBottom ofView:blueView];
    
    //設置紅色view的左邊跟藍色view的右邊對齊
    [redView autoPinEdge:ALEdgeLeft toEdge:ALEdgeRight ofView:blueView];
    
    //設置紅色view的寬度跟藍色view的寬度一致
    [redView autoMatchDimension:ALDimensionWidth toDimension:ALDimensionWidth ofView:blueView];
    
    //設置紅色view的高度為40
    [redView autoSetDimension:ALDimensionHeight toSize:40.0];
    
    
    
    
    
    //黃色view的頂部跟紅色view的底部+10pt位置一致, 高度為25pt, 左右距父控件均為20pt
    UIView *yellowView = [[UIView alloc] init];
    [yellowView setBackgroundColor:[UIColor yellowColor]];
    [self.view addSubview:yellowView];
    
    //設置黃色view的頂部高度距離紅色view底部10
    [yellowView autoPinEdge:ALEdgeTop toEdge:ALEdgeBottom ofView:redView withOffset:10.0];
    
    //設置黃色view的高度25
    [yellowView autoSetDimension:ALDimensionHeight toSize:25.0];
    
    //設置黃色view左邊距離父件左邊20
    [yellowView autoPinEdgeToSuperviewEdge:ALEdgeLeft withInset:20.0];
    
    //設置黃色view的右邊距離父件右邊20
    [yellowView autoPinEdgeToSuperviewEdge:ALEdgeRight withInset:20.0];
    
    
    
    
    //綠色view的頂部與黃色view的底部間距10, 與父view垂直居中, 高度是黃色view高度的兩倍, 寬度是150
    UIView *greenView = [[UIView alloc] init];
    [greenView setBackgroundColor:[UIColor greenColor]];
    [self.view addSubview:greenView];
    
    //設置綠色view頂部高度距離黃色view底部10
    [greenView autoPinEdge:ALEdgeTop toEdge:ALEdgeBottom ofView:yellowView withOffset:10.0];
    
    //設置綠色view在父件垂直中心線上
    [greenView autoAlignAxisToSuperviewMarginAxis:ALAxisVertical];
    
    //設置綠色view高度是黃色view高度的2倍
    [greenView autoMatchDimension:ALDimensionHeight toDimension:ALDimensionHeight ofView:yellowView withMultiplier:2.0];
    
    //設置綠色view寬度為150
    [greenView autoSetDimension:ALDimensionWidth toSize:150.0];
}


- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}


@end

 

顯示結果: