iOS UICollectionView 高可用架构：复用、预加载、横向嵌套实战详解

在 iOS 开发中，UICollectionView 是构建复杂列表、网格、瀑布流等界面的核心组件——从电商 App 的商品列表、资讯 App 的内容流，到短视频 App 的推荐页，几乎所有高频交互的列表类界面，都离不开 UICollectionView 的身影。

但很多开发者在使用 UICollectionView 时，往往只停留在“能实现功能”的层面：滚动卡顿、cell 复用错乱、横向嵌套滑动冲突、预加载时机不合理，这些问题常常出现，尤其在数据量大、界面复杂的场景下，严重影响用户体验和 App 性能。

其实，想要打造高可用、高性能的 UICollectionView 架构，核心就围绕三个关键点：高效复用、智能预加载、横向嵌套兼容。今天这篇博客，就带你从原理入手，结合完整实战示例，拆解这三大核心模块的实现逻辑、常见坑点及优化方案，帮你从“会用”升级到“精通架构设计”，让你的 UICollectionView 无论在何种复杂场景下，都能流畅运行。

一、先明确核心：为什么 UICollectionView 比 UITableView 更灵活？

很多开发者会疑惑，同样是列表组件，为什么优先选 UICollectionView 而非 UITableView？核心原因在于 UICollectionView 的“可定制化程度极高”——它通过布局（Layout）和单元格（Cell）的解耦设计，支持网格、瀑布流、横向列表、混合布局等多种样式，而 UITableView 仅支持纵向列表。

但灵活性也带来了复杂度：UICollectionView 的性能优化、架构设计，比 UITableView 更具挑战性。其中，复用、预加载、横向嵌套，是日常开发中最常遇到的三大核心场景，也是决定 UICollectionView 性能和可用性的关键。

我们先明确一个核心认知：UICollectionView 的所有性能问题，本质上都和“资源浪费”有关——cell 复用不规范导致内存飙升，预加载不合理导致卡顿，横向嵌套处理不当导致滑动冲突，而高可用架构的核心，就是“避免资源浪费、提升交互流畅度”。

二、核心模块一：高效复用——UICollectionView 性能的基石

UICollectionView 的复用机制，和 UITableView 类似，但更灵活——它不仅支持 cell 复用，还支持 Supplementary View（头部、尾部）、Decoration View（装饰视图）的复用。核心原理是：只创建屏幕可见数量的 cell，当 cell 滚动出屏幕时，将其回收至复用池，滚动进入屏幕时，从复用池取出并重新赋值，避免重复创建和销毁 cell，减少内存占用和 CPU 消耗。

但很多开发者在复用实现上存在误区，导致出现“复用错乱”“内存泄漏”“卡顿”等问题。下面结合原理和实战示例，拆解正确的复用方式和优化技巧。

1. 复用的核心原理（必懂）

UICollectionView 的复用池，本质是一个“缓存队列”，分为两个核心步骤：

• 回收（Dequeue）：当 cell 滚动出屏幕可视区域时，UICollectionView 会自动将其从视图树中移除，放入复用池，此时 cell 并未被销毁，只是暂时闲置；

• 复用（Enqueue）：当新的 cell 需要显示时，UICollectionView 会先从复用池查找对应 reuseIdentifier 的 cell，若有则直接复用，若无则创建新 cell。

关键注意点：复用池中的 cell 会保留上一次的内容和状态，若复用前不重置，会出现“数据错乱”（比如前一个 cell 的图片、文字，出现在新的 cell 上）。

2. 实战示例：规范的 cell 复用实现（避免错乱）

下面用 Swift 实现一个基础的商品列表，演示规范的 cell 复用流程，包含 cell 注册、复用、数据重置，避免常见坑点：

