UITableView滚动时自定义Cell内UIStackView按钮重叠问题求助

问题场景 #

使用包含动态按钮数量的自定义UITableViewCell，Cell内的UIStackView负责展示按钮。初始显示正常，但列表滚动时，StackView顶部出现按钮重叠，滚动次数越多重叠层数越多。尝试用removeArrangedSubview清空StackView，重叠问题未解决；移除该代码后重叠消失，但按钮会重复向下排列。

核心原因 #

removeArrangedSubview(_:)方法仅将视图从StackView的布局管理中移除，但并未将视图从父视图（StackView）中删除。旧按钮仍留在StackView内部，新添加的按钮会和旧按钮堆叠在同一位置，导致重叠。

解决方案 #

在清空StackView时，不仅要移除布局关联，还要彻底将子视图从父视图中删除。统一在prepareForReuse方法中处理，避免重复代码：

修改FormVerticalCell的prepareForReuse方法 #

import UIKit

class FormVerticalCell: UITableViewCell {
    static let reuseIdentifier = "vertical"

    @IBOutlet var buttonView: UIView!
    @IBOutlet weak var buttonStack: UIStackView!
    @IBOutlet var questionLabel: UILabel!

    override func awakeFromNib() {
        super.awakeFromNib()
        // 初始化StackView固定属性，无需每次复用重复设置
        buttonStack.spacing = 5.0
        buttonStack.axis = .vertical
        buttonStack.alignment = .fill
        buttonStack.distribution = .fill
        buttonStack.translatesAutoresizingMaskIntoConstraints = false
    }

    override func prepareForReuse() {
        super.prepareForReuse()
        
        // 彻底移除所有子视图：同时从布局管理和父视图中删除
        for arrangedSubview in buttonStack.arrangedSubviews {
            arrangedSubview.removeFromSuperview()
        }
        // 重置标签文本，避免复用残留
        questionLabel.text = nil
    }
    
    override func setSelected(_ selected: Bool, animated: Bool) {
        super.setSelected(selected, animated: animated)
    }
}

简化cellForRowAt方法 #

移除cellForRowAt中的StackView清空代码（已由prepareForReuse处理），并移除重复的StackView属性设置：

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let inputCellType = formArray[indexPath.row][3]

    if inputCellType == "button" {
        guard let cell = tableView.dequeueReusableCell(withIdentifier: FormVerticalCell.reuseIdentifier, for: indexPath) as? FormVerticalCell else {
            fatalError("Unexpected Index Path")
        }

        // 设置问题标签
        cell.questionLabel.textColor = .black
        cell.questionLabel.text = formArray[indexPath.row][0]
        
        // 配置文本属性（可抽成全局常量优化性能）
        let centerStyle = NSMutableParagraphStyle()
        centerStyle.alignment = .center
        var ac = AttributeContainer()
        ac.font = UIFont(name: "Ariel", size: 16)
        ac.paragraphStyle = centerStyle

        let tempOptions = formArray[indexPath.row][1]
        let optionsArray = tempOptions.components(separatedBy: ",")
        let tempOptionsScores = formArray[indexPath.row][2]
        var btnArray = [UIButton]()

        for i in 0..<optionsArray.count {
            var cfg = UIButton.Configuration.filled()
            cfg.attributedTitle = AttributedString(optionsArray[i], attributes: ac)
            cfg.baseBackgroundColor = UIColor(red:0.8, green:0.6, blue:0.0, alpha:0.1)
            cfg.baseForegroundColor = .black
           
            let handler: UIButton.ConfigurationUpdateHandler = { button in
                switch button.state {
                case [.selected, .highlighted], .selected, .highlighted:
                    button.configuration?.baseBackgroundColor = UIColor(red:0.8, green:0.6, blue:0.0, alpha:1.0)
                    button.configuration?.baseForegroundColor = .white
                default:
                    button.configuration?.baseBackgroundColor = UIColor(red:0.8, green:0.6, blue:0.0, alpha:0.1)
                    button.configuration?.baseForegroundColor = .black
                }
            }
            
            let button = UIButton(configuration: cfg)
            button.configurationUpdateHandler = handler
            button.tag = i
     
            btnArray.append(button)
            cell.buttonStack.addArrangedSubview(button)

            button.addAction { [self] in
                button.isSelected = true
                let optionsScoresArray = tempOptionsScores.components(separatedBy: ",")
                let tempScore = optionsScoresArray[button.tag]
                scoreArrayDouble[indexPath.row] = Double(tempScore)!
                updateScore()

                for (index, btn) in btnArray.enumerated() {
                    if index != button.tag {
                        btn.isSelected = false
                    }
                }
            }
        }

        cell.layoutIfNeeded()
        return cell
    }
    // 其他cell类型处理逻辑...
    return UITableViewCell()
}

额外优化点 #

1. 文本属性复用：将AttributeContainer和NSMutableParagraphStyle抽成全局常量，避免每次创建Cell时重复初始化。
2. 按钮复用（可选）：如果按钮数量较多，可给按钮设置复用标识，在prepareForReuse时隐藏而非删除，提升滚动性能。

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