使用 Masonry 進行頁面佈局時的實例代碼

一、須要在 當前視圖控制器的生命週期裏面，調用 AutoLayout 的方法

 

方法一  調用 IOS 5 之後可用的  - (void)viewWillLayoutSubviews

#pragma mark - life cycle
//這裏負責把組件添加到 當前控制器容器中
- (void)viewDidLoad {
    [super viewDidLoad];
    
    [self initComponents];
}

//這裏負責初始化組件大小、數據
- (void)viewWillAppear:(BOOL)animated
{
    [super viewWillAppear:animated];

}

- (void)initComponents {
　　 //把全部組件添加到當前視圖控制器的容器中
    [self.view addSubview:self.tableView];
    
}

//這裏進行頁面自動佈局代碼的設置
- (void)viewWillLayoutSubviews {
    NSLog(@"----------裏面寫自動佈局代碼----------");
}

 

方法二：

#pragma mark - life cycle
//這裏負責把組件添加到 當前控制器容器中
- (void)viewDidLoad {
    [super viewDidLoad];
    
    [self initComponents];
}

//這裏負責初始化組件大小、數據
- (void)viewWillAppear:(BOOL)animated
{
    [super viewWillAppear:animated];

}
- (void)initComponents {
    [self.view addSubview:self.tableView];
    
     //這裏必定要調用
    [self.view setNeedsUpdateConstraints];
}

//@interface UIViewController (UIConstraintBasedLayoutCoreMethods)- (void)updateViewConstraints
{
    NSLog(@"----------updateViewConstraints----------");

    //這裏必定要調用
    [super updateViewConstraints];
}

 

粘貼一段完整代碼

#import "ViewController.h"
#import "Masonry.h"

@interface ViewController ()

@property (nonatomic, strong) UIView *halfBackgroundView;
@property (nonatomic, strong) UIView *logoView;
@property (nonatomic, strong) UIView *loginBlockView;
@property (nonatomic, strong) UIView *userNameView;
@property (nonatomic, strong) UIView *passwordView;
@property (nonatomic, strong) UIView *loginView;
@property (nonatomic, strong) UIView *forgetPWRigisterView;
@property (nonatomic, strong) UIView *copyrightView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    [self initComponents];

}

- (void)randomBGColor:(UIView *) view{
    CGFloat r, g, b;
    r = (arc4random() % 256) / 255.0;
    g = (arc4random() % 256) / 255.0;
    b = (arc4random() % 256) / 255.0;
    view.backgroundColor = [UIColor colorWithRed:r green:g blue:b alpha:1.0];
}

- (void)initComponents {
    [self.view addSubview:self.halfBackgroundView];
    [self.halfBackgroundView addSubview:self.logoView];
    [self.view addSubview:self.loginBlockView];
    [self.loginBlockView addSubview:self.userNameView];
    [self.loginBlockView addSubview:self.passwordView];
    [self.loginBlockView addSubview:self.loginView];
    [self.view addSubview:self.forgetPWRigisterView];
    [self.view addSubview:self.copyrightView];
    
    //這裏必定要調用
    [self.view setNeedsUpdateConstraints];
}