import UIKit // 1. 定义商品模型 struct ProductModel { let id: String let name: String let imageUrl: String } // 2. 自定义 Cell（规范复用的核心：独立封装、重置状态） class ProductCell: UICollectionViewCell { // 复用标识（建议与 Cell 类名一致，避免混淆） static let reuseIdentifier = "ProductCell" // 子视图（懒加载，避免重复创建） private lazy var productImageView: UIImageView = { let iv = UIImageView() iv.contentMode = .scaleAspectFill iv.clipsToBounds = true iv.layer.cornerRadius = 8 return iv }() private lazy var productNameLabel: UILabel = { let label = UILabel() label.font = .systemFont(ofSize: 14, weight: .medium) label.numberOfLines = 2 return label }() // 初始化（必须重写 init(frame:) 和 init?(coder:)） override init(frame: CGRect) { super.init(frame: frame) setupSubviews() } required init?(coder: NSCoder) { super.init(coder: coder) setupSubviews() } // 布局子视图（使用 Auto Layout，贴合之前博客的优化技巧） private func setupSubviews() { contentView.backgroundColor = .white contentView.layer.cornerRadius = 8 contentView.clipsToBounds = true // 添加子视图 contentView.addSubview(productImageView) contentView.addSubview(productNameLabel) // 约束（精简约束，避免冗余） productImageView.translatesAutoresizingMaskIntoConstraints = false productNameLabel.translatesAutoresizingMaskIntoConstraints = false NSLayoutConstraint.activate([ productImageView.topAnchor.constraint(equalTo: contentView.topAnchor, constant: 8), productImageView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 8), productImageView.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -8), productImageView.heightAnchor.constraint(equalTo: productImageView.widthAnchor), // 正方形图片 productNameLabel.topAnchor.constraint(equalTo: productImageView.bottomAnchor, constant: 8), productNameLabel.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 8), productNameLabel.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -8), productNameLabel.bottomAnchor.constraint(equalTo: contentView.bottomAnchor, constant: -8) ]) } // 核心：复用前重置 cell 状态（避免数据错乱） override func prepareForReuse() { super.prepareForReuse() productImageView.image = nil // 重置图片（避免复用旧图片） productNameLabel.text = nil // 重置文字 productImageView.cancelImageRequest() // 取消未完成的图片请求（避免图片错乱、浪费流量） } // 赋值方法（对外暴露，避免在 cellForItemAt 中直接操作子视图） func configure(with model: ProductModel) { productNameLabel.text = model.name // 模拟图片加载（实际开发中用 SDWebImage/Kingfisher，记得取消请求） productImageView.loadImage(with: model.imageUrl) } } // 3. 控制器中实现 UICollectionView 复用逻辑 class ProductListViewController: UIViewController { private var collectionView: UICollectionView! private var dataSource: [ProductModel] = [] // 模拟数据源（100条数据，测试复用） override func viewDidLoad() { super.viewDidLoad() view.backgroundColor = .systemBackground setupCollectionView() loadData() } // 初始化 UICollectionView（注册 cell，设置布局） private func setupCollectionView() { // 网格布局（2列，间距10） let layout = UICollectionViewFlowLayout() layout.itemSize = CGSize(width: (view.bounds.width - 30) / 2, height: 200) layout.minimumInteritemSpacing = 10 layout.minimumLineSpacing = 10 layout.sectionInset = UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10) // 初始化 collectionView collectionView = UICollectionView(frame: view.bounds, collectionViewLayout: layout) collectionView.backgroundColor = .systemBackground collectionView.autoresizingMask = [.flexibleWidth, .flexibleHeight] view.addSubview(collectionView) // 注册 cell（必须注册，否则会崩溃） collectionView.register(ProductCell.self, forCellWithReuseIdentifier: ProductCell.reuseIdentifier) // 设置代理和数据源 collectionView.dataSource = self collectionView.delegate = self } // 模拟加载数据（100条，测试复用性能） private func loadData() { for i in 0..<100 { let model = ProductModel( id: "\(i)", name: "商品\(i)：iOS 开发实战教程，带你精通 UICollectionView 复用与优化", imageUrl: "https://example.com/product/\(i).png" ) dataSource.append(model) } collectionView.reloadData() } } // 4. 实现 UICollectionViewDataSource（复用核心方法） extension ProductListViewController: UICollectionViewDataSource { func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { return dataSource.count } func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { // 从复用池取出 cell（强制转换，确保类型正确） let cell = collectionView.dequeueReusableCell(withReuseIdentifier: ProductCell.reuseIdentifier, for: indexPath) as! ProductCell // 赋值（调用 cell 对外暴露的方法，解耦） let model = dataSource[indexPath.item] cell.configure(with: model) return cell } } // 5. 实现 UICollectionViewDelegate（可选，处理点击等交互） extension ProductListViewController: UICollectionViewDelegate { func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) { let model = dataSource[indexPath.item] print("点击了商品：\(model.name)") } }

3. 复用常见坑点及优化技巧

结合上面的示例，总结3个最常见的复用坑点，以及对应的优化方案，帮你避开“复用错乱”“内存泄漏”等问题：

• 坑点1：复用前未重置状态→ 解决方案：重写prepareForReuse()方法，重置 cell 的图片、文字、选中状态等，同时取消未完成的网络请求（比如图片请求），避免数据错乱和资源浪费；

