Masonry使用详解

mas_makeConstraints 只负责新增约束 Autolayout不能同时存在两条针对于同一对象的约束否则会报错
mas_updateConstraints 针对上面的情况会更新在block中出现的约束不会导致出现两个相同约束的情况
mas_remakeConstraints 则会清除之前的所有约束仅保留最新的约束
equalTo 和 mas_equalTo的区别在哪里呢? 其实 mas_equalTo是一个MACRO,比较的是值，equalTo比较的是view。

宽高相等：

make.width.offset(marginHeight);

make.height.mas_equalTo(timeImg.mas_width).multipliedBy(1);

1. [基础] 居中显示一个view

- (void)viewDidLoad

{

[super viewDidLoad];

// Do any additional setup after loading the view.

WS(ws);

UIView *sv = [UIView new];

[sv showPlaceHolder];

sv.backgroundColor = [UIColor blackColor];

[self.view addSubview:sv];

[sv mas_makeConstraints:^(MASConstraintMaker *make) {

make.center.equalTo(ws.view);

make.size.mas_equalTo(CGSizeMake(300, 300));

}];

}

2. [初级] 让一个view略小于其superView(边距为10)

UIView *sv1 = [UIView new];

[sv1 showPlaceHolder];

sv1.backgroundColor = [UIColor redColor];

[sv addSubview:sv1];

[sv1 mas_makeConstraints:^(MASConstraintMaker *make) {

make.edges.equalTo(sv).with.insets(UIEdgeInsetsMake(10, 10, 10, 10));

/* 等价于

make.top.equalTo(sv).with.offset(10);

make.left.equalTo(sv).with.offset(10);

make.bottom.equalTo(sv).with.offset(-10);

make.right.equalTo(sv).with.offset(-10);

*/

/* 也等价于

make.top.left.bottom.and.right.equalTo(sv).with.insets(UIEdgeInsetsMake(10, 10, 10, 10));

*/

}];

3. [初级] 让两个高度为150的view垂直居中且等宽且等间隔排列间隔为10(自动计算其宽度)

int padding1 = 10;

[sv2 mas_makeConstraints:^(MASConstraintMaker *make) {

make.centerY.mas_equalTo(sv.mas_centerY);

make.left.equalTo(sv.mas_left).with.offset(padding1);

make.right.equalTo(sv3.mas_left).with.offset(-padding1);

make.height.mas_equalTo(@150);

make.width.equalTo(sv3);

}];

[sv3 mas_makeConstraints:^(MASConstraintMaker *make) {

make.centerY.mas_equalTo(sv.mas_centerY);

make.left.equalTo(sv2.mas_right).with.offset(padding1);

make.right.equalTo(sv.mas_right).with.offset(-padding1);

make.height.mas_equalTo(@150);

make.width.equalTo(sv2);

}];

4. [中级] 在UIScrollView顺序排列一些view并自动计算contentSize

    UIScrollView *contextSV = [UIScrollView new];
    contextSV.backgroundColor = [UIColor greenColor];
    contextSV.pagingEnabled = YES;
    [self.view addSubview:contextSV];
    [contextSV mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.offset(0);
        make.right.offset(0);
        make.top.offset(0);
        make.bottom.offset(-49.0f);
    }];

    UIView *contentView = [UIView new];
    [contextSV addSubview:contentView];
    [contentView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.offset(0);
        make.right.offset(0);
        make.top.offset(0);
        make.bottom.offset(0);
        make.height.equalTo(contextSV.mas_height);
    }];

    UIView *nextView = nil;
    for (int i = 0 ; i < 10; i++)
    {
        UIView *view = [UIView new];
        view.backgroundColor = [UIColor colorWithRed:(arc4random()%256/255.0f) green:(arc4random()%256/255) blue:(arc4random()%256/255) alpha:1];
        [contentView addSubview:view];
        [view mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.offset(0);
            make.bottom.offset(0);
            if (i == 0) {
                make.left.offset(0);
            }else{
                make.left.equalTo(nextView.mas_right).offset(0);
            }
            if (i == 9) {
                make.right.offset(0);
            }
            make.width.equalTo(contextSV.mas_width);
        }];
        nextView = view;
    }
    [contentView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.right.equalTo(nextView.mas_right);
    }];

5. [高级] 横向或者纵向等间隙的排列一组view

