iOS中如何实现Table View底部固定单元格（仿HQ Trivia排行榜）

嘿，刚好我之前做过类似的需求，给你分享几个能完美实现HQ Trivia那种底部固定单元格的方法，都是经过实践验证的👇

这是系统原生支持的方案，专门用来处理底部固定视图的场景，完全符合你要的效果——内容不足一屏时跟着内容走到底部，内容超过一屏时滚动到底部就固定在屏幕下方。

实现步骤： #

• 先创建你想要的固定单元格视图（可以直接用UITableViewCell，也可以自定义UIView），设置好样式、文字、颜色这些。
• 把这个视图直接赋值给tableView.tableFooterView就行，要是需要固定高度，给视图设置frame或者用AutoLayout约束都可以。

代码示例： #

override func viewDidLoad() {
    super.viewDidLoad()
    
    // 创建底部固定单元格
    let fixedFooterCell = UITableViewCell(style: .default, reuseIdentifier: nil)
    fixedFooterCell.textLabel?.text = "排行榜底部固定栏"
    fixedFooterCell.backgroundColor = .systemGray5
    // 这里可以加更多自定义元素，比如按钮、图标、进度条等
    
    // 给footer设置固定高度（也可以用AutoLayout）
    fixedFooterCell.frame = CGRect(x: 0, y: 0, width: tableView.bounds.width, height: 60)
    
    // 赋值给tableFooterView
    tableView.tableFooterView = fixedFooterCell
}

如果你的列表是分Section的，想要给最后一个Section单独加固定底部单元格，这个方法就很合适。它的效果和tableFooterView类似，但可以更灵活地控制哪个Section显示footer。

实现步骤： #

• 实现UITableViewDelegate的两个方法：heightForFooterInSection设置footer高度，viewForFooterInSection返回自定义的footer视图。
• 只给最后一个Section设置非零高度，其他Section设为0就行。

代码示例： #

// 设置每个Section的footer高度
func tableView(_ tableView: UITableView, heightForFooterInSection section: Int) -> CGFloat {
    // 只给最后一个Section显示footer
    return section == tableView.numberOfSections - 1 ? 60 : 0
}

// 返回自定义footer视图
func tableView(_ tableView: UITableView, viewForFooterInSection section: Int) -> UIView? {
    guard section == tableView.numberOfSections - 1 else { return nil }
    
    let footerView = UIView()
    footerView.backgroundColor = .systemGray5
    
    // 添加自定义内容，比如标签
    let titleLabel = UILabel()
    titleLabel.text = "底部固定单元格"
    titleLabel.translatesAutoresizingMaskIntoConstraints = false
    footerView.addSubview(titleLabel)
    
    // 用AutoLayout居中标签
    NSLayoutConstraint.activate([
        titleLabel.centerXAnchor.constraint(equalTo: footerView.centerXAnchor),
        titleLabel.centerYAnchor.constraint(equalTo: footerView.centerYAnchor)
    ])
    
    return footerView
}

如果上面两种方法满足不了你更复杂的需求（比如固定视图需要覆盖在Table View上方，或者和Table View有特殊交互），可以用这种“容器+Table View+固定视图”的组合方式，完全自定义位置和层级。

实现步骤： #

• 创建一个容器视图，把Table View和固定底部视图都添加到这个容器里。
• 给Table View设置约束：top、leading、trailing和容器对齐，bottom和固定视图的top对齐。
• 给固定视图设置约束：bottom、leading、trailing和容器对齐，高度固定，这样它就永远钉在屏幕底部。

代码示例： #

override func viewDidLoad() {
    super.viewDidLoad()
    
    // 创建容器视图
    let containerView = UIView()
    containerView.translatesAutoresizingMaskIntoConstraints = false
    view.addSubview(containerView)
    
    // 创建Table View
    let tableView = UITableView()
    tableView.translatesAutoresizingMaskIntoConstraints = false
    containerView.addSubview(tableView)
    
    // 创建底部固定视图
    let fixedBottomView = UITableViewCell(style: .default, reuseIdentifier: nil)
    fixedBottomView.textLabel?.text = "固定在底部的单元格"
    fixedBottomView.backgroundColor = .systemGray5
    fixedBottomView.translatesAutoresizingMaskIntoConstraints = false
    containerView.addSubview(fixedBottomView)
    
    // 设置所有约束
    NSLayoutConstraint.activate([
        // 容器视图铺满安全区域
        containerView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor),
        containerView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
        containerView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
        containerView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor),
        
        // Table View在容器内，底部挨着固定视图
        tableView.topAnchor.constraint(equalTo: containerView.topAnchor),
        tableView.leadingAnchor.constraint(equalTo: containerView.leadingAnchor),
        tableView.trailingAnchor.constraint(equalTo: containerView.trailingAnchor),
        tableView.bottomAnchor.constraint(equalTo: fixedBottomView.topAnchor),
        
        // 固定视图钉在容器底部
        fixedBottomView.leadingAnchor.constraint(equalTo: containerView.leadingAnchor),
        fixedBottomView.trailingAnchor.constraint(equalTo: containerView.trailingAnchor),
        fixedBottomView.bottomAnchor.constraint(equalTo: containerView.bottomAnchor),
        fixedBottomView.heightAnchor.constraint(equalToConstant: 60)
    ])
    
    // 给Table View配置数据源和代理
    tableView.dataSource = self
    tableView.register(UITableViewCell.self, forCellReuseIdentifier: "defaultCell")
}

• 用tableFooterView的时候，不要实现heightForFooterInSection，否则可能会干扰footer的正常显示。
• 如果固定单元格需要点击事件，直接给视图加tap手势，或者给里面的按钮加addTarget就行，和普通视图的交互逻辑完全一样。
• 尽量用AutoLayout代替固定frame，这样能更好地适配不同尺寸的设备，避免在iPad或者大屏iPhone上出现布局错乱。

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