如何优雅的对UITableView进行解耦

2018-03-18 本文已影响1722人 XuQibin

在本文之前笔者已经将相关代码开源到 GitHub 上并添加了 CocoaPods 的支持，欢迎大家下载查看：STDTableView，下面进入正题：

首先说一下本篇文章的背景，公司的一个项目中需要用到一个动态编辑的表单页面，样式如下图所示：

动态编辑表单

该表单页面在项目中多处应用，且部分页面需要支持定制，经过分析后大概可总结出以下的几点要求：

cell 需支持键盘输入，并需要对输入做合法性验证；
cell 需要可以指定输入的数据类型及提交时的数据类型；
cell 需支持各类弹出式选择器（时间选择、条目选择、联动选择）；
cell 需支持push到下个界面进行负责数据的选择；
表单需要支持在编辑时动态添加或者删除条目；
表单需要支持指定必填项与非必填项；
表单需要支持指定不可编辑的条目；
表单需要支持通过网络加载回的数据进行初始化；
...

以往项目中的 tableView 结构已经无法满足这种类型的需求了，特别是对 cell 内部事件处理，因而才萌生了对 UITableView 进行封装的念头，STDTableView 也是在这种情况下诞生的，笔者基于这个库完美的实现了上述的需求，并全线推行到公司的项目中。下面来聊一下 STDTableView 的实现思路：

UITableView 是 iOS 开发中最常用的组件之一,关于它的接口及基本使用方法相信大家也都已经烂熟于胸，本文主要探讨的是如何在业务爆炸的情况下避免 viewController 变得臃肿不堪，以及如何更优雅简洁的实现 UITableView 的相关调用。

首先，先简单的列举一下日常开发中经常碰到的几种情况：

一个列表有多个 section，每个 section 中的 cell 结构不同；
一个列表只有一个 section，但是 section 中存在多种 cell 结构；
需要在 viewController 中响应 cell 内部的点击事件；

其中，针对上面的1、2两点，如果不注意的话经常会写出如下风格的代码：

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    UITableViewCell *cell = nil;

    if (indexPath.section == 0) {
        cell = xxx;
    } else if (indexPath.section == 1) {
        cell = xxx;
    } else {
        cell = xxx;
    }

    return cell;
}

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    if (indexPath.section == 0) {
        xxx
    } else if (indexPath.section == 1) {
        xxx
    } else {
        xxx
    }
}

相信大家在刚开始写 tableView 的时候对上面的代码都深有体会，单一类型的 cell 还好，但是如果后面需要增加不同的类型，或者根据不同的 row 跳转到不同的页面的话，这坨代码会慢慢的庞大起来，最后可能自己看着都不想维护！

那么有什么方式来优化这个问题吗？我们不妨先从以下几点着手：

创建一个 dataAdapter 类，将 cell 的数据及基本配置如：cellReuseIdentifier、cellHeight、cellType 等保存起来做为cell的数据源；
将 cell 的数据配置及选中回调封装在自身，然后通过一个如 loadContent 以及 selectedEvent 的方法在 cellForRowAtIndexPath 和 didSelectRowAtIndexPath 中调用；
将 dataSource 从 viewController 中剥离；

于是我们的代码便可以变成如下的形式，viewController中也不需要每次都重新写数据源方法：

//独立的数据源
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    STDTableViewItem *item = [self itemAtIndexPath:indexPath];
    
    STDTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:item.cellReuseIdentifier];
        
    [cell loadContent];
    
    return cell;
}

// viewController 中的 delegate 回调
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    [(STDTableViewCell *)[tableView cellForRowAtIndexPath:indexPath] selectedEvent];
}

然而这个方式也存在一个问题，那就是 dataAdapter 的创建方式，一般我们请求回来的数据都是直接解析成 model 数组，如果在 viewController 中直接进行显式的转换无疑也是极不友好的，这就需要我们继续做一层封装了！

自此我们已经可以较好的解决前面提出的1、2两点问题，针对问题 '3. 需要在 viewController 中响应 Cell 内部的点击事件'，笔者做法如下：

为 cell 新增一个 delegate 方法 'tableViewCell:event:';
在 cell 初始化的时候设置 viewController 为 delegate，并在 viewController 中实现相关的协议方法；
在 cell 的对应事件中执行类似 '[self.delegate tableViewCell:self event:@(STDEditEventInputFinish)]' 的操作告诉 viewController 发生了什么；

根据这个思路进行封装，我们已经可以较好的实现UITableView的解耦及调用简化，接下去就是再做一些结构上的优化了！具体实现大家可以下载 STDTableView 查看，里面附有相关的demo，支持CocoaPods安装，欢迎大家下载查看，有什么问题的话欢迎一起讨论或者提issue ！

如何优雅的对UITableView进行解耦

猜你喜欢

热点阅读