@implementation UIView(Masonry_LJC)

- (void) distributeSpacingHorizontallyWith:(NSArray*)views

{

NSMutableArray *spaces = [NSMutableArray arrayWithCapacity:views.count+1];

for ( int i = 0 ; i < views.count+1 ; ++i )

{

UIView *v = [UIView new];

[spaces addObject:v];

[self addSubview:v];

[v mas_makeConstraints:^(MASConstraintMaker *make) {

make.width.equalTo(v.mas_height);

}];

}

UIView *v0 = spaces[0];

__weak __typeof(&*self)ws = self;

[v0 mas_makeConstraints:^(MASConstraintMaker *make) {

make.left.equalTo(ws.mas_left);

make.centerY.equalTo(((UIView*)views[0]).mas_centerY);

}];

UIView *lastSpace = v0;

for ( int i = 0 ; i < views.count; ++i )

{

UIView *obj = views[i];

UIView *space = spaces[i+1];

[obj mas_makeConstraints:^(MASConstraintMaker *make) {

make.left.equalTo(lastSpace.mas_right);

}];

[space mas_makeConstraints:^(MASConstraintMaker *make) {

make.left.equalTo(obj.mas_right);

make.centerY.equalTo(obj.mas_centerY);

make.width.equalTo(v0);

}];

lastSpace = space;

}

[lastSpace mas_makeConstraints:^(MASConstraintMaker *make) {

make.right.equalTo(ws.mas_right);

}];

}

- (void) distributeSpacingVerticallyWith:(NSArray*)views

{

NSMutableArray *spaces = [NSMutableArray arrayWithCapacity:views.count+1];

for ( int i = 0 ; i < views.count+1 ; ++i )

{

UIView *v = [UIView new];

[spaces addObject:v];

[self addSubview:v];

[v mas_makeConstraints:^(MASConstraintMaker *make) {

make.width.equalTo(v.mas_height);

}];

}

UIView *v0 = spaces[0];

__weak __typeof(&*self)ws = self;

[v0 mas_makeConstraints:^(MASConstraintMaker *make) {

make.top.equalTo(ws.mas_top);

make.centerX.equalTo(((UIView*)views[0]).mas_centerX);

}];

UIView *lastSpace = v0;

for ( int i = 0 ; i < views.count; ++i )

{

UIView *obj = views[i];

UIView *space = spaces[i+1];

[obj mas_makeConstraints:^(MASConstraintMaker *make) {

make.top.equalTo(lastSpace.mas_bottom);

}];

[space mas_makeConstraints:^(MASConstraintMaker *make) {

make.top.equalTo(obj.mas_bottom);

make.centerX.equalTo(obj.mas_centerX);

make.height.equalTo(v0);

}];

lastSpace = space;

}

[lastSpace mas_makeConstraints:^(MASConstraintMaker *make) {

make.bottom.equalTo(ws.mas_bottom);

}];

}

@end

UIView *sv11 = [UIView new];

UIView *sv12 = [UIView new];

UIView *sv13 = [UIView new];

UIView *sv21 = [UIView new];

UIView *sv31 = [UIView new];

sv11.backgroundColor = [UIColor redColor];

sv12.backgroundColor = [UIColor redColor];

sv13.backgroundColor = [UIColor redColor];

sv21.backgroundColor = [UIColor redColor];

sv31.backgroundColor = [UIColor redColor];

[sv addSubview:sv11];

[sv addSubview:sv12];

[sv addSubview:sv13];

[sv addSubview:sv21];

[sv addSubview:sv31];

//给予不同的大小测试效果

[sv11 mas_makeConstraints:^(MASConstraintMaker *make) {

make.centerY.equalTo(@[sv12,sv13]);

make.centerX.equalTo(@[sv21,sv31]);

make.size.mas_equalTo(CGSizeMake(40, 40));

}];

[sv12 mas_makeConstraints:^(MASConstraintMaker *make) {

make.size.mas_equalTo(CGSizeMake(70, 20));

}];

[sv13 mas_makeConstraints:^(MASConstraintMaker *make) {

make.size.mas_equalTo(CGSizeMake(50, 50));

}];

[sv21 mas_makeConstraints:^(MASConstraintMaker *make) {

make.size.mas_equalTo(CGSizeMake(50, 20));

}];

