想要实现
这种样式的cell ,即与边界有一定距离, 然后又需要cell的高度可以根据标题自适应,所以选择了sdautolayout自动布局框架。
生成一个继承自UITableViewCell的类,首先定义一个白色的背景bgview,然后依次定义四个label,粮给UIimageview
定义组件的约束时,首先定义 bgview ,就遇到了问题 ,因为高度是根据cell内部的label而自适应的,所以卡在了高度的设置上,首先选择的是只写了上左下边界距离,不设置heightis ( );调试的时候发现tableview的显示一直有问题,最后为bgview的约束补上了.autoHeightRatio ( 0 ) ; 之后,发现显示正确了。
定义组件的位置时最后一个组件是时间文本dateText,设置好了四个约束,然后设置dateText与整个bgview的距离, 所以加上了 [bgView setupAutoHeightWithBottomView:dateText bottomMargin:5];
还要设置整个bgview与cell的距离,所以加上 [self setupAutoHeightWithBottomView:bgView bottomMargin:5];
cell部分的代码如下。
- (void)createUI {
self.backgroundColor = [UIColor clearColor];
// 背景
bgView = [[UIView alloc] init];
bgView.backgroundColor = [UIColor whiteColor];
[bgView.layer setCornerRadius:4.0];
[self.contentView addSubview:bgView];
// 标题
titleLabel = [[UILabel alloc] init];
titleLabel.numberOfLines = 0;
titleLabel.textColor = kUIColorFromRGB(0xD09055);
titleLabel.font = [UIFont systemFontOfSize:18];
[bgView addSubview:titleLabel];
// 创建人图标
UIImageView *authorImg = [[UIImageView alloc] init];
authorImg.image = [UIImage imageNamed:@"ic_survey_detail_author"];
[bgView addSubview:authorImg];
// 创建人标题
UILabel *authorTitle = [[UILabel alloc] init];
authorTitle.text = @"创建人";
authorTitle.textAlignment = NSTextAlignmentLeft;
authorTitle.textColor = darkTextColor;
authorTitle.font = [UIFont systemFontOfSize:14];
[bgView addSubview:authorTitle];
// 创建人标题
authorText = [[UILabel alloc] init];
authorText.textAlignment = NSTextAlignmentLeft;
authorText.textColor = darkTextColor;
authorText.font = [UIFont systemFontOfSize:14];
[bgView addSubview:authorText];
// 创建时间图标
UIImageView *dateImg = [[UIImageView alloc] init];
dateImg.image = [UIImage imageNamed:@"ic_survey_detail_date"];
[bgView addSubview:dateImg];
// 创建时间标题
UILabel *dateTitle = [[UILabel alloc] init];
dateTitle.text = @"创建时间";
dateTitle.textAlignment = NSTextAlignmentRight;
dateTitle.textColor = darkTextColor;
dateTitle.font = [UIFont systemFontOfSize:14];
[bgView addSubview:dateTitle];
// 创建时间标题
dateText = [[UILabel alloc] init];
dateText.textColor = darkTextColor;
dateText.textAlignment = NSTextAlignmentLeft;
dateText.font = [UIFont systemFontOfSize:14];
[bgView addSubview:dateText];
bgView.sd_layout
.leftSpaceToView(self.contentView, 10)
.rightSpaceToView(self.contentView, 10)
.topSpaceToView(self.contentView, 5)
.autoHeightRatio(0);
titleLabel.sd_layout
.leftSpaceToView(bgView, 10)
.rightSpaceToView(bgView, 10)
.topSpaceToView(bgView, 5)
.autoHeightRatio(0);
authorImg.sd_layout
.leftSpaceToView(bgView, 10)
.topSpaceToView(titleLabel, 10)
.widthIs(14)
.heightIs(14);
authorTitle.sd_layout
.leftSpaceToView(authorImg, 8)
.widthIs(SCREENWIDTH/2 - 40)
.topSpaceToView(titleLabel, 10)
.heightIs(14);
authorText.sd_layout
.leftSpaceToView(bgView, 12)
.topSpaceToView(authorTitle, 5)
.widthIs(SCREENWIDTH/2 - 20)
.heightIs(14);
dateTitle.sd_layout
.rightSpaceToView(bgView, 10)
.topSpaceToView(titleLabel, 10)
.widthIs(67)
.heightIs(14);
dateImg.sd_layout
.topSpaceToView(titleLabel, 10)
.rightSpaceToView(dateTitle, 0)
.widthIs(14)
.heightIs(14);
dateText.sd_layout
.leftEqualToView(dateImg)
.widthIs(80)
.topSpaceToView(dateTitle, 5)
.heightIs(14);
[bgView setupAutoHeightWithBottomView:dateText bottomMargin:5];
[self setupAutoHeightWithBottomView:bgView bottomMargin:5];
}