TemplateScrolls 提供了两个视图类 TTTableView 和 TTCollectionView,支持快速搭建 TableView 和 CollectionView.
它的便捷之处有
- 省去了所有的 dataSource 和 delegate 的代理方法,只需要少量的列表配置。
- 所得即所见,只要配置发生变化,列表会自动进行局部刷新。
- 不用关心视图重用 (identifier) 的细节
- Cell、Header、Footer 统一的代码风格
以 TTTableView 为例
1. 创建自定义 Cell、Header、Footer
继承 TTTableViewCell、 TTTableReusableView,创建自定义的可复用视图类
@interface TTMessageCell : TTTableViewCell ...
@implementation TTMessageCell
// - init {} // 不需要实现 init 方法
// 在这里搭建你的 UI 视图层级结构
- (void)makeSubview { }
// 在这里为所有子视图创建约束
- (void)makeConstraint { }
// 使用 data 填充到视图上
- (void)refreshView:(TTMessageModel *)data { }
@end
// 与 Cell 相同,完全一样的代码结构
@interface TTMessageHeader : TTTableReusableView ...
@implementation TTMessageHeader
- (void)makeSubview { }
- (void)makeConstraint { }
- (void)refreshView:(NSString *)data { }
@end
2. 配置列表
Cell 和 Header/Footer 的配置分别是 TTCellTemplate,TTReusableViewTemplate,它们都属于 View 的配置,有两个重要的属性 viewClass
和 data
,表示指定视图的类型,以及要展示的数据
Section 的配置是 TTSectionTemplate,主要是存储着 cells、header、footer 的配置
TTSectionTemplate *section = [TTSectionTemplate new];
section.header.viewClass = [TTMessageHeader class];
section.header.data = @"2021-02-09";
// section.footer // 没有 footer 不需要配置
[dataArray enumerateObjectsUsingBlock:^(TTMessageModel *data, NSUInteger idx, BOOL *stop) {
TTCellTemplate *cell = [TTCellTemplate new];
cell.viewClass = [TTMessageCell class];
cell.data = data;
// 如果 cell 可以用约束自动撑开,这里可以不指定高度
// cell.height = custom compute height with data
[section.cells addObject:cell];
}];
3. 装入配置到 sections
TTTableView 的属性 sections
,是一个数组,只需要将配置好的 sections 添加到里面即可
@property (nonatomic, readonly) TTTableView *tableView;
TTSectionTemplate *section = ......
[self.tableView.sections addObject:section];
如此, TableView 就快速的渲染出来了
4. CollectionView
类似的,如果你要开发一个CollectionView,也是一样的步骤
- 继承 TTCollectionViewCell, TTCollectionReusableView
- 配置 TTCellTemplate, TTSectionTemplate
- 对 TTCollectionView.sections 进行添加、替换、插入等操作
Demo 见 这里