[sv31 mas_makeConstraints:^(MASConstraintMaker *make) {

make.size.mas_equalTo(CGSizeMake(40, 60));

}];

[sv distributeSpacingHorizontallyWith:@[sv11,sv12,sv13]];

[sv distributeSpacingVerticallyWith:@[sv11,sv21,sv31]];

[sv showPlaceHolderWithAllSubviews];

[sv hidePlaceHolder];

使用masonary就行九宫格布局:

-(void)viewDidLoad{
    _topScrollButtonTitleArr=[[NSMutableArray alloc] initWithObjects:@"推荐", @"青春", @"淑女", @"女鞋", @"配饰", @"女包", @"泳装", @"内衣", @"婚礼", @"大码", @"老公" ,@"妈妈", @"爸爸", @"孕妇", @"男孩", @"女孩", @"生活", nil];


    __block MainChoseLabel *nextLabel=nil;
    for (int i=0;i<_topScrollButtonTitleArr.count;i++) {
        MainChoseLabel *mainLabel=[MainChoseLabel new];
        [self.view addSubview:mainLabel];
        mainLabel.backgroundColor=[UIColor redColor];
        mainLabel.text=_topScrollButtonTitleArr[i];
        int col=i%4;
        [mainLabel mas_updateConstraints:^(MASConstraintMaker *make) {
            if(nextLabel){
                if(col==0){
                    make.left.offset(10);
                }else{

                    make.left.equalTo(nextLabel.mas_right).offset(10);
                }
                 make.width.equalTo(nextLabel);

                if(((i+1)%4)==0){
                    make.right.offset(-10);
                    NSLog(@"---");
                }
            }else{
                make.left.offset(10);
            }


            make.height.offset(44);
            make.top.offset((10+44)*(i/4)+30);

        }];

        nextLabel=mainLabel;
    }
}

mas scrollview布局

_bigScrollView=[UIScrollView new];
    _bigScrollView.pagingEnabled=YES;
    _bigScrollView.delegate=self;
    [self.view addSubview:_bigScrollView];

    [_bigScrollView mas_makeConstraints:^(MASConstraintMaker *make) {
//        make.edges.equalTo(self.view).with.insets(UIEdgeInsetsMake(120,5,5,5));
        make.top.top.offset(0);
        make.bottom.offset(0);
        make.left.offset(0);
        make.right.offset(0);
    }];
    _bigScrollView.backgroundColor=[UIColor redColor];
    UIView *container = [UIView new];
    [_bigScrollView addSubview:container];
    container.backgroundColor=[UIColor redColor];
    [container mas_makeConstraints:^(MASConstraintMaker *make) {
        make.edges.equalTo(_bigScrollView);
        make.height.equalTo(_bigScrollView);
    }];

int count = 10;
    UIView *lastView = nil;
    for ( int i = 1 ; i <= count ; ++i )
    {
        UIView *subv = [UIView new];
        [container addSubview:subv];

        subv.backgroundColor = [UIColor colorWithHue:( arc4random() % 256 / 256.0 )
                                          saturation:( arc4random() % 128 / 256.0 ) + 0.5
                                          brightness:( arc4random() % 128 / 256.0 ) + 0.5
                                               alpha:1];
        [subv mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.and.bottom.equalTo(container);
            make.width.mas_equalTo(_bigScrollView);
            if (lastView)
            {
                make.left.mas_equalTo(lastView.mas_right);
            }
            else
            {
                make.left.mas_equalTo(container.mas_left);
            }
        }];

        lastView = subv;
    }
    [container mas_makeConstraints:^(MASConstraintMaker *make) {
        make.right.equalTo(lastView.mas_right);
    }];

Masonry使用详解的更多相关文章

