autolayout - sizeClass - Masonry - 3

原创 2015年07月07日 10:31:16

还是接着参考这位大牛的好文章:

http://www.cocoachina.com/ios/20141219/10702.html

来看到最后的一个例子:

@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];

结果如下:


拿原贴主的截图数据:


相信初学者肯定对上面的代码有点不理解。我稍作一点处理如下;

    UIView* sv11 = [UIView new];
    UIView* sv22 = [UIView new];
    UIView* sv33 = [UIView new];
    
    sv11.backgroundColor = [UIColor redColor];
    sv22.backgroundColor = [UIColor redColor];
    sv33.backgroundColor = [UIColor redColor];
    
    [sv addSubview:sv11];
    [sv addSubview:sv22];
    [sv addSubview:sv33];
    
    [sv11 mas_makeConstraints:^(MASConstraintMaker *make) {
        make.size.mas_equalTo(CGSizeMake(40, 40));
    }];
    
    [sv22 mas_makeConstraints:^(MASConstraintMaker *make) {
        make.size.mas_equalTo(CGSizeMake(40, 40));

    }];
    
    [sv33 mas_makeConstraints:^(MASConstraintMaker *make) {
        make.size.mas_equalTo(CGSizeMake(40, 40));

    }];
    
    [sv distributeSpacingHorizontallyWith:@[sv11, sv22, sv33]];
结果如下:


很显然如果不添加垂直的函数方法,会发现,水平上的等距效果还在,这个时候我们在category里面添加一句:

        [v setBackgroundColor:[UIColor greenColor]];

看看结果:


很显然就明白了,作者其实就是取巧,非常好用,例如,如果一个屏幕要等距排列3个view,则我们就存在了4个间距,所以为什么spaces的量度要是views.count+1,我们可以将这4个间距都看成分别是一个view,就是代码处理中的:

    for ( int i = 0 ; i < views.count+1 ; ++i )
    {
        UIView *v = [UIView new];
        [v setBackgroundColor:[UIColor greenColor]];
        [spaces addObject:v];
        [self addSubview:v];
        
        [v mas_makeConstraints:^(MASConstraintMaker *make) {
            make.width.equalTo(v.mas_height);
        }];
    }
并稍作处理使它们等宽高, 同理与垂直方向的操作, 这段代码就是好在简单的几个循环就可以完成, 以后照着这种模式去写就不用担心写死的问题了!代码看越多就觉得数据结构越重要,很多编程思想就是相仿于数据结构的那本书出现的一些程序处理。




版权声明:本文为博主原创文章,未经博主允许不得转载。

autolayout - sizeClass - 3

autolayout - sizeClass - 3

SizeClass 和AutoLayout教程3

原文地址:http://www.jianshu.com/p/3d6b2341fd83 (这个系列的文章都来自《iOS8 by tutorials》的第一章,大部分直接翻译,会加入我自己的解释和理...
  • hmxhh
  • hmxhh
  • 2014年12月08日 17:08
  • 338

autolayout - sizeClass - 1

autolayout - sizeClass - 1

Autolayout - 2 (sizeClass)

一、新特性Size Class介绍 随着iOS8系统的发布,一个全新的页面UI布局概念出现,这个新特性将颠覆包括iOS7及之前版本的UI布局方式,这个新特性就是Size Class。Size...

SizeClass和AutoLayout教程1

原文地址:http://www.jianshu.com/p/bd071f9a558d 讲SizeClass之前,先讲Layout,因为SizeClass 本质上就是AutoLayout的升级版。...
  • hmxhh
  • hmxhh
  • 2014年12月05日 15:51
  • 575

SizeClass与AutoLayout(初级篇)

SizeClass与AutoLayout(初级篇) 介绍sizeclass与autolayout这对儿好基友的基本使用方法...
  • wliu6
  • wliu6
  • 2015年01月10日 22:51
  • 688

xcode6中自动布局autolayout和sizeclass的使用

一、关于自动布局(Autolayout) 在Xcode中,自动布局看似是一个很复杂的系统,在真正使用它之前,我也是这么认为的,不过事实并非如此。 我们知道,一款iOS应用,其主要UI组件是由一个个相...

Xcode6中自动布局autolayout和sizeclass的使用

一、关于自动布局(Autolayout) 在Xcode中,自动布局看似是一个很复杂的系统,在真正使用它之前,我也是这么认为的,不过事实并非如此。   我们知道,一款iOS应用,其主要UI组件是由...

一篇文章详解iOS之AutoResizing、AutoLayout、sizeClass来龙去脉

前言 iPhone自诞生以来,随着其屏幕尺寸不断的多样化,屏幕适配的技术一直在发展更新。目前,iOS系统版本已经更新到9.3,XCode的最新版本已经是7.3,仅iPhone历史产品的尺寸就已经...
  • fishmai
  • fishmai
  • 2017年05月29日 20:54
  • 608
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:autolayout - sizeClass - Masonry - 3
举报原因:
原因补充:

(最多只允许输入30个字)