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