IOS Masonry自动布局

简介:

之前项目用Frame布局,这个项目登录用了VFL,后来觉得用Masonry,前天布局TableViewCell时用了下 ,觉得还不错。


#import "Masonry.h"
#import "MASViewAttribute.h"

先看效果图:



#import "ReportsCell.h"
//#import "Masonry.h"
#import "YZPUIFormatMacros.h"
#import "Global.h"

static const CGFloat kIconWidth                 = 55.0f;
static const CGFloat kIconHeight                = 55.0f;

@implementation ReportsCell
- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if (self) {
         self.backgroundColor = [UIColor whiteColor];
        
        
        
        UIView *headerView = [[UIView alloc]init];
        headerView.backgroundColor = YZPColorDividingLineOutdide;
        [self addSubview:headerView];
        [headerView mas_makeConstraints:^(MASConstraintMaker *make) {
            make.left.equalTo(@0);
            make.top.equalTo(@0);
            make.width.equalTo(@(MainWidth));
            make.height.equalTo(@(YZPSpaceHSmall));
        }];
        UIView *topLine=[self lineView];
        [headerView addSubview:topLine];
        [topLine mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.equalTo(headerView.top);
            make.left.equalTo(headerView.left);
            make.width.equalTo(headerView.width);
            make.height.equalTo(@0.5);
            
        }];
        
        UIView *bottomLine=[self lineView];
        [headerView addSubview:bottomLine];
        [bottomLine mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.equalTo(headerView.bottom).with.offset(-0.5);
            make.left.equalTo(headerView.left);
            make.width.equalTo(headerView.width);
            make.height.equalTo(@0.5);
            
        }];

        
        _orderIdLabel=[[UILabel alloc]init];
        _orderIdLabel.font = YZPFontSubhead;
        _orderIdLabel.textColor = YZPColorTextSubhead;
        [self addSubview:_orderIdLabel];
        [_orderIdLabel mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.equalTo(headerView.bottom).with.offset(15);
            make.left.equalTo(@10);
            make.width.equalTo(headerView.width);
            make.height.equalTo(@20);
        }];
        
        _orderIconView=[[UIImageView alloc]init];
         [self addSubview:_orderIconView];
        [_orderIconView makeConstraints:^(MASConstraintMaker *make) {
            make.left.equalTo(@15);
            make.top.equalTo(_orderIdLabel.bottom).with.offset(15);
            make.width.equalTo(@(kIconWidth));
            make.height.equalTo(@(kIconHeight));
        }];
        
        
        _orderTitleLabel=[[UILabel alloc]init];
        _orderTitleLabel.font=YZPFontSubhead;
        _orderTitleLabel.textColor=[UIColor colorWithRed:0.141f green:0.141f blue:0.141f alpha:1.00f];
        _orderTitleLabel.numberOfLines=2;
        [self addSubview:_orderTitleLabel];
        [_orderTitleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
            make.left.equalTo(_orderIconView.right).with.offset(15);
            make.top.equalTo(_orderIconView.top).with.offset(2);
            make.width.equalTo(@(MainWidth-170));
            make.height.lessThanOrEqualTo(@(35));
        }];
        
        _orderSpecLabel=[[UILabel alloc]init];
        _orderSpecLabel.font=YZPFontExplain;
        _orderSpecLabel.textColor=[UIColor colorWithRed:0.400f green:0.400f blue:0.400f alpha:1.00f];
        [self addSubview:_orderSpecLabel];
        [_orderSpecLabel mas_makeConstraints:^(MASConstraintMaker *make) {
            make.left.equalTo(_orderTitleLabel.left);
            make.top.equalTo(_orderTitleLabel.bottom).offset(10);
            make.width.equalTo(@(MainWidth-135));
            make.height.lessThanOrEqualTo(@(20));
        }];
        
        _productsCountLabel=[[UILabel alloc]init];
        _productsCountLabel.font=YZPFontContent;
        _productsCountLabel.textAlignment=NSTextAlignmentRight;
        _productsCountLabel.textColor=[UIColor colorWithRed:0.400f green:0.400f blue:0.400f alpha:1.00f];
        [self addSubview:_productsCountLabel];
        [_productsCountLabel mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.equalTo(_orderTitleLabel.top);
            make.left.equalTo(_orderTitleLabel.right).offset(5);
            make.right.equalTo(self.right).with.offset(-15);
            make.height.equalTo(_orderTitleLabel.height);
        }];
        
        UIView *centerLine=[self lineView];
        [self addSubview:centerLine];
        [centerLine mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.equalTo(_orderIconView.bottom).offset(15);
            make.left.equalTo(self);
            make.width.equalTo(self);
            make.height.equalTo(@0.5);
        }];
        
        _userNameLabel=[[UILabel alloc]init];
        _userNameLabel.font=YZPFontExplain;
        _userNameLabel.textColor=YZPColorTextExplain;