iOS：Masonry练习详解
Masonry练习详解添加约束的方式: 1.通过使用NSLayoutConstraints添加约束到约束数组中,之前必须设置translatesAutoresizingMaskIntoConst ...
Masonry练习详解
添加约束的方式: 1.通过使用NSLayoutConstraints添加约束到约束数组中,之前必须设置translatesAutoresizingMaskIntoConstraints = NO,即取 ...
iOS开发——屏幕适配篇&Masonry详解
Masonry详解前言 MagicNumber -> autoresizingMask -> autolayout 以上是纯手写代码所经历的关于页面布局的三个时期在iphone1-ip ...
AutoLayout详解+手把手实战(转载)
首先说一下这篇博客虽然是标记为原创,但是事实并非本人亲自写出来的,知识点和例子本人花了一天各处查找和整理最终决定写一个汇总的详解,解去各位朋友到处盲目查找的必要,因为不是转载某一个人的内容,故此不标 ...
Linq之旅：Linq入门详解（Linq to Objects）
示例代码下载:Linq之旅:Linq入门详解(Linq to Objects) 本博文详细介绍 .NET 3.5 中引入的重要功能:Language Integrated Query(LINQ,语言集 ...
架构设计：远程调用服务架构设计及zookeeper技术详解（下篇）
一.下篇开头的废话终于开写下篇了,这也是我写远程调用框架的第三篇文章,前两篇都被博客园作为[编辑推荐]的文章,很兴奋哦,嘿嘿~~~~,本人是个很臭美的人,一定得要截图为证: 今天是2014年的第一天 ...
EntityFramework Core 1.1 Add、Attach、Update、Remove方法如何高效使用详解
前言我比较喜欢安静,大概和我喜欢研究和琢磨技术原因相关吧,刚好到了元旦节,这几天可以好好学习下EF Core,同时在项目当中用到EF Core,借此机会给予比较深入的理解,这里我们只讲解和EF 6. ...
Java 字符串格式化详解
Java 字符串格式化详解版权声明:本文为博主原创文章,未经博主允许不得转载. 微博:厉圣杰文中如有纰漏,欢迎大家留言指出. 在 Java 的 String 类中,可以使用 format() 方法 ...
Android Notification 详解（一）——基本操作
Android Notification 详解(一)--基本操作版权声明:本文为博主原创文章,未经博主允许不得转载. 微博:厉圣杰源码:AndroidDemo/Notification 文中如有纰 ...

随机推荐

【JS】学习18天Jquery Moblie的总结笔记。
现在是2013年11月18日1:53分,从1号开始学习JqueryMoblie(简称JQM),这些天遇到的问题,和走的弯路还真不少. 先做个小总结,做了那么多天的一些收获: ●JQM是一个手机网站/轻 ...
MD5加密 js文件
var hexcase = 0; var b64pad = ""; var chrsz = 8; function hex_md5(s){ return binl2hex(core ...
【转】Python BeautifulSoup 中文乱码解决方法
这篇文章主要介绍了Python BeautifulSoup中文乱码问题的2种解决方法,需要的朋友可以参考下解决方法一: 使用python的BeautifulSoup来抓取网页然后输出网页标题,但是输 ...
Mybatis 获取插入记录的自增长ID
1.在Mybatis Mapper文件中添加属性“useGeneratedKeys”和“keyProperty”,其中keyProperty是Java对象的属性名,而不是表格的字段名. <ins ...
第一百一十五节，JavaScript，DOM操作表格
JavaScript,DOM操作表格学习要点: 1.操作表格 DOM在操作生成HTML上,还是比较简明的.不过,由于浏览器总是存在兼容和陷阱,导致最终的操作就不是那么简单方便了.本章主要了解一下DO ...
第八十二节，CSS3过渡效果
CSS3过渡效果学习要点: 1.过渡简介 2.transition-property 3.transition-duration 4.transition-timing-function 5.tra ...
PAT 乙级 1004. 成绩排名
读入n名学生的姓名.学号.成绩,分别输出成绩最高和成绩最低学生的姓名和学号. 输入格式:每个测试输入包含1个测试用例,格式为第1行:正整数n 第2行:第1个学生的姓名学号成绩第3行:第2个学生 ...
struts2防止重复提交的标签
struts2 token 使用说明 --------------------------------------------------------------------------------- ...
PHP验证码程序
[摘自网络,参考学习] <?php/** * vCode(m,n,x,y) m个数字显示大小为n 边宽x 边高y * http://blog.qita.in * 自己改写记录session $ ...
c++的函数模板和类模板
函数模板和普通函数区别结论: 函数模板不允许自动类型转化普通函数能够进行自动类型转换函数模板和普通函数在一起,调用规则: 1 函数模板可以像普通函数一样被重载 2 C++编译器优先考虑普通函数 3 ...

Masonry使用详解

Masonry使用详解的更多相关文章

随机推荐

热门专题