• 坑点2：cell 注册不规范→ 解决方案：复用标识（reuseIdentifier）与 cell 类名保持一致，避免混用；必须在初始化 collectionView 时注册 cell，不要在cellForItemAt中临时创建 cell（会导致复用失效，内存飙升）；

• 坑点3：cell 内子视图重复创建→ 解决方案：用懒加载初始化子视图，避免在cellForItemAt中重复创建子视图；将子视图布局逻辑封装在 cell 内部，对外暴露赋值方法，解耦控制器和 cell。

额外优化：对于复杂 cell（比如包含多个图片、按钮、标签），可以采用“懒加载子视图”+“按需显示”的方式，进一步减少内存占用；同时，避免在 cell 中做 heavy 操作（比如复杂计算、同步网络请求），所有耗时操作移至后台线程。

三、核心模块二：智能预加载——解决滚动卡顿的关键

在数据量大的场景下（比如1000+条数据），即使做好了 cell 复用，依然可能出现滚动卡顿——核心原因是：当 cell 滚动进入屏幕时，才开始加载数据（比如图片、接口请求），导致主线程被阻塞，出现“掉帧”。

而智能预加载的核心思路是：在 cell 即将滚动进入屏幕之前（比如提前2-3个 cell 的距离），就提前加载该 cell 所需的数据，让数据加载在后台完成，等 cell 进入屏幕时，直接显示内容，避免主线程阻塞。

下面结合原理和实战示例，拆解预加载的实现方式，以及如何控制预加载时机（避免过早预加载浪费资源，过晚预加载导致卡顿）。

1. 预加载的核心实现思路

预加载的实现，核心依赖 UICollectionView 的滚动代理方法，通过判断“当前滚动位置”和“可视区域”，计算出“即将进入屏幕的 cell 索引”，然后提前加载对应数据。主要分为3个步骤：

1. 监听 UICollectionView 的滚动事件（scrollViewDidScroll(_:)）；

2. 计算当前可视区域的最后一个 cell 索引，以及“预加载阈值”（比如提前2个 cell）；

3. 判断“即将进入屏幕的 cell 索引”是否未加载数据，若未加载，则触发后台预加载。

关键注意点：预加载必须在后台线程执行，避免阻塞主线程；同时，要做“去重处理”，避免同一 cell 的数据被重复预加载。

2. 实战示例：智能预加载实现（商品列表图片预加载）

基于上面的商品列表示例，添加预加载功能，提前加载即将进入屏幕的商品图片，解决滚动卡顿问题：

import UIKit // 1. 扩展 ProductListViewController，添加预加载逻辑 extension ProductListViewController { // 预加载阈值（提前2个 cell 开始预加载，可根据实际场景调整） private let preloadThreshold = 2 // 监听滚动事件，触发预加载 func scrollViewDidScroll(_ scrollView: UIScrollView) { // 只在纵向滚动时触发（避免横向嵌套时误触发） guard scrollView.contentOffset.y >= 0 else { return } // 计算当前可视区域的最后一个 cell 索引 let visibleIndexPaths = collectionView.indexPathsForVisibleItems guard let lastVisibleIndexPath = visibleIndexPaths.last else { return } let lastVisibleItem = lastVisibleIndexPath.item // 计算预加载的起始索引（最后一个可视 cell + 预加载阈值） let preloadStartIndex = lastVisibleItem + preloadThreshold // 边界判断：避免超出数据源范围 guard preloadStartIndex < dataSource.count else { return } // 预加载：从 preloadStartIndex 开始，加载后续 N 个 cell 的数据（这里加载2个） for index in preloadStartIndex..<min(preloadStartIndex + 2, dataSource.count) { let model = dataSource[index] preloadImage(for: model) } } // 后台预加载图片（避免阻塞主线程） private func preloadImage(for model: ProductModel) { // 模拟图片预加载（实际开发中用 SDWebImage/Kingfisher 的预加载方法） DispatchQueue.global().async { guard let url = URL(string: model.imageUrl) else { return } do { _ = try Data(contentsOf: url) // 模拟加载图片数据 // 预加载完成后，可缓存图片（实际开发中用图片缓存框架） ImageCache.shared.setObject($0, forKey: model.imageUrl as NSString) } catch { print("预加载图片失败：\(error.localizedDescription)") } } } } // 2. 补充图片缓存工具（简化版，实际开发用成熟框架） class ImageCache { static let shared = ImageCache() private init() {} private var cache = NSCache<NSString, UIImage>() func setObject(_ image: UIImage, forKey key: NSString) { cache.setObject(image, forKey: key) } func object(forKey key: NSString) -> UIImage? { return cache.object(forKey: key) } } // 3. 优化 ProductCell 的图片加载逻辑（优先使用预加载的缓存） extension ProductCell { func loadImage(with urlString: String) { // 先从缓存中获取图片（预加载的图片会存在这里） if let cachedImage = ImageCache.shared.object(forKey: urlString as NSString) { productImageView.image = cachedImage return } // 缓存中没有，发起网络请求（后台线程） DispatchQueue.global().async { guard let url = URL(string: urlString) else { return } do { let data = try Data(contentsOf: url) guard let image = UIImage(data: data) else { return } // 缓存图片 ImageCache.shared.setObject(image, forKey: urlString as NSString) // 主线程更新 UI DispatchQueue.main.async { self.productImageView.image = image } } catch { print("图片加载失败：\(error.localizedDescription)") DispatchQueue.main.async { self.productImageView.image = UIImage(named: "placeholder") // 占位图 } } } } // 取消图片请求（配合 prepareForReuse，避免错乱） func cancelImageRequest() { // 实际开发中，用 SDWebImage/Kingfisher 的取消请求方法，比如： // productImageView.sd_cancelCurrentImageLoad() } }

