牛叉的demo上海恩美路演学无止境

masonry简单的用法

2017-03-22  本文已影响0人  贼海鸥

1.这两天写新的界面,本来想用xib写的,但是,听别人说的,使用xib影响性能,所以,我就开始使用代码写布局.在这里写代码的时候,发现用autolayout太麻烦了,就查了一下,发现masonry好用,就下载了看看.
2.使用的时候很简单,直接把masonry拖进项目中就好了.最终成果如下图:


Simulator Screen Shot 2017年3月22日 14.30.03.png

做法如下:

1.前面的代码就不做介绍了,只是简单的创建tableView

- (void)initTableView {
    UITableView *tableView = [[UITableView alloc] initWithFrame:self.view.bounds style:UITableViewStyleGrouped];
    tableView.delegate = self;
    tableView.dataSource = self;
    [self.view addSubview:tableView];
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return 1;
}
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    return 5;
}
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    return Size(290);
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    YLGroupCell *cell = [YLGroupCell cellWithTableView:tableView];
    return cell;
}

2.自定义tableviewCell

+ (instancetype)cellWithTableView:(UITableView *)tableView {
    static NSString *ID = @"group";
    YLGroupCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
    if (!cell) {
        cell = [[YLGroupCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:ID];
    }
    return cell;
}

- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if (self) {
        [self initialize];
    }
    return self;
}

3.自定义view,添加控件

- (void)initialize {
    // 商品图片
    UIImageView *goodsImage = [[UIImageView alloc] init];
    goodsImage.image = [UIImage imageNamed:@"goods.png"];
    [self.contentView addSubview:goodsImage];
    self.goodsImage = goodsImage;
    
    // 商品名称
    UILabel *goodsName = [[UILabel alloc] init];
    goodsName.textColor = [UIColor colorWithHexString:@"#333333"];
    goodsName.numberOfLines = 2;
    goodsName.font = [UIFont systemFontOfSize:Size(15.f)];
    [self.contentView addSubview:goodsName];
    self.goodsName = goodsName;
    self.goodsName.text = @"百草味 芒果味夹心麻薯210g/袋 台式点心糕点零食特产 送朋友自己吃,都非常好!";
    
    // 商品价格
    UILabel *goodsPrice = [[UILabel alloc] init];
    goodsPrice.textColor = [UIColor colorWithHexString:@"#ba1712"];
    goodsPrice.font = [UIFont systemFontOfSize:(Size(20.f))];
    [self.contentView addSubview:goodsPrice];
    self.goodsPrice = goodsPrice;
    self.goodsPrice.text = @"¥9.50";
    
    // 成团人数
    UILabel *groupNum = [[UILabel alloc] init];
    groupNum.textColor = [UIColor colorWithHexString:@"#999999"];
    groupNum.font = [UIFont systemFontOfSize:Size(14.f)];
    [self.contentView addSubview:groupNum];
    self.groupNum = groupNum;
    self.groupNum.text = @"已有200人成单";
    
    // 几人成单
    UILabel *orderNum = [[UILabel alloc] init];
    orderNum.textColor = [UIColor colorWithHexString:@"#ba1712"];
    orderNum.font = [UIFont systemFontOfSize:(Size(20.f))];
    orderNum.textAlignment = NSTextAlignmentRight;
    [self.contentView addSubview:orderNum];
    self.orderNum = orderNum;
    self.orderNum.text = @"5人拼";
    
    // 立即开团按钮
    UIButton *groupBtn = [UIButton buttonWithType:UIButtonTypeCustom];
    groupBtn.backgroundColor = [UIColor redColor];
    [groupBtn setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
    [groupBtn setTitle:@"立即开拼" forState:UIControlStateNormal];
    groupBtn.titleLabel.font = [UIFont systemFontOfSize:Size(15.f)];
    groupBtn.layer.masksToBounds = YES;
    groupBtn.layer.cornerRadius = 5;
    [self.contentView addSubview:groupBtn];
    self.groupBtn = groupBtn;
}

4.添加约束

- (void)layoutSubviews {
    [super layoutSubviews];
    
    UIView *superview = self.contentView;
    int padding = Size(10);
    
    // 商品图片
    [self.goodsImage mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.top.right.mas_equalTo(0);
        make.height.mas_equalTo(Size(185));
    }];
    
    // 商品名称
    [self.goodsName mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.equalTo(superview.mas_left).offset(padding);
        make.top.equalTo(self.goodsImage.mas_bottom).offset(padding);
        make.right.equalTo(superview.mas_right).offset(-padding);
        make.height.equalTo(@(Size(45)));
    }];
    
    // 价格
    [self.goodsPrice mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.equalTo(superview.mas_left).offset(padding);
        make.centerY.equalTo(self.groupBtn.mas_centerY);
        make.right.equalTo(self.groupNum.mas_left).offset(-padding);
    }];
    
    // 已经成团的人数
    [self.groupNum mas_makeConstraints:^(MASConstraintMaker *make) {
        make.centerY.equalTo(self.groupBtn.mas_centerY);
        make.width.equalTo(@(Size(120)));
    }];
    
    // 按钮
    [self.groupBtn mas_makeConstraints:^(MASConstraintMaker *make) {
        make.top.equalTo(self.goodsName.mas_bottom).offset(padding);
        make.right.equalTo(superview.mas_right).offset(-padding);
        make.width.equalTo(@90);
        make.height.equalTo(@(Size(30)));
    }];
    
    // 需要几人成团
    [self.orderNum mas_makeConstraints:^(MASConstraintMaker *make) {
        make.right.equalTo(self.groupBtn.mas_left).offset(-padding);
        make.centerY.equalTo(self.groupBtn.mas_centerY);
        make.width.equalTo(@(Size(60)));
    }];
}

在这里面用到的文件,如将16进制的颜色字符串转换为颜色UIColor+YLHexString

+ (UIColor *)colorWithHexString:(NSString *)color {
    NSString *cString = [[color stringByTrimmingCharactersInSet:[NSCharacterSet whitespaceAndNewlineCharacterSet]] uppercaseString];
    
    
    
    // String should be 6 or 8 characters
    
    if ([cString length] < 6) {
        
        return [UIColor clearColor];
        
    }
    
    
    
    // strip 0X if it appears
    
    if ([cString hasPrefix:@"0X"])
        
        cString = [cString substringFromIndex:2];
    
    if ([cString hasPrefix:@"#"])
        
        cString = [cString substringFromIndex:1];
    
    if ([cString length] != 6)
        
        return [UIColor clearColor];
    
    
    
    // Separate into r, g, b substrings
    
    NSRange range;
    
    range.location = 0;
    
    range.length = 2;
    
    //r
    
    NSString *rString = [cString substringWithRange:range];
    
    
    
    //g
    
    range.location = 2;
    
    NSString *gString = [cString substringWithRange:range];
    
    
    
    //b
    
    range.location = 4;
    
    NSString *bString = [cString substringWithRange:range];
    
    
    
    // Scan values
    
    unsigned int r, g, b;
    
    [[NSScanner scannerWithString:rString] scanHexInt:&r];
    
    [[NSScanner scannerWithString:gString] scanHexInt:&g];
    
    [[NSScanner scannerWithString:bString] scanHexInt:&b];
    
    return [UIColor colorWithRed:((float) r / 255.0f) green:((float) g / 255.0f) blue:((float) b / 255.0f) alpha:1.0f];
}

还有一个宏定义

#define Size(Float) [UIScreen mainScreen].bounds.size.width/375*Float

最后提醒一句:如果你写的约束条件不对,程序就会崩溃.

上一篇下一篇

猜你喜欢

热点阅读