Swift实现动态自定义TableView Cell的方案咨询（按需加载不同样式）

这个需求用数据驱动UI的思路来实现最稳妥，既能灵活控制Cell的数量，又能精准匹配每个Cell的样式和对应数据，我之前做类似功能的时候就是这么搞的，非常顺畅。下面一步步来实现：

1. 定义Cell类型枚举与对应数据模型 #

首先，我们用一个枚举来明确区分不同类型的Cell，同时给每个Cell类型绑定对应的数据模型，这样每个Cell需要的内容都能精准传递：

// 定义每个Cell对应的数据模型
struct ImageLabelData {
    let imageName: String
    let title: String
}

struct TwoLabelsData {
    let leftText: String
    let rightText: String
}

struct DayPickerData {
    var selectedDate: Date
}

// 枚举所有Cell类型，关联对应的数据
enum TableCellType {
    case imageWithLabel(data: ImageLabelData)
    case twoLabels(data: TwoLabelsData)
    case dayPicker(data: DayPickerData)
}

2. 定义动态数据源数组 #

在你的ViewController中，声明一个数组作为TableView的数据源，这个数组的元素个数就是Cell的数量，元素类型就是我们刚才定义的TableCellType：

class YourViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {
    @IBOutlet weak var tableView: UITableView!
    
    // 动态数据源，数组长度决定Cell数量，元素决定Cell类型和数据
    var cellTypes: [TableCellType] = []
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // 提前注册Cell（纯代码方式，storyboard绑定的话可以跳过这步）
        tableView.register(FirstTableCell.self, forCellReuseIdentifier: "firstTableCell")
        tableView.register(SecondTableCell.self, forCellReuseIdentifier: "secondTableCell")
        tableView.register(ThirdTableCell.self, forCellReuseIdentifier: "thirdTableCell")
        
        // 初始化数据源（可以根据业务逻辑动态生成）
        setupDynamicCellTypes()
        tableView.reloadData()
    }
    
    // ... 其他代码
}

3. 修改TableView数据源方法 #

现在把原来固定的数据源方法改成动态的，完全依赖cellTypes数组：

// 返回动态的Cell数量
func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { 
    return cellTypes.count 
} 

// 根据数组中的Cell类型，匹配对应的Cell并设置数据
func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { 
    let cellType = cellTypes[indexPath.row]
    
    switch cellType {
    case .imageWithLabel(let data):
        let cell = tableView.dequeueReusableCell(withIdentifier: "firstTableCell") as! FirstTableCell
        // 用数据模型设置Cell UI
        cell.iconImageView.image = UIImage(named: data.imageName)
        cell.titleLabel.text = data.title
        return cell
        
    case .twoLabels(let data):
        let cell = tableView.dequeueReusableCell(withIdentifier: "secondTableCell") as! SecondTableCell
        cell.leftLabel.text = data.leftText
        cell.rightLabel.text = data.rightText
        return cell
        
    case .dayPicker(let data):
        let cell = tableView.dequeueReusableCell(withIdentifier: "thirdTableCell") as! ThirdTableCell
        cell.datePicker.date = data.selectedDate
        // 如果需要处理日期选择事件，可以用闭包回调更新数据
        cell.dateChangedHandler = { [weak self] selectedDate in
            guard let self = self else { return }
            self.cellTypes[indexPath.row] = .dayPicker(data: DayPickerData(selectedDate: selectedDate))
        }
        return cell
    }
}

4. 动态调整Cell数量与类型 #

你可以根据任何业务逻辑来生成cellTypes数组，比如需要显示1个Cell就只加一个元素，需要5个就加5个，完全灵活：

func setupDynamicCellTypes() {
    // 示例1：显示图片标签Cell + 双标签Cell（共2个Cell）
    cellTypes = [
        .imageWithLabel(data: ImageLabelData(imageName: "avatar", title: "个人资料")),
        .twoLabels(data: TwoLabelsData(leftText: "手机号", rightText: "138xxxx8888"))
    ]
    
    // 示例2：显示双标签Cell + 日期选择Cell + 图片标签Cell（共3个Cell）
    // cellTypes = [
    //     .twoLabels(data: TwoLabelsData(leftText: "订单编号", rightText: "202405201001")),
    //     .dayPicker(data: DayPickerData(selectedDate: Date())),
    //     .imageWithLabel(data: ImageLabelData(imageName: "status", title: "已完成"))
    // ]
}

额外注意事项 #

• 如果是用Storyboard/XIB创建的Cell，记得在Storyboard中给每个Cell设置对应的Identifier，和代码里的一致
• Cell内部的交互事件（比如日期选择器变化），建议用闭包的方式回调给ViewController，更新数据源数组中的对应数据，保证数据和UI同步
• 如果后续需要新增Cell类型，只需要在TableCellType枚举中添加新的case，同时补充对应的数据模型和cellForRowAt中的处理逻辑，扩展性非常好

内容的提问来源于stack exchange，提问作者King