3. 预加载优化技巧（避免资源浪费）

预加载的核心是“智能”——既要避免卡顿，也要避免过早预加载导致的资源浪费（比如用户滚动速度快，预加载的内容用户根本没看到），以下3个优化技巧，贴合实际开发场景：

• 动态调整预加载阈值：根据滚动速度调整预加载阈值——滚动速度快时，增大阈值（比如提前3-4个 cell）；滚动速度慢时，减小阈值（比如提前1-2个 cell），避免无效预加载；

• 去重预加载：用一个集合（比如 Set）记录已预加载的 cell 索引，避免同一 cell 被重复预加载，减少网络请求和内存浪费；

• 停止滚动后取消无用预加载：当用户停止滚动时，取消未完成的、且不在可视区域内的预加载请求，释放资源（比如用户快速滚动后停止，之前预加载的后续 cell 可能已不需要）。

四、核心模块三：横向嵌套——解决滑动冲突，实现复杂布局

在复杂界面中，常常需要实现“纵向列表嵌套横向列表”的布局——比如电商 App 的“分类标题 + 横向商品列表”、资讯 App 的“专题标题 + 横向内容卡片”。这种场景下，最容易出现的问题是：横向列表滑动不流畅、滑动冲突（手指滑动时，不知道该触发纵向滚动还是横向滚动）。

横向嵌套的核心解决方案是：明确滑动手势的响应优先级，通过代理方法控制手势的拦截与传递，让横向列表在需要时优先响应滑动，纵向列表在不需要时再响应。同时，优化横向列表的性能，避免嵌套导致的卡顿。

下面结合实战示例，实现“纵向列表嵌套横向列表”的高可用架构，解决滑动冲突，保证滑动流畅度。

1. 嵌套布局的核心结构（必懂）

横向嵌套的典型结构的是：外层是纵向 UICollectionView（父列表），每个 cell 中包含一个横向 UICollectionView（子列表）。父列表负责纵向滚动，子列表负责横向滚动，两者的滑动手势需要区分开。

关键注意点：

• 子列表的isScrollEnabled必须设为 true（默认 true），但需要控制其滑动手势的响应时机；

• 父列表和子列表的复用需要分开处理，避免复用错乱；

• 子列表的布局要设置为横向（scrollDirection: .horizontal），且要禁用“弹簧效果”（bounces = false），提升滑动流畅度。

2. 实战示例：纵向嵌套横向列表（电商分类场景）

实现一个电商 App 的分类列表：外层纵向列表显示分类标题，每个分类 cell 中嵌套横向列表，显示该分类下的商品，解决滑动冲突，保证流畅度：

