如何为UITableView顶部首个可见单元格设置不同背景色（复用场景）

Hey there! Let's fix that stubborn cell reuse issue you're dealing with—getting the top visible UITableViewCell to keep its unique background color isn't as tricky once you account for how cell recycling works. Here's a step-by-step solution tailored to your code:

Core Problem Breakdown #

You're right about cell reuse being the culprit. When cells scroll off-screen, they get reused for new rows, so any custom background color you set earlier sticks around unless you explicitly reset it. Plus, we need to update the color in real-time as the table scrolls, not just when dragging ends.

Step 1: Fix Cell Configuration in cellForRowAt #

This is the most critical part—we need to reset the cell's background color every time it's dequeued, then apply the special color only if it's the top row. Update your cellForRowAt method like this:

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = tableView.dequeueReusableCell(withIdentifier: "cellNewPosts", for: indexPath) as! MainNewTableViewCell
    
    // 1. Reset to default background color first (critical for reuse!)
    cell.backgroundColor = .systemBackground // Replace with your default cell color
    
    // 2. Apply special color only to the top tracked row
    if indexPath.row == currentItemOnTop {
        cell.backgroundColor = .lightGray // Replace with your desired highlight color
    }
    
    return cell
}

Step 2: Update Top Row in Real-Time During Scrolling #

Your current code only updates currentItemOnTop when dragging ends, but we need to handle the scrolling process too. Add this UIScrollViewDelegate method:

func scrollViewDidScroll(_ scrollView: UIScrollView) {
    guard let visibleIndexPaths = tableViewNew.indexPathsForVisibleRows else { return }
    
    // Get the first fully/partially visible index path
    if let topIndexPath = visibleIndexPaths.first, topIndexPath.row != currentItemOnTop {
        let previousTopRow = currentItemOnTop
        currentItemOnTop = topIndexPath.row
        
        // Refresh only the rows that changed to avoid full table reload
        tableViewNew.reloadRows(
            at: [
                IndexPath(row: previousTopRow, section: 0),
                topIndexPath
            ],
            with: .none
        )
    }
}

Step 3: Polish the Drag-End Behavior #

In your existing scrollViewWillEndDragging method, add a line at the end to ensure the snapped top row gets its color immediately:

scrollViewWillEndDragging(_ scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer<CGPoint>) {
    // Your existing vibration and snap logic here...
    
    scrollingToIP.row += roundingRow
    scrollingToRect = tableViewNew.rectForRow(at: scrollingToIP)
    targetContentOffset.pointee.y = scrollingToRect.origin.y
    currentItemOnTop = scrollingToIP.row
    
    // Add this line to refresh the snapped top cell
    tableViewNew.reloadRows(at: [IndexPath(row: currentItemOnTop, section: 0)], with: .none)
}

Quick Initial Setup #

Don't forget to set the initial state in viewDidLoad so the first cell starts with the special color:

override func viewDidLoad() {
    super.viewDidLoad()
    currentItemOnTop = 0
    tableViewNew.reloadRows(at: [IndexPath(row: 0, section: 0)], with: .none)
}

Why This Works #

• Resetting in cellForRowAt: Ensures no reused cell carries over the highlight color from a previous row.
• Real-time scroll updates: Keeps the highlight in sync as the user scrolls, not just when they stop dragging.
• Targeted reloads: Only refreshes the rows that need color changes, keeping performance smooth even with 100+ rows.

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