Swift实现可横竖滚动的UICollectionView遇滚动异常求助

嘿，我之前也踩过一模一样的坑！这种嵌套滚动的UICollectionView，最容易栽在单元格复用、布局配置和数据源传递这几个点上。我给你拆解几个亲测有效的修复方法：

1. 强制重置横向CollectionView的复用状态 #

UICollectionViewCell的复用机制会导致横向滚动的位置被带到新的纵向单元格里，这是最常见的原因。你需要在FeaturedVerticalCell的prepareForReuse()方法里，把横向滚动的位置和选中状态都重置：

class FeaturedVerticalCell: UICollectionViewCell {
    @IBOutlet weak var horizontalCollectionView: UICollectionView!
    
    override func prepareForReuse() {
        super.prepareForReuse()
        // 重置横向滚动到初始位置
        horizontalCollectionView.contentOffset = .zero
        // 清除选中状态（如果有）
        horizontalCollectionView.selectItem(at: nil, animated: false, scrollPosition: [])
        // 如果有自定义的状态（比如高亮、加载状态）也要一起重置
    }
}

2. 确保横向/纵向布局的配置正确 #

• 横向布局：必须明确设置scrollDirection为.horizontal，并且给item设置固定大小（避免动态计算导致布局混乱）：

// 在FeaturedVerticalCell的初始化或setup方法里配置横向布局
private func setupHorizontalCollectionView() {
    let layout = UICollectionViewFlowLayout()
    layout.scrollDirection = .horizontal
    layout.itemSize = CGSize(width: 140, height: 180) // 根据你的需求调整
    layout.minimumLineSpacing = 12
    horizontalCollectionView.collectionViewLayout = layout
}

• 纵向布局：给FeaturedVerticalCell设置固定高度，或者在代理方法里返回明确的尺寸，不要依赖自动布局的动态计算：

// 在FeatureViewController的UICollectionViewDelegateFlowLayout里实现
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    // 纵向单元格的高度要足够容纳横向CollectionView，比如200
    return CGSize(width: collectionView.bounds.width, height: 200)
}

3. 保证每个纵向单元格的数据源独立 #

不要让所有横向CollectionView共用同一个全局数据源，必须给每个FeaturedVerticalCell传递对应分区的独立数据切片，避免复用时数据串位：

// 在FeatureViewController的cellForItemAt方法里
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "FeaturedVerticalCell", for: indexPath) as! FeaturedVerticalCell
    // 获取当前纵向分区对应的横向数据
    let sectionData = yourDataSource[indexPath.section]
    // 给单元格设置独立的数据源
    cell.horizontalItems = sectionData.items
    // 重新加载横向CollectionView的数据
    cell.horizontalCollectionView.reloadData()
    return cell
}

（这里假设你的Model里有按分区组织的数组，比如yourDataSource是一个包含多个section数据的数组）

4. 检查自动约束是否正确 #

确保horizontalCollectionView在FeaturedVerticalCell里的约束是完全固定的，没有弹性或不确定的约束：

• 设置horizontalCollectionView的leading、trailing、top、bottom都和cell的contentView对齐，这样它的大小完全由纵向单元格的尺寸决定，不会因为滚动出现拉伸或偏移。

按照这几个步骤排查下来，基本就能解决纵向滚动时横向行异常变动的问题啦！

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