Swift CollectionView滚动时Label尺寸异常及控件消失问题

看起来你遇到了CollectionView复用Cell时的经典问题——视图重复添加、状态残留和约束配置不当，导致滚动后genreLabel宽度不足、discountLabel消失。我来帮你一步步解决这些问题：

核心问题分析 #

1. 重复添加子视图：你在configure()里调用setupViews()，每次Cell复用都会重复添加genreLabel、折扣标签等控件，导致视图层级混乱、约束冲突，最终显示异常。
2. 状态未重置：prepareForReuse()没有完全重置discount等状态变量，导致复用Cell时加载错误的折扣标签。
3. 约束配置错误：genreLabel的宽度依赖intrinsicContentSize，但时机不对；折扣标签的添加逻辑依赖临时变量，复用后状态混乱。

分步解决方案 #

1. 将setupViews()移到Cell初始化方法，仅执行一次 #

Cell的子视图只需要创建一次，复用过程中不需要重复添加。把setupViews()放到init(frame:)里，避免重复添加视图导致的层级问题：

override init(frame: CGRect) {
    super.init(frame: frame)
    setupViews() // 只在Cell创建时执行一次
}

2. 重构折扣标签的处理逻辑 #

不要每次根据discount值添加不同的标签，而是提前把fixDiscountLabel和variableDiscountLabel都添加到Cell中，在configure()里只切换显示状态：

修改setupViews()：

func setupViews() {
    addSubview(genreLabel)
    // 提前添加两个折扣标签，后续只控制显示隐藏
    addSubview(fixDiscountLabel)
    addSubview(variableDiscountLabel)
    
    // 配置genreLabel的自适应约束：不固定宽度，让它根据文本自动调整
    genreLabel.translatesAutoresizingMaskIntoConstraints = false
    NSLayoutConstraint.activate([
        genreLabel.topAnchor.constraint(equalTo: topAnchor, constant: 16),
        genreLabel.leftAnchor.constraint(equalTo: leftAnchor),
        genreLabel.heightAnchor.constraint(equalToConstant: 30)
    ])
    // 确保genreLabel优先保留自身宽度，不被其他控件挤压
    genreLabel.setContentHuggingPriority(.defaultHigh, for: .horizontal)
    genreLabel.setContentCompressionResistancePriority(.defaultHigh, for: .horizontal)
    
    // 配置两个折扣标签的约束（初始都隐藏）
    fixDiscountLabel.translatesAutoresizingMaskIntoConstraints = false
    NSLayoutConstraint.activate([
        fixDiscountLabel.topAnchor.constraint(equalTo: topAnchor, constant: imageHeight - 32),
        fixDiscountLabel.rightAnchor.constraint(equalTo: rightAnchor, constant: -8),
        fixDiscountLabel.widthAnchor.constraint(equalToConstant: 64),
        fixDiscountLabel.heightAnchor.constraint(equalToConstant: 64)
    ])
    fixDiscountLabel.isHidden = true
    
    variableDiscountLabel.translatesAutoresizingMaskIntoConstraints = false
    NSLayoutConstraint.activate([
        variableDiscountLabel.topAnchor.constraint(equalTo: topAnchor, constant: imageHeight - 32),
        variableDiscountLabel.rightAnchor.constraint(equalTo: rightAnchor, constant: -8),
        variableDiscountLabel.widthAnchor.constraint(equalToConstant: 64),
        variableDiscountLabel.heightAnchor.constraint(equalToConstant: 64)
    ])
    variableDiscountLabel.isHidden = true
    
    // 其他控件的约束配置...
}

3. 修改configure()方法，仅更新内容和显示状态 #

去掉setupViews()调用，只更新文本和控件显示状态：

func configure(with homeEvent: HomeEvent) {
    homeEvent.image { (image) in
        self.eventImageView.image = image
    }
    genreLabel.text = homeEvent.genre
    
    // 团队事件标签处理...
    // 礼物标签处理...
    
    // 折扣标签切换逻辑
    if homeEvent.discount.prefix(1) == "<" {
        // 配置可变折扣文本
        let normalText = "Bis zu "
        let boldText = homeEvent.discount.suffix(2) + "%"
        let normalAttributes = [NSAttributedString.Key.font: UIFont.systemFont(ofSize: 14)]
        let attributedString = NSMutableAttributedString(string: normalText, attributes: normalAttributes)
        let boldAttributes = [NSAttributedString.Key.font: UIFont.boldSystemFont(ofSize: 24)]
        let boldString = NSMutableAttributedString(string: boldText, attributes: boldAttributes)
        attributedString.append(boldString)
        variableDiscountLabel.attributedText = attributedString
        
        variableDiscountLabel.isHidden = false
        fixDiscountLabel.isHidden = true
    } else {
        fixDiscountLabel.text = homeEvent.discount.suffix(2) + "%"
        fixDiscountLabel.isHidden = false
        variableDiscountLabel.isHidden = true
    }
    
    // banner、标题、日期等其他内容处理...
}

4. 完善prepareForReuse()，重置所有状态 #

确保复用Cell时，所有状态和控件都回到初始状态：

override func prepareForReuse() {
    super.prepareForReuse() // 别忘了调用父类方法
    
    eventImageView.image = nil
    genreLabel.text = nil
    teamEventLabel.isHidden = true
    giftLabel.isHidden = true
    fixDiscountLabel.text = nil
    fixDiscountLabel.isHidden = true
    variableDiscountLabel.attributedText = nil
    variableDiscountLabel.isHidden = true
    eventTitleLabel.text = nil
    eventSubTitleLabel.text = nil
    eventDatesLabel.text = nil
    eventLocationLabel.text = nil
    
    // 重置所有状态变量
    themePage = false
    banner = 0
    gift = 0
    teamEvent = 0
    discount = 1
    
    // banner视图重置
    bannerView1.isHidden = true
    bannerView2.isHidden = true
    bannerView3.isHidden = true
    bannerView4.isHidden = true
}

5. 优化genreLabel的自适应行为 #

确保genreLabel的translatesAutoresizingMaskIntoConstraints设置为false，并且不要给它设置固定宽度，让Auto Layout根据文本内容自动计算宽度。同时设置内容优先级，避免被其他控件挤压。

为什么这些修改能解决问题？ #

• 子视图仅创建一次，避免了重复添加导致的视图层级混乱和约束冲突。
• 折扣标签的显示切换逻辑更稳定，复用Cell时不会因为重复添加标签而消失。
• prepareForReuse()完全重置状态，避免了复用Cell时的残留状态影响显示。
• genreLabel的约束配置让它能自适应文本宽度，滚动复用后尺寸保持稳定。

内容的提问来源于stack exchange，提问作者Kühlhausvogel