点击UICollectionViewCell内部视图无UI更新问题排查

嘿，我一眼就看出问题出在哪了！你的代码逻辑有两个关键错误，导致点击后头像高亮不生效，下面一步步给你拆解解决：

1. 你获取cell的方式完全错了 #

在didSelectItemAt方法里，你用了collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath)——这会创建一个新的复用cell实例，而不是当前屏幕上被用户点击的那个cell！你修改的是一个根本没显示在界面上的cell，自然看不到UI变化。

正确的做法是用collectionView.cellForItem(at: indexPath)来获取当前显示的cell：

func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
    // 先获取屏幕上的目标cell，而不是新出列一个
    guard let cell = collectionView.cellForItem(at: indexPath) as? UICollectionViewCell else { return }
    let tappedUser = groupMembers[indexPath.item]
    let imgAvatar = cell.viewWithTag(2) as! UIImageView
    
    // 这里处理选中/取消选中的逻辑
}

2. 必须维护选中状态的数据源 #

UICollectionView的cell是会复用的——如果用户点击后你只改一次UI，当这个cell滚出屏幕再滚回来，选中状态会丢失。所以你需要一个专门的集合来记录哪些用户被选中，比如用用户ID作为标识：

// 定义一个全局/类级别的集合，记录选中的用户ID
var selectedMemberIDs = Set<String>()

然后在点击方法里更新这个集合，同时修改UI：

func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
    guard let cell = collectionView.cellForItem(at: indexPath) as? UICollectionViewCell else { return }
    let tappedUser = groupMembers[indexPath.item]
    let imgAvatar = cell.viewWithTag(2) as! UIImageView
    
    // 切换选中状态
    if selectedMemberIDs.contains(tappedUser.id) {
        // 取消选中
        selectedMemberIDs.remove(tappedUser.id)
        imgAvatar.layer.borderColor = UIColor.clear.cgColor
    } else {
        // 选中
        selectedMemberIDs.insert(tappedUser.id)
        imgAvatar.layer.borderColor = UIColor.blue.cgColor
    }
}

3. 在cellForItemAt里根据选中状态设置UI #

为了避免cell复用导致选中状态丢失，你必须在cellForItemAt方法里，根据selectedMemberIDs的状态来设置cell的UI：

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath) as! UICollectionViewCell
    let member = groupMembers[indexPath.item]
    let imgAvatar = cell.viewWithTag(2) as! UIImageView
    
    // 基础UI设置（把重复的代码统一放这里）
    imgAvatar.layer.cornerRadius = 30.0
    imgAvatar.clipsToBounds = true
    imgAvatar.contentMode = .scaleAspectFill
    imgAvatar.layer.borderWidth = 2.0
    
    // 根据选中状态设置边框颜色
    if selectedMemberIDs.contains(member.id) {
        imgAvatar.layer.borderColor = UIColor.blue.cgColor
    } else {
        imgAvatar.layer.borderColor = UIColor.clear.cgColor
    }
    
    // 加载头像图片
    if let downloadURL = URL(string: member.avatarUrl) {
        imgAvatar.af_setImage(withURL: downloadURL)
    }
    
    return cell
}

额外优化建议：别用Tag获取视图 #

用viewWithTag找控件很容易出错（比如tag重复、视图层级变化），最好自定义一个UICollectionViewCell子类，把头像ImageView做成IBOutlet属性：

class MemberAvatarCell: UICollectionViewCell {
    @IBOutlet weak var avatarImageView: UIImageView!
    
    override func awakeFromNib() {
        super.awakeFromNib()
        // 在这里统一做基础UI配置
        avatarImageView.layer.cornerRadius = 30.0
        avatarImageView.clipsToBounds = true
        avatarImageView.contentMode = .scaleAspectFill
        avatarImageView.layer.borderWidth = 2.0
    }
    
    // 封装配置方法，代码更清晰
    func configure(with member: UserProfile, isSelected: Bool) {
        avatarImageView.layer.borderColor = isSelected ? UIColor.blue.cgColor : UIColor.clear.cgColor
        if let url = URL(string: member.avatarUrl) {
            avatarImageView.af_setImage(withURL: url)
        }
    }
}

之后cellForItemAt就可以简化成：

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath) as! MemberAvatarCell
    let member = groupMembers[indexPath.item]
    let isSelected = selectedMemberIDs.contains(member.id)
    cell.configure(with: member, isSelected: isSelected)
    return cell
}

这样修改后，点击头像就能正确高亮，而且cell复用也不会丢失选中状态啦！

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