UICollectionView粘性Header滚动时，如何切换指定section标题文字颜色？

核心思路 #

借助UICollectionView的滚动回调，结合可见辅助视图的位置判断，识别当前固定在顶部的Header所属section，进而修改其文字样式。

具体实现步骤 #

1. 监听滚动事件
   给UICollectionView设置代理，实现scrollViewDidScroll(_:)方法作为滚动逻辑的入口：

func scrollViewDidScroll(_ scrollView: UIScrollView) {
    updatePinnedHeaderStyle()
}

2. 识别固定Header并更新颜色
   编写处理Header样式的方法，通过视图位置判断是否处于固定状态：

private func updatePinnedHeaderStyle() {
    // 获取所有可见的section header，替换成你的自定义Header类
    guard let visibleHeaders = collectionView.visibleSupplementaryViews(ofKind: UICollectionView.elementKindSectionHeader) as? [CustomSectionHeader] else {
        return
    }
    
    for header in visibleHeaders {
        let section = collectionView.indexPath(for: header)?.section ?? -1
        // 判断Header是否固定在顶部：对比Header顶部与CollectionView安全区域顶部
        let isPinned = header.frame.minY <= collectionView.safeAreaInsets.top
        
        // 按需求设置颜色，如需针对特定section，可添加section判断条件
        if isPinned && section == 1 { // 示例：仅处理section 1的固定Header
            header.titleLabel.textColor = .systemBlue
        } else {
            header.titleLabel.textColor = .label
        }
    }
}

3. 处理复用避免样式错乱
   在Header复用方法中设置默认样式，防止复用导致的样式异常：

func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView {
    let header = collectionView.dequeueReusableSupplementaryView(ofKind: kind, withReuseIdentifier: "CustomHeaderID", for: indexPath) as! CustomSectionHeader
    // 设置默认文字颜色
    header.titleLabel.textColor = .label
    // 其他Header内容配置
    header.titleLabel.text = "Section \(indexPath.section)"
    return header
}

关键说明 #

• 固定状态判断逻辑：当Header的frame.minY小于等于CollectionView的安全区域顶部时，说明该Header已固定在顶部。
• 特定section适配：如果仅需修改指定section的Header颜色，在判断时加入section编号的条件即可。

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