如何通过拖拽重排UITableView分组？行模拟表头实现方案咨询

嘿，刚好我之前做过类似的需求，给你分享一套可行的实现思路和关键代码片段吧！

咱们的核心目标是：用行模拟分组表头，拖拽该表头时隐藏对应子行，仅保留所有模拟表头行完成重排，拖拽结束后恢复子行显示。下面分几个关键环节拆解：

1. 先理清楚数据结构 #

首先要把分组和子项数据分层管理，这样方便后续调整分组顺序，也能轻松控制子行的显示隐藏：

// 分组模型：包含标题、子项列表，以及控制子项是否展开的状态
struct GroupModel {
    let title: String
    var items: [ItemModel]
    var isExpanded: Bool = true // 拖拽时会把这个值设为false，隐藏子行
}

// 子项模型
struct ItemModel {
    let content: String
}

// 数据源数组，存所有分组
var groups: [GroupModel] = []

2. 适配UITableView的数据源逻辑 #

在数据源方法里，要根据分组的isExpanded状态来决定是否渲染子行。这里我们把每个模拟表头作为对应分组的第0行，子行跟在后面：

override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    let currentGroup = groups[section]
    // 模拟表头占1行，子行根据展开状态决定是否显示
    return 1 + (currentGroup.isExpanded ? currentGroup.items.count : 0)
}

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let currentGroup = groups[indexPath.section]
    
    if indexPath.row == 0 {
        // 渲染模拟分组表头的Cell，添加右侧的拖拽标记按钮
        let headerCell = tableView.dequeueReusableCell(withIdentifier: "HeaderCell", for: indexPath) as! HeaderCell
        headerCell.titleLabel.text = currentGroup.title
        // 给拖拽按钮绑定点击事件，触发拖拽流程
        headerCell.dragHandleButton.addTarget(self, action: #selector(startGroupDrag(_:)), for: .touchUpInside)
        return headerCell
    } else {
        // 渲染子项Cell
        let itemCell = tableView.dequeueReusableCell(withIdentifier: "ItemCell", for: indexPath) as! ItemCell
        let targetItem = currentGroup.items[indexPath.row - 1]
        itemCell.contentLabel.text = targetItem.content
        return itemCell
    }
}

3. 拖拽开始：隐藏所有子行 #

当用户点击模拟表头的拖拽标记时，先把所有分组的isExpanded设为false，刷新表格后就只剩模拟表头行，再触发拖拽：

@objc func startGroupDrag(_ sender: UIButton) {
    // 找到点击的表头对应的分组索引
    guard let headerCell = sender.superview?.superview as? UITableViewCell,
          let indexPath = tableView.indexPath(for: headerCell) else { return }
    
    // 隐藏所有子行
    for i in 0..<groups.count {
        groups[i].isExpanded = false
    }
    tableView.reloadData()
    
    // 启动交互式拖拽
    tableView.beginInteractiveMovementForRow(at: indexPath)
}

4. 实现拖拽重排的核心逻辑 #

通过UITableView的拖拽代理方法，处理分组顺序的调整，以及拖拽结束后的恢复工作：

override func tableView(_ tableView: UITableView, canMoveRowAt indexPath: IndexPath) -> Bool {
    // 只有模拟表头行允许被拖拽
    return indexPath.row == 0
}

override func tableView(_ tableView: UITableView, moveRowAt sourceIndexPath: IndexPath, to destinationIndexPath: IndexPath) {
    // 调整分组数组的顺序（因为只有表头行，直接操作section对应的分组即可）
    let movedGroup = groups.remove(at: sourceIndexPath.section)
    groups.insert(movedGroup, at: destinationIndexPath.section)
}

override func tableView(_ tableView: UITableView, endInteractiveMovementForRowAt indexPath: IndexPath?, cancelled: Bool) {
    // 拖拽结束后，恢复所有分组的展开状态（如果需要记忆之前的展开状态，可以在拖拽前先记录下来）
    for i in 0..<groups.count {
        groups[i].isExpanded = true
    }
    tableView.reloadData()
}

5. 体验优化小细节 #

• 拖拽过程中，可以给正在被拖拽的表头Cell添加视觉反馈（比如高亮背景色）；
• 如果需要保留用户之前的展开状态，在拖拽开始前可以先遍历groups，把每个分组的isExpanded值存到临时数组里，拖拽结束后再逐一恢复；
• 可以给模拟表头Cell添加长按手势作为补充触发方式，提升操作便捷性。

这样一套流程走下来，就能完美实现你想要的：点击拖拽标记→子行隐藏→拖拽调整分组顺序→结束拖拽→子行恢复显示的完整功能啦！

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