//        _userNameLabel.numberOfLines=2;
        _userNameLabel.textAlignment=NSTextAlignmentLeft;
        [self addSubview:_userNameLabel];
        [_userNameLabel mas_makeConstraints:^(MASConstraintMaker *make) {
            make.left.equalTo(self.left).with.offset(15);
            make.top.equalTo(centerLine.bottom).offset(10);
            make.width.lessThanOrEqualTo(@150);
            make.height.lessThanOrEqualTo(@35);
        }];
        
        _userPhoneLabel=[[UILabel alloc]init];
        _userPhoneLabel.font=YZPFontExplain;
        _userPhoneLabel.textColor=YZPColorTextExplain;
        _userPhoneLabel.textAlignment=NSTextAlignmentRight;
        [self addSubview:_userPhoneLabel];
        [_userPhoneLabel mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.equalTo(_userNameLabel.top);
            make.right.equalTo(self.right).with.offset(-15);
            make.height.lessThanOrEqualTo(@35);
            make.width.lessThanOrEqualTo(@150);
            
        }];
        
        _userAddressLabel=[[UILabel alloc]init];
        _userAddressLabel.font=YZPFontExplain;
        _userAddressLabel.textColor=YZPColorTextExplain;
        [self addSubview:_userAddressLabel];
        [_userAddressLabel mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.equalTo(_userNameLabel.bottom).with.offset(10);
            make.left.equalTo(self.left).with.offset(15);
//            make.bottom.equalTo(self.bottom).with.offset(-10);
            make.width.equalTo(self.width);
            make.height.lessThanOrEqualTo(@35);
        }];
    
    }
    return self;
}
-(UIView *)lineView
{
    UIView *line=[[UIView alloc]init];
//    line.backgroundColor=[UIColor redColor];
    line.backgroundColor=[UIColor colorWithRed:0.800f green:0.800f blue:0.800f alpha:1.00f];
    return line;
}

- (void)awakeFromNib {
    // Initialization code
}

- (void)setSelected:(BOOL)selected animated:(BOOL)animated {
    [super setSelected:selected animated:animated];

    // Configure the view for the selected state
}

@end

相关文章
|
iOS开发
iOS开发 - 滑动控制屏幕亮度和系统音量(附加AVAudioPlayer基本用法和Masonry简单使用)
iOS开发 - 滑动控制屏幕亮度和系统音量(附加AVAudioPlayer基本用法和Masonry简单使用)
157 0
iOS开发 - 滑动控制屏幕亮度和系统音量(附加AVAudioPlayer基本用法和Masonry简单使用)
|
iOS开发
iOS - 用Masonry封装的slider,完全支持Masonry的适配
iOS - 用Masonry封装的slider,完全支持Masonry的适配
99 0
|
iOS开发
iOS小技能:自动布局实现兄弟控件N等分且宽高比例是1:N(xib 上实现)
本文为 iOS视图约束专题的第三篇:xib上使用自动布局教程
140 0
|
iOS开发
iOS界面布局之四——使用第三方库Masonry进行autolayout布局(二)
iOS界面布局之四——使用第三方库Masonry进行autolayout布局
179 0
iOS界面布局之四——使用第三方库Masonry进行autolayout布局(二)
|
iOS开发
iOS 使用Masonry的mas_updateConstraints产生冲突的解决办法
iOS 使用Masonry的mas_updateConstraints产生冲突的解决办法
636 0
|
编解码 自然语言处理 数据可视化
iOS开发-自动布局篇:史上最牛的自动布局教学!
本文我们将提到: aotulayout(手码) VFL aotulayout(Xib) Masonry(第三方框架)
iOS开发-自动布局篇:史上最牛的自动布局教学!
|
iOS开发 UED
iOS以动画的形式更新Masonry约束
iOS以动画的形式更新Masonry约束
521 0
iOS以动画的形式更新Masonry约束
|
iOS开发
iOS界面布局之四——使用第三方库Masonry进行autolayout布局(一)
iOS界面布局之四——使用第三方库Masonry进行autolayout布局
153 0
iOS界面布局之四——使用第三方库Masonry进行autolayout布局(一)
|
iOS开发 开发者 程序员