上篇:谈谈iOS开发如何写个人中心这类页面--静态tableView页面的编写(上)
对比上一方案,本方案有了下面几点改进:
虽然该方案对比 UIScrollView 方案有了不少改进,但是仍然有些问题:
针对上面方案的缺点,本文提出了一种新的方案,可以消除上述方案的缺点,下图简单展示了本方案的基本思想:
(1) 页面中的每个 Cell 都需要继承自 MCTableBaseCell,然后在子类中添加自定义属性和方法,如 MCDemoCell1 的定义如下:
@interface MCDemoCell1 : MCTableBaseCell
@property (nonatomic, strong) UIImageView *headerIconImageView;
@property (nonatomic, strong) UILabel *contentLabel;
@end
(2) 为该页面定义一个继承自 MCTableBaseDescribeData 的 DescribeData 类,该类中需要添加页面中所有 Cell 所需的数据。
例如,上面的 MCDemoCell1 需要一个 image 和 content 字符串,那么自定义的 DescribeData 中也应该包含有这两个信息。 demo 中的 DescribeData 需要包含有 MCDemoCell1, MCDemoCell2, MCDemoCell3 所需的数据,所以定义如下:
@interface MCDemoTableDescribeData : MCTableBaseDescribeData
@property (nonatomic, copy) NSString *title;
@property (nonatomic, copy) NSString *subTitle;
@property (nonatomic, assign) BOOL switchStatus;
@property (nonatomic, copy) NSString *indicateImageName;
@property (nonatomic, copy) NSString *content;
@property (nonatomic, copy) NSString *headerIconName;
@property (nonatomic, weak) id<MCDemoCell2Delegate> cell2Delegate;
@end
(3) 有了 MCDemoTableDescribeData 的定义,我们需要为 MCDemoCell 的实现重写 setDescribeData: 方法,在该方法中, 我们需要将 describeData 中与 MCDemoCell 有关的数据赋值给 MCDemoCell,代码如下:
- (void)setDescribeData:(MCTableBaseDescribeData *)describeData {
if ([describeData isKindOfClass:MCDemoTableDescribeData.class]) {
MCDemoTableDescribeData *data = (MCDemoTableDescribeData *)describeData;
_headerIconImageView.image = [UIImage imageNamed:data.headerIconName];
_contentLabel.text = data.content;
}
}
此外,我们需要为 MCDemoCell 重写 sizeThatFits: 方法,在该方法中,我们可以根据 MCDemoCell 的数据动态计算出 Cell 高度,该方法会在后面获取 Cell 高度时调用。
- (CGSize)sizeThatFits:(CGSize)size {
CGFloat height;
// 根据 Cell 的实际内容计算出 Cell 的高度。
//例如根据 contentLabel 的内容,计算出 Cell 需要展示 content 所需的高度。
return CGSizeMake(0, height);
}
(4) 下面就可以编写 Controller 了。首先要定义一个属性,用来保存 tableView 所有 Cell 需要的 DescribeData:
@property (nonatomic, strong) NSArray<NSArray<MCDemoTableDescribeData *> *> *cellDescriptionDatas;
(5) 然后创建 tableView 并配置 tableView 的 delegate、dataSource 等属性:
- (void)loadSubviews {
_tableView = [[UITableView alloc] initWithFrame:CGRectZero style:UITableViewStylePlain];
_tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
_tableView.backgroundColor = [UIColor lightTextColor];
_tableView.delegate = self;
_tableView.dataSource = self;
[self.view addSubview:_tableView];
// register cell class, use UITableView+MCRegisterCellClass
[_tableView registerCellClasses:@[[MCDemoCell1 class],
[MCDemoCell2 class],
[MCDemoCell3 class]]];
}
注意: 最后一句代码使用到的方法是本文定义的 UITableView+MCRegisterCellClass 这个 category 提供的,是为了方便注册 Cell 的 Class 和 dequeue 出相应的 Cell,详细请看 demo 中的代码。
本文来自网易实践者社区,经作者白天宇授权发布。
本文未结束,敬请期待下篇。