//@interface UIViewController (UIConstraintBasedLayoutCoreMethods)
- (void)updateViewConstraints {
    // 上半部分的背景 View @四邊的對齊約束
    [self.halfBackgroundView mas_makeConstraints:^(MASConstraintMaker *make) {
        // 寫法自由，left、right、top 能夠分開寫，也能夠一塊兒寫。
        make.left.right.top.equalTo(self.view);
        // 偏移
        make.bottom.equalTo(self.view).offset(-235);
    }];
    
    // logoView 設置爲方塊，在 halfBackgroundView 的中間
    [self.logoView mas_makeConstraints:^(MASConstraintMaker *make) {
        // 設置固定的大小，equalTo 須要接受 id 類型，因此須要按需轉換成 NSValue 或者 NSNumber
        make.size.equalTo([NSValue valueWithCGSize:CGSizeMake(100, 100)]);
        // 設置中心位置
        make.center.equalTo(self.halfBackgroundView);
    }];
    
    // 登錄框
    [self.loginBlockView mas_makeConstraints:^(MASConstraintMaker *make) {
        // 兩個不一樣屬性 + 使用倍乘關係
        make.top.equalTo(self.halfBackgroundView.mas_bottom).multipliedBy(0.75);
        make.centerX.equalTo(self.halfBackgroundView);
        make.left.equalTo(self.view).offset(25);
        make.right.equalTo(self.view).offset(-25);
        // 設置固定值及優先級
        make.height.equalTo(@170).priorityLow();        // 約束衝突時優先級低的會被覆蓋掉
    }];
    
    [self.userNameView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(self.loginBlockView).offset(10);
        make.left.equalTo(self.loginBlockView).offset(15);
        make.right.equalTo(self.loginBlockView).offset(-15);
        make.height.equalTo(@35);
    }];
    
    [self.passwordView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.right.equalTo(self.userNameView);
        make.top.equalTo(self.userNameView.mas_bottom).offset(15);
        make.height.equalTo(self.userNameView);
    }];
    
    [self.loginView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(self.passwordView.mas_bottom).offset(15);
        make.left.equalTo(self.loginBlockView).offset(10);
        make.right.equalTo(self.loginBlockView).offset(-10);
        make.height.equalTo(@50);
        make.bottom.equalTo(self.loginBlockView).offset(-10);     // 這裏可能會和上面直接設置 loginBlockView 高度一條約束衝突，可是由於優先級的緣故並不會出錯
    }];
    
    [self.copyrightView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.size.equalTo([NSValue valueWithCGSize:CGSizeMake(200, 50)]);
        make.centerX.equalTo(self.view);
        make.bottom.equalTo(self.view).offset(-10);
    }];
    
    [self.forgetPWRigisterView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.height.equalTo(@30);
        make.left.right.equalTo(self.view);
        make.bottom.equalTo(self.copyrightView.mas_top).offset(-30);
    }];
    

　　 //這裏必定要調用
    [super updateViewConstraints];
}

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

#pragma mark - Init UI

- (UIView *)halfBackgroundView {
    if (!_halfBackgroundView) {
        _halfBackgroundView = [[UIView alloc] initWithFrame:CGRectZero];
        _halfBackgroundView.backgroundColor = [UIColor greenColor];
    }
    return _halfBackgroundView;
}

- (UIView *)logoView {
    if (!_logoView) {
        _logoView = [[UIView alloc] initWithFrame:CGRectZero];
        _logoView.backgroundColor = [UIColor lightGrayColor];
    }
    return _logoView;
}

- (UIView *)loginBlockView {
    if (!_loginBlockView) {
        _loginBlockView = [[UIView alloc] initWithFrame:CGRectZero];
        _loginBlockView.backgroundColor = [UIColor redColor];
    }
    return _loginBlockView;
}

- (UIView *)userNameView {
    if (!_userNameView) {
        _userNameView = [[UIView alloc] initWithFrame:CGRectZero];
        _userNameView.backgroundColor = [UIColor whiteColor];
    }
    return _userNameView;
}

- (UIView *)passwordView {
    if (!_passwordView) {
        _passwordView = [[UIView alloc] initWithFrame:CGRectZero];
        _passwordView.backgroundColor = [UIColor purpleColor];
    }
    return _passwordView;
}

- (UIView *)loginView {
    if (!_loginView) {
        _loginView = [[UIView alloc] initWithFrame:CGRectZero];
        _loginView.backgroundColor = [UIColor yellowColor];
    }
    return _loginView;
}

- (UIView *)forgetPWRigisterView {
    if (!_forgetPWRigisterView) {
        _forgetPWRigisterView = [[UIView alloc] initWithFrame:CGRectZero];
        _forgetPWRigisterView.backgroundColor = [UIColor orangeColor];
    }
    return _forgetPWRigisterView;
}

- (UIView *)copyrightView {
    if (!_copyrightView) {
        _copyrightView = [[UIView alloc] initWithFrame:CGRectZero];
        _copyrightView.backgroundColor = [UIColor greenColor];
    }
    return _copyrightView;
}

@end