如何在UITableView中当第6个单元格出现时复用1-5号背景色

嘿，这需求其实很好实现，核心就是用取余运算来循环复用你的6种渐变背景色。我给你整理了完整的实现步骤和代码：

第一步：定义你的6组渐变颜色 #

先把6种不同的渐变配色存到数组里，这样方便后续根据索引快速取用：

// 定义6组渐变颜色，每组包含top和bottom的CGColor
let gradientColorPairs: [(top: CGColor, bottom: CGColor)] = [
    (UIColor.rgb(r: 247, g: 121, b: 133).cgColor, UIColor.rgb(r: 251, g: 159, b: 168).cgColor),
    (UIColor.rgb(r: 121, g: 247, b: 133).cgColor, UIColor.rgb(r: 159, g: 251, b: 168).cgColor),
    (UIColor.rgb(r: 121, g: 133, b: 247).cgColor, UIColor.rgb(r: 159, g: 168, b: 251).cgColor),
    (UIColor.rgb(r: 247, g: 235, b: 121).cgColor, UIColor.rgb(r: 251, g: 245, b: 159).cgColor),
    (UIColor.rgb(r: 187, g: 121, b: 247).cgColor, UIColor.rgb(r: 209, g: 159, b: 251).cgColor),
    (UIColor.rgb(r: 121, g: 247, b: 229).cgColor, UIColor.rgb(r: 159, g: 251, b: 240).cgColor)
]

（注：这里我补充了另外5组颜色，你可以根据自己的需求替换成想要的配色）

第二步：在UITableView数据源方法里配置单元格 #

在cellForRowAt方法中，通过取余运算得到当前单元格对应的颜色索引，然后设置渐变层。同时要注意UITableView的复用机制，避免重复添加渐变层：

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "YourCellIdentifier", for: indexPath) as! YourCustomCell
    
    // 计算当前单元格的数字（假设从1开始递增）
    let currentNumber = indexPath.row + 1
    // 计算对应的颜色索引：数字到6时回到0，实现循环
    let colorIndex = (currentNumber - 1) % gradientColorPairs.count
    
    // 设置单元格显示的数字
    cell.viewNumber.text = "\(currentNumber)"
    
    // 创建并配置渐变层
    let gradientLayer = CAGradientLayer()
    gradientLayer.name = "CellGradientLayer" // 给渐变层加个标识，方便后续移除
    let colorPair = gradientColorPairs[colorIndex]
    gradientLayer.colors = [colorPair.top, colorPair.bottom]
    gradientLayer.frame = cell.viewNumber.bounds
    gradientLayer.cornerRadius = cell.viewNumber.cornerRadius // 如果你的viewNumber有圆角，记得同步设置
    
    // 添加渐变层到viewNumber的layer上（先移除旧的，避免复用混乱）
    cell.viewNumber.layer.sublayers?.forEach { layer in
        if layer is CAGradientLayer && layer.name == "CellGradientLayer" {
            layer.removeFromSuperlayer()
        }
    }
    cell.viewNumber.layer.insertSublayer(gradientLayer, at: 0)
    
    return cell
}

额外优化：在自定义Cell里处理复用 #

为了更优雅地处理复用，你可以把移除旧渐变层的逻辑放到自定义Cell的prepareForReuse方法里，这样数据源方法的代码会更简洁：

class YourCustomCell: UITableViewCell {
    @IBOutlet weak var viewNumber: UIView!
    
    override func prepareForReuse() {
        super.prepareForReuse()
        // 自动移除旧的渐变层
        viewNumber.layer.sublayers?.forEach { layer in
            if layer is CAGradientLayer && layer.name == "CellGradientLayer" {
                layer.removeFromSuperlayer()
            }
        }
    }
}

这样一来，当单元格被复用时，旧的渐变层会被自动清除，完全不用担心颜色混乱的问题。

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