点击含UIPickerView的UITableViewCell无法修改高度求解决

这问题我之前做项目时也踩过坑！核心原因就是UIPickerView会优先捕获点击事件，导致你的UITableViewCell根本收不到点击回调，自然没法触发heightForRow来修改单元格高度。下面给你两个实用的解决思路，附代码示例：

方案一：动态控制UIPickerView的交互状态 #

这个方案最直接，思路是默认禁用Picker的交互，点击Cell时再开启，选择完成后再关闭，同时配合单元格高度的切换。

步骤1：定义展开状态变量 #

在你的ViewController里先存一个标记，记录目标单元格是否展开：

var isPickerCellExpanded = false

步骤2：自定义Cell初始化时禁用Picker交互 #

class PickerTableViewCell: UITableViewCell {
    let pickerView = UIPickerView()
    
    override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        // 默认禁用Picker的交互，让Cell能收到点击
        pickerView.isUserInteractionEnabled = false
        // 这里添加Picker的布局约束（比如铺满Cell）
        contentView.addSubview(pickerView)
        pickerView.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            pickerView.topAnchor.constraint(equalTo: contentView.topAnchor),
            pickerView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor),
            pickerView.trailingAnchor.constraint(equalTo: contentView.trailingAnchor),
            pickerView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor)
        ])
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

步骤3：实现TableView代理方法 #

// 控制单元格高度
override func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
    // 目标单元格[0,0]：展开时用250，默认用60（可根据需求调整）
    if indexPath == [0,0] {
        return isPickerCellExpanded ? 250 : 60
    } else {
        return 60
    }
}

// 处理Cell点击
override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
    if indexPath == [0,0] {
        // 切换展开状态
        isPickerCellExpanded.toggle()
        // 获取目标Cell，动态开启/关闭Picker交互
        if let cell = tableView.cellForRow(at: indexPath) as? PickerTableViewCell {
            cell.pickerView.isUserInteractionEnabled = isPickerCellExpanded
        }
        // 刷新单元格，触发高度变化
        tableView.reloadRows(at: [indexPath], with: .automatic)
    }
}

步骤4：Picker选择完成后恢复状态 #

实现UIPickerView的代理方法，选择完成后关闭展开状态：

func pickerView(_ pickerView: UIPickerView, didSelectRow row: Int, inComponent component: Int) {
    // 这里处理你的选择逻辑（比如获取选中值）
    print("选中了第\(row)行")
    
    // 恢复单元格状态
    isPickerCellExpanded = false
    if let cell = tableView.cellForRow(at: [0,0]) as? PickerTableViewCell {
        cell.pickerView.isUserInteractionEnabled = false
    }
    tableView.reloadRows(at: [[0,0]], with: .automatic)
}

方案二：给Cell添加透明遮罩优先响应点击 #

如果不想频繁切换Picker的交互状态，可以给Cell加一个全屏的透明遮罩，让遮罩先捕获点击事件，展开后再隐藏遮罩让Picker可交互。

自定义Cell代码示例 #

class PickerTableViewCell: UITableViewCell {
    let pickerView = UIPickerView()
    let tapMaskView = UIView()
    // 定义闭包用来通知ViewController处理展开逻辑
    var onMaskTapped: (() -> Void)?
    
    override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
        super.init(style: style, reuseIdentifier: reuseIdentifier)
        pickerView.isUserInteractionEnabled = false
        
        // 透明遮罩，覆盖整个Cell
        tapMaskView.backgroundColor = .clear
        tapMaskView.isUserInteractionEnabled = true
        let tapGesture = UITapGestureRecognizer(target: self, action: #selector(maskTapped))
        tapMaskView.addGestureRecognizer(tapGesture)
        
        // 添加子视图（遮罩要放在Picker上面）
        contentView.addSubview(pickerView)
        contentView.addSubview(tapMaskView)
        
        // 布局约束
        pickerView.translatesAutoresizingMaskIntoConstraints = false
        tapMaskView.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            pickerView.topAnchor.constraint(equalTo: contentView.topAnchor),
            pickerView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor),
            pickerView.trailingAnchor.constraint(equalTo: contentView.trailingAnchor),
            pickerView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor),
            
            tapMaskView.topAnchor.constraint(equalTo: contentView.topAnchor),
            tapMaskView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor),
            tapMaskView.trailingAnchor.constraint(equalTo: contentView.trailingAnchor),
            tapMaskView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor)
        ])
    }
    
    @objc func maskTapped() {
        onMaskTapped?()
    }
    
    // 提供方法切换遮罩和Picker的状态
    func updateExpandedState(_ isExpanded: Bool) {
        tapMaskView.isHidden = isExpanded
        pickerView.isUserInteractionEnabled = isExpanded
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}

ViewController里的调用 #

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    if indexPath == [0,0] {
        let cell = tableView.dequeueReusableCell(withIdentifier: "PickerCell", for: indexPath) as! PickerTableViewCell
        cell.onMaskTapped = { [weak self] in
            guard let self = self else { return }
            self.isPickerCellExpanded = true
            tableView.reloadRows(at: [indexPath], with: .automatic)
            cell.updateExpandedState(true)
        }
        cell.updateExpandedState(isPickerCellExpanded)
        return cell
    } else {
        // 返回其他Cell
        return UITableViewCell(style: .default, reuseIdentifier: "NormalCell")
    }
}

两种方案都能解决你的问题，方案一更简洁，适合大多数场景；方案二更灵活，适合需要自定义点击区域的情况。

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