基于MVVM开发可复用UICollectionViewController的布局合规性疑问

这是个非常典型的MVVM适配UICollectionView的疑问——我当初第一次把MVVM用到列表组件上时，也纠结过布局逻辑该放哪儿。先给你吃个定心丸：把布局信息（比如Cell尺寸）存在ViewModel里，然后在ViewController中实现UICollectionViewDelegateFlowLayout的方法，完全不违反MVVM的设计原则。

为什么这样做是合理的？ #

MVVM的核心职责划分是：

• Model：纯数据模型，只负责存储数据，不包含任何业务或展示逻辑
• ViewModel：作为Model和View之间的桥梁，负责处理业务逻辑，同时提供View需要的所有展示相关数据/逻辑（包括文本内容、图片URL、甚至布局参数）
• View（包括ViewController和Cell）：只负责接收ViewModel提供的数据，将其渲染出来，不包含任何业务或展示逻辑

而Cell的尺寸属于展示逻辑的一部分——它决定了View该怎么呈现内容，所以把这部分逻辑放在ViewModel里是完全符合职责划分的。ViewController在这里只是扮演了一个“传递者”的角色：它从ViewModel拿到布局参数，再传递给UICollectionView，本身并没有包含任何布局逻辑。

举个具体的实现例子 #

首先定义一个通用的Cell ViewModel协议，让所有Cell对应的ViewModel都遵守：

protocol CollectionCellViewModel {
    // 提供Cell尺寸的方法，也可以是只读属性
    func cellSize(for containerWidth: CGFloat) -> CGSize
}

然后针对不同类型的Cell实现对应的ViewModel：

// 文本Cell的ViewModel
class TextCellViewModel: CollectionCellViewModel {
    private let content: String
    
    init(content: String) {
        self.content = content
    }
    
    func cellSize(for containerWidth: CGFloat) -> CGSize {
        // 这里可以根据文本内容动态计算高度，或者返回固定值
        let textHeight = content.calculateHeight(withWidth: containerWidth, font: .systemFont(ofSize: 16))
        return CGSize(width: containerWidth, height: textHeight + 24) // 加上上下内边距
    }
}

// 图片卡片Cell的ViewModel
class ImageCardViewModel: CollectionCellViewModel {
    func cellSize(for containerWidth: CGFloat) -> CGSize {
        // 两列布局，间距8pt
        let itemWidth = (containerWidth - 24) / 2 // 24是左右边距+中间间距
        return CGSize(width: itemWidth, height: itemWidth * 1.2) // 固定宽高比
    }
}

最后在ViewController的代理方法中，直接从ViewModel获取尺寸：

extension YourCollectionVC: UICollectionViewDelegateFlowLayout {
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        let viewModel = yourDataSource[indexPath.item]
        return viewModel.cellSize(for: collectionView.bounds.width)
    }
}

额外优化点 #

如果你的布局逻辑需要响应屏幕旋转或者容器尺寸变化，可以在ViewController的viewWillTransition(to:with:)方法中刷新CollectionView，ViewModel会根据新的容器宽度重新计算尺寸，完全不需要在VC里写任何布局判断逻辑。

这种方式的好处很明显：

• ViewModel可以独立测试，比如你可以单独测试文本Cell的ViewModel在不同内容长度下返回的尺寸是否正确
• 布局逻辑和ViewController解耦，当你需要复用Cell和ViewModel到其他页面时，不需要重新写布局代码
• 所有展示相关的逻辑都集中在ViewModel里，ViewController保持简洁，只负责视图的生命周期管理和事件传递

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