import UIKit // 1. 定义分类模型（包含分类标题和该分类下的商品列表） struct CategoryModel { let id: String let title: String let products: [ProductModel] // 该分类下的商品（横向列表数据源） } // 2. 自定义父列表 Cell（嵌套横向列表） class CategoryCell: UICollectionViewCell { static let reuseIdentifier = "CategoryCell" // 子视图：分类标题 private lazy var titleLabel: UILabel = { let label = UILabel() label.font = .systemFont(ofSize: 18, weight: .bold) label.textColor = .black return label }() // 子视图：横向列表（子列表） private lazy var horizontalCollectionView: UICollectionView = { // 横向布局 let layout = UICollectionViewFlowLayout() layout.itemSize = CGSize(width: 120, height: 150) layout.scrollDirection = .horizontal // 横向滚动 layout.minimumInteritemSpacing = 10 layout.minimumLineSpacing = 10 layout.sectionInset = UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10) let cv = UICollectionView(frame: .zero, collectionViewLayout: layout) cv.backgroundColor = .clear cv.showsHorizontalScrollIndicator = false // 隐藏横向滚动条 cv.bounces = false // 禁用弹簧效果，提升流畅度 cv.isScrollEnabled = true // 注册子列表的 cell（与之前的 ProductCell 复用） cv.register(ProductCell.self, forCellWithReuseIdentifier: ProductCell.reuseIdentifier) return cv }() // 数据源（子列表的商品数据） private var products: [ProductModel] = [] // 初始化 override init(frame: CGRect) { super.init(frame: frame) setupSubviews() } required init?(coder: NSCoder) { super.init(coder: coder) setupSubviews() } // 布局子视图 private func setupSubviews() { contentView.backgroundColor = .white contentView.addSubview(titleLabel) contentView.addSubview(horizontalCollectionView) titleLabel.translatesAutoresizingMaskIntoConstraints = false horizontalCollectionView.translatesAutoresizingMaskIntoConstraints = false NSLayoutConstraint.activate([ titleLabel.topAnchor.constraint(equalTo: contentView.topAnchor, constant: 10), titleLabel.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 10), titleLabel.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -10), horizontalCollectionView.topAnchor.constraint(equalTo: titleLabel.bottomAnchor, constant: 10), horizontalCollectionView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor), horizontalCollectionView.trailingAnchor.constraint(equalTo: contentView.trailingAnchor), horizontalCollectionView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor, constant: -10), horizontalCollectionView.heightAnchor.constraint(equalToConstant: 170) // 固定子列表高度，避免布局错乱 ]) // 设置子列表的数据源和代理（内部处理，解耦父控制器） horizontalCollectionView.dataSource = self horizontalCollectionView.delegate = self } // 复用前重置状态 override func prepareForReuse() { super.prepareForReuse() titleLabel.text = nil products.removeAll() horizontalCollectionView.reloadData() } // 赋值方法（对外暴露，传递分类数据） func configure(with model: CategoryModel) { titleLabel.text = model.title products = model.products horizontalCollectionView.reloadData() // 子列表预加载（提前加载横向列表的商品图片） preloadHorizontalProductsImages() } // 子列表商品图片预加载 private func preloadHorizontalProductsImages() { for product in products { DispatchQueue.global().async { guard let url = URL(string: product.imageUrl) else { return } do { _ = try Data(contentsOf: url) if let image = UIImage(data: $0) { ImageCache.shared.setObject(image, forKey: product.imageUrl as NSString) } } catch { print("子列表预加载图片失败：\(error.localizedDescription)") } } } } } // 3. 实现子列表（横向）的数据源和代理 extension CategoryCell: UICollectionViewDataSource, UICollectionViewDelegate { func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { return products.count } func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: ProductCell.reuseIdentifier, for: indexPath) as! ProductCell let product = products[indexPath.item] cell.configure(with: product) return cell } // 子列表点击事件（内部处理，或通过闭包传递给父控制器） func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) { let product = products[indexPath.item] print("点击了分类商品：\(product.name)") } } // 4. 父控制器（外层纵向列表） class CategoryListViewController: UIViewController { private var collectionView: UICollectionView! private var dataSource: [CategoryModel] = [] // 分类数据源（包含多个分类，每个分类有横向商品列表） override func viewDidLoad() { super.viewDidLoad() view.backgroundColor = .systemBackground setupCollectionView() loadData() } private func setupCollectionView() { // 纵向布局（父列表） let layout = UICollectionViewFlowLayout() layout.itemSize = CGSize(width: view.bounds.width, height: 200) // 父 cell 高度固定 layout.minimumLineSpacing = 10 layout.scrollDirection = .vertical collectionView = UICollectionView(frame: view.bounds, collectionViewLayout: layout) collectionView.backgroundColor = .systemBackground collectionView.autoresizingMask = [.flexibleWidth, .flexibleHeight] view.addSubview(collectionView) // 注册父列表的 cell collectionView.register(CategoryCell.self, forCellWithReuseIdentifier: CategoryCell.reuseIdentifier) collectionView.dataSource = self collectionView.delegate = self } // 模拟加载分类数据（3个分类，每个分类10个商品） private func loadData() { for categoryIndex in 0..<3 { var products: [ProductModel] = [] for productIndex in 0..<10 { let product = ProductModel( id: "\(categoryIndex)_\(productIndex)", name: "分类\(categoryIndex) - 商品\(productIndex)", imageUrl: "https://example.com/category/\(categoryIndex)/product/\(productIndex).png" ) products.append(product) } let category = CategoryModel( id: "\(categoryIndex)", title: "分类\(categoryIndex)：iOS 开发相关商品", products: products ) dataSource.append(category) } collectionView.reloadData() } } // 5. 实现父列表的数据源和代理（核心：解决滑动冲突） extension CategoryListViewController: UICollectionViewDataSource, UICollectionViewDelegate { func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int { return dataSource.count } func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell { let cell = collectionView.dequeueReusableCell(withReuseIdentifier: CategoryCell.reuseIdentifier, for: indexPath) as! CategoryCell let category = dataSource[indexPath.item] cell.configure(with: category) return cell } // 核心：解决滑动冲突——判断手势方向，决定响应父列表还是子列表 func scrollViewShouldScrollToTop(_ scrollView: UIScrollView) -> Bool { // 点击状态栏，只有父列表能滚动到顶部 return scrollView === collectionView } // 拦截手势，避免滑动冲突 func scrollViewDidScroll(_ scrollView: UIScrollView) { // 若滑动的是子列表（横向），则禁止父列表滚动 if scrollView !== collectionView { collectionView.isScrollEnabled = false } else { collectionView.isScrollEnabled = true } } // 滑动结束后，恢复父列表滚动 func scrollViewDidEndDragging(_ scrollView: UIScrollView, willDecelerate decelerate: Bool) { if scrollView !== collectionView { DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) { self.collectionView.isScrollEnabled = true } } } }

