Masonry的基础用法
1,用发
#import "ViewController.h"
//define this constant if you want to use Masonry without the 'mas_' prefix
#define MAS_SHORTHAND
//define this constant if you want to enable auto-boxing for default syntax
#define MAS_SHORTHAND_GLOBALS
#import "Masonry.h"
@interface ViewController ()
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// 蓝色控件
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];
// 添加约束
CGFloat margin = 20;
CGFloat height = 50;
[blueView makeConstraints:^(MASConstraintMaker *make) {
make.left.equalTo(self.view.left).offset(margin);
make.right.equalTo(redView.left).offset(-margin);
make.bottom.equalTo(self.view.bottom).offset(-margin);
make.height.equalTo(height);
make.top.equalTo(redView.top);
make.bottom.equalTo(redView.bottom);
make.width.equalTo(redView.width);
}];
[redView makeConstraints:^(MASConstraintMaker *make) {
make.right.equalTo(self.view.right).offset(-margin);
}];
}
- (void)test4
{
// 蓝色控件
UIView *blueView = [[UIView alloc] init];
blueView.backgroundColor = [UIColor blueColor];
[self.view addSubview:blueView];
// 添加约束
[blueView makeConstraints:^(MASConstraintMaker *make) {
// make.width.equalTo(self.view.width).multipliedBy(0.5);
// make.height.equalTo(self.view.height).multipliedBy(0.5).offset(-100);
make.width.equalTo(100);
make.height.equalTo(100);
make.centerX.equalTo(self.view.centerX);
make.centerY.equalTo(self.view.centerY);
}];
}
- (void)test3
{
// 蓝色控件
UIView *blueView = [[UIView alloc] init];
blueView.backgroundColor = [UIColor blueColor];
[self.view addSubview:blueView];
// 距离父控件四周都是50间距
// [blueView mas_makeConstraints:^(MASConstraintMaker *make) {
// make.left.mas_equalTo(self.view.mas_left).offset(50);
// make.right.mas_equalTo(self.view.mas_right).offset(-50);
// make.top.mas_equalTo(self.view.mas_top).offset(50);
// make.bottom.mas_equalTo(self.view.mas_bottom).offset(-50);
// }];
// [blueView mas_makeConstraints:^(MASConstraintMaker *make) {
// make.left.mas_equalTo(self.view).offset(50);
// make.right.mas_equalTo(self.view).offset(-50);
// make.top.mas_equalTo(self.view).offset(50);
// make.bottom.mas_equalTo(self.view).offset(-50);
// }];
// [blueView mas_makeConstraints:^(MASConstraintMaker *make) {
// make.left.offset(50);
// make.right.offset(-50);
// make.top.offset(50);
// make.bottom.offset(-50);
// }];
// [blueView mas_makeConstraints:^(MASConstraintMaker *make) {
// make.left.top.offset(50);
// make.right.bottom.offset(-50);
// }];
[blueView mas_makeConstraints:^(MASConstraintMaker *make) {
// make.edges.mas_equalTo(self.view).insets(UIEdgeInsetsMake(50, 50, 50, 50));
make.center.mas_equalTo(self.view).insets(UIEdgeInsetsZero);
}];
}
- (void)test2
{
// 蓝色控件
UIView *blueView = [[UIView alloc] init];
blueView.backgroundColor = [UIColor blueColor];
[self.view addSubview:blueView];
// 居中（水平+垂直）
// 尺寸是父控件的一半
[blueView mas_makeConstraints:^(MASConstraintMaker *make) {
make.size.mas_equalTo(self.view).multipliedBy(0.5);
make.center.mas_equalTo(self.view);
// make.centerX.mas_equalTo(self.view);
// make.centerY.mas_equalTo(self.view);
}];
}
- (void)test1
{
// 蓝色控件
UIView *blueView = [[UIView alloc] init];
blueView.backgroundColor = [UIColor blueColor];
[self.view addSubview:blueView];
// 尺寸限制：100x100
// 位置：粘着父控件右下角，间距是20
// 这个方法只会添加新的约束
// [blueView mas_makeConstraints:^(MASConstraintMaker *make) {
// // 宽度约束
// make.width.equalTo(@100);
// // 高度约束
// make.height.equalTo(@100);
// // 右边
// make.right.equalTo(self.view.mas_right).offset(-20);
// // 顶部
// make.top.equalTo(self.view.mas_top).offset(20);
// }];
// [blueView mas_makeConstraints:^(MASConstraintMaker *make) {
// // 宽度约束
// make.width.mas_equalTo(100);
// // 高度约束
// make.height.mas_equalTo(100);
// // 右边
// make.right.equalTo(self.view).offset(-20);
// // 顶部
// make.top.equalTo(self.view).offset(20);
// }];
// [blueView mas_makeConstraints:^(MASConstraintMaker *make) {
// // 宽度高度约束
// make.width.height.mas_equalTo(100);
// // 右边
// make.right.equalTo(self.view).offset(-20);
// // 顶部
// make.top.equalTo(self.view).offset(20);
// }];
// [blueView mas_makeConstraints:^(MASConstraintMaker *make) {
// // 宽度高度约束
make.size.equalTo([NSValue valueWithCGSize:CGSizeMake(100, 100)]);
make.size.mas_equalTo(CGSizeMake(100, 100));
// make.size.mas_equalTo(100);
// // 右边
// make.right.equalTo(self.view).offset(-20);
// // 顶部
// make.top.equalTo(self.view).offset(20);
// }];
[blueView mas_makeConstraints:^(MASConstraintMaker *make) {
// 宽度高度约束
make.height.mas_equalTo(self.view).multipliedBy(0.5).offset(-50);
// 右边
make.right.mas_equalTo(self.view).offset(-20);
// make.right.offset(-20);
// 顶部
make.top.mas_equalTo(self.view).offset(20);
// make.top.offset(20);
}];
/**
mas_equalTo：这个方法会对参数进行包装
equalTo：这个方法不会对参数进行包装
mas_equalTo的功能强于 > equalTo
*/
}
/**
约束的类型：
1.尺寸：width\height\size
2.边界：left\leading\right\trailing\top\bottom
3.中心点：center\centerX\centerY
4.边界：edges
*/
/**
// 这个方法会将以前的所有约束删掉，添加新的约束
[blueView mas_remakeConstraints:^(MASConstraintMaker *make) {
}];
// 这个方法将会覆盖以前的某些特定的约束
[blueView mas_updateConstraints:^(MASConstraintMaker *make) {
}];
*/
2.效果
2.swift的使用
//
// ViewController.swift
// aaa
//
// Created by 虞海飞 on 2016/12/22.
// Copyright © 2016年 虞海飞. All rights reserved.
//
import UIKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
//addView();
addView_02();
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
private func addView(){
let view_a = UIView();
view_a.backgroundColor = UIColor.red;
view.addSubview(view_a);
view_a.snp.makeConstraints { (make) in
//设置 view 的大小
make.size.equalTo(CGSize(width: 50, height: 50));
// make.centerX.equalTo(view.center.x).offset(20);
// make.top.equalTo(view.center.y).offset(20);
//中心对齐是，view X 0，2
make.centerX.equalTo(view).multipliedBy(0.2);
//Y 是父亲的一半
make.centerY.equalTo(view);
}
}
private func addView_01(){
let view_a = UIView();
view_a.backgroundColor = UIColor.red;
let view_b = UIView();
view_b.backgroundColor = UIColor.blue;
view.addSubview(view_a);
view.addSubview(view_b);
view_a.snp.makeConstraints { (make) in
//高度是 view 的 高度 - 200
make.height.equalTo(view).offset(-200);
make.top.equalTo(20);
make.left.equalTo(10);
make.right.equalTo(-10);
}
view_b.snp.makeConstraints { (make) in
// top的高度是 ， view_a 的 底部 + 10
make.top.equalTo(view_a.snp.bottom).offset(10);
make.left.equalTo(view_a);
make.right.equalTo(view_a);
make.bottom.equalTo(-10);
}
}
private func addView_02(){
let view_a = UIView();
view_a.backgroundColor = UIColor.red;
let view_b = UIView();
view_b.backgroundColor = UIColor.blue;
self.view.addSubview(view_b);
self.view.addSubview(view_a);
view_a.snp.makeConstraints { (make) in
make.width.equalTo(view).offset(-20);
make.left.equalTo(10);
make.height.equalTo(view).multipliedBy(0.4);
make.top.equalTo(20);
}
view_b.snp.makeConstraints { (make) in
//右边是，view_a 的中心在偏移100
make.right.equalTo(view_a.snp.centerX).offset(100);
make.width.equalTo(view_a.snp.width).multipliedBy(0.5);
make.top.equalTo(view_a.snp.bottom).offset(20);
make.height.equalTo(view_a.snp.height).multipliedBy(0.8);
}
}
}
