zoukankan      html  css  js  c++  java
  • Masonry的一些等间距布局

    • 控件之间的间距相等,但是控件的宽度是不定的。

      下列的代码:定义间距为10,yellowview的宽度是由redView的宽度计算出来的。

        UIView *redView = [[UIView alloc]init];
        redView.backgroundColor = [UIColor redColor];
        [self.view addSubview:redView];
        [redView mas_makeConstraints:^(MASConstraintMaker *make) {
            make.left.mas_equalTo(ws.view);
            make.top.mas_equalTo(ws.view);
            make.right.mas_equalTo(ws.view);
        }];
        
        NSInteger padding = 10;
        UIView *yellowView1 = [[UIView alloc] init];
        yellowView1.backgroundColor = [UIColor yellowColor];
        [redView addSubview:yellowView1];
        
        UIView *yellowView2 = [[UIView alloc] init];
        yellowView2.backgroundColor = [UIColor yellowColor];
        [redView addSubview:yellowView2];
        
        UIView *yellowView3 = [[UIView alloc] init];
        yellowView3.backgroundColor = [UIColor yellowColor];
        [redView addSubview:yellowView3];
        
        [@[yellowView1,yellowView2,yellowView3] mas_distributeViewsAlongAxis:MASAxisTypeHorizontal withFixedSpacing:padding leadSpacing:padding tailSpacing:padding];
        
        [@[yellowView1,yellowView2,yellowView3] mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.mas_equalTo(redView).offset(padding);
            make.height.mas_equalTo(yellowView1.mas_width);
            make.bottom.mas_equalTo(redView).offset(-padding);
        }];
    • 控件的宽度是一定的,但是控件之间的间距是不定的。

      下列的代码:定义控件的宽度为22,控件之间的间距是由redView的宽度计算出来的。

        UIView *redView = [[UIView alloc]init];
        redView.backgroundColor = [UIColor redColor];
        [self.view addSubview:redView];
        [redView mas_makeConstraints:^(MASConstraintMaker *make) {
            make.left.mas_equalTo(ws.view);
            make.top.mas_equalTo(ws.view);
            make.right.mas_equalTo(ws.view);
        }];
        
        UIView *yellowView1 = [[UIView alloc] init];
        yellowView1.backgroundColor = [UIColor yellowColor];
        [redView addSubview:yellowView1];
        
        UIView *yellowView2 = [[UIView alloc] init];
        yellowView2.backgroundColor = [UIColor yellowColor];
        [redView addSubview:yellowView2];
        
        UIView *yellowView3 = [[UIView alloc] init];
        yellowView3.backgroundColor = [UIColor yellowColor];
        [redView addSubview:yellowView3];
        
        //控件的宽度
        CGFloat viewW = 22;
        CGFloat padding = (SCREENWIDTH - 3*viewW) * 1.0 / 4;
        
        [@[yellowView1,yellowView2,yellowView3] mas_distributeViewsAlongAxis:MASAxisTypeHorizontal withFixedItemLength:viewW leadSpacing:padding tailSpacing:padding];
        
        [@[yellowView1,yellowView2,yellowView3] mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.mas_equalTo(redView).offset(padding);
            make.size.mas_equalTo(viewW);
            make.bottom.mas_equalTo(redView).offset(-padding);
        }];
  • 相关阅读:
    Codeforces Round #273 (Div. 2) B . Random Teams 贪心
    Codeforces Round #250 (Div. 2)B. The Child and Set 暴力
    Codeforces Round #250 (Div. 1) B. The Child and Zoo 并查集
    微信小程序从零开始开发步骤(二)创建小程序页面
    微信小程序从零开始开发步骤(二)创建小程序页面
    微信小程序从零开始开发步骤(一)搭建开发环境
    微信小程序从零开始开发步骤(一)搭建开发环境
    七个帮助你处理Web页面层布局的jQuery插件
    前端切图:CSS实现隐藏滚动条同时又可以滚动
    前端切图:CSS实现隐藏滚动条同时又可以滚动
  • 原文地址:https://www.cnblogs.com/iOSDeng/p/6121380.html
Copyright © 2011-2022 走看看