3. 横向嵌套常见坑点及解决方案

横向嵌套的核心问题是滑动冲突和性能卡顿，以下3个常见坑点，结合实战给出解决方案，确保嵌套布局流畅可用：

• 坑点1：滑动冲突（不知道响应哪个列表）→ 解决方案：通过scrollViewDidScroll(_:)拦截手势，当子列表（横向）滑动时，禁用父列表滚动；子列表滑动结束后，恢复父列表滚动；同时，通过scrollViewShouldScrollToTop(_:)控制状态栏点击只响应父列表；

• 坑点2：子列表复用错乱→ 解决方案：父列表 cell 复用前，重置子列表的数据源并 reloadData()；子列表的 cell 复用逻辑和之前一致，重写prepareForReuse()重置状态；

• 坑点3：嵌套导致卡顿→ 解决方案：① 固定子列表的高度（避免动态计算高度导致布局耗时）；② 子列表提前预加载数据，避免滑动时加载；③ 禁用子列表的弹簧效果（bounces = false），减少不必要的布局计算；④ 避免在子列表的 cellForItemAt 中做耗时操作。

五、UICollectionView 高可用架构总结（必记）

打造 UICollectionView 高可用架构，核心就是围绕“复用、预加载、横向嵌套”三大模块，兼顾性能和可用性，总结5个核心要点，帮你快速落地：

1. 复用是基础：规范 cell 注册、复用流程，重写prepareForReuse()重置状态，避免错乱和内存浪费；将 cell 逻辑封装在内部，解耦控制器；

2. 预加载是关键：通过滚动代理判断预加载时机，后台预加载数据（图片、接口），动态调整预加载阈值，避免滚动卡顿；

3. 横向嵌套讲兼容：明确手势响应优先级，拦截手势解决滑动冲突；固定子列表高度，优化子列表性能，避免嵌套卡顿；

4. 细节决定体验：禁用不必要的滚动条、弹簧效果，减少布局计算；避免在主线程做耗时操作，所有网络请求、复杂计算移至后台；

5. 复用与缓存结合：图片缓存、数据缓存结合预加载，进一步提升流畅度；避免重复请求和重复创建，最大化利用资源。

UICollectionView 的灵活性，决定了它能适配各种复杂界面，但也需要我们做好架构设计和性能优化。掌握复用、预加载、横向嵌套的核心逻辑和实战技巧，能让你的 UICollectionView 在数据量大、界面复杂的场景下，依然保持流畅的交互体验，同时降低维护成本。