Swift：如何将TableView单元格的子视图移至最上层？

我来帮你梳理下这个问题的解决方案，既要保证动画能显示在最上层，又要处理Cell复用和重复点击的情况：

1. 将动画图层改为Cell的属性 #

你之前在@IBAction里每次创建新的CAShapeLayer，虽然能实现重复点击，但容易导致图层叠加，而且Cell复用时没法及时清理。把它改成Cell的私有属性，方便统一管理：

class YourCustomTableViewCell: UITableViewCell {
    // 声明动画图层为Cell属性，方便后续操作
    private var loadingShape: CAShapeLayer?
    
    // 你的其他Cell代码...
    
    @IBAction func playNowTapped(_ sender: UIButton) {
        // 先清理旧的动画和图层，避免重复叠加
        loadingShape?.removeAllAnimations()
        loadingShape?.removeFromSuperlayer()
        
        // 创建新的形状图层并配置属性
        let newLoadingShape = CAShapeLayer()
        // 这里替换成你的动画路径、样式设置，比如圆形加载动画
        let animationPath = UIBezierPath(arcCenter: sender.center, radius: 20, startAngle: 0, endAngle: .pi * 2, clockwise: true)
        newLoadingShape.path = animationPath.cgPath
        newLoadingShape.strokeColor = UIColor.systemBlue.cgColor
        newLoadingShape.fillColor = UIColor.clear.cgColor
        newLoadingShape.lineWidth = 3
        newLoadingShape.strokeEnd = 0
        
        // 把图层添加到Cell的最上层
        // 使用insertSublayer确保在所有子图层的最顶部，不会被其他视图遮挡
        contentView.layer.insertSublayer(newLoadingShape, at: UInt32(contentView.layer.sublayers?.count ?? 0))
        
        // 保存引用到属性
        loadingShape = newLoadingShape
        
        // 添加你的动画逻辑
        let strokeAnimation = CABasicAnimation(keyPath: "strokeEnd")
        strokeAnimation.fromValue = 0
        strokeAnimation.toValue = 1
        strokeAnimation.duration = 1.5
        strokeAnimation.repeatCount = .infinity
        newLoadingShape.add(strokeAnimation, forKey: "loadingAnimation")
    }
}

2. 处理Cell复用的情况 #

因为TableView会复用单元格，当Cell滚出屏幕再回来时，之前的动画可能还残留着，所以要在prepareForReuse方法里清理动画：

override func prepareForReuse() {
    super.prepareForReuse()
    // 复用前彻底清理动画和图层
    loadingShape?.removeAllAnimations()
    loadingShape?.removeFromSuperlayer()
    loadingShape = nil
}

关键要点解释 #

• 层级控制：使用contentView.layer.insertSublayer(_:at:)把动画图层插入到子图层的最后一位（也就是最上层），这样就不会被Cell里的其他按钮、标签等视图遮挡。
• 重复点击处理：每次点击前先移除旧的图层和动画，再创建新的，避免多次点击导致多个动画图层叠加。
• 复用清理：通过prepareForReuse确保Cell复用时不会带着之前的动画，避免出现混乱的UI状态。

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