Transition between two UICollectionView layouts causes inconsistency error - swift

Question

I have a navigation controller and on viewDidAppear it pushes a UICollectionViewController called SingleBlueSquareCollectionViewController. There is a single blue square UICollectionViewCell positioned center and towards the bottom of the collectionView. When you tap the blue cell I push another CollectionViewController, TriangleCollectionViewController, which places the blue square at the top and center and adds two red cells at either corner of the viewController. This is what I expected to happen but I get an NSInconsistencyError instead: UICollectionView received layout attributes for a cell with an index path that does not exist.
The error makes sense. One view controller has a single element but another view controller has 3. But I don't want the triangleViewController to get information from SingleBlue. Is there a way around this? And also the bigger question is Can you transition between two layouts with different number of elements?
If so, what am I doing wrong? How should I actually be handling this. Is there an animation object to provide my collectionViews? This use case is a test for something I want to try in another app which has a view controller with a few complex layouts (so I totally understand that this use case could be done with some UIViews and animating things like the blue square around easily).
Here's some source code:
class SingleBlueSquare: UICollectionViewLayout {
var cache : [UICollectionViewLayoutAttributes] = [UICollectionViewLayoutAttributes]()
override func prepare() {
configureCache()
}
override var collectionViewContentSize: CGSize { return CGSize(width: collectionView!.frame.width,
height: collectionView!.frame.height) }
override func prepareForTransition(from oldLayout: UICollectionViewLayout) {
configureCache()
}
func configureCache() {
guard let collection = collectionView else {return}
let first = IndexPath(item: 0, section: 0)
let blue = UICollectionViewLayoutAttributes(forCellWith: first)
let size : CGSize = .init(width: 50, height: 50)
blue.frame = CGRect(origin: .init(x: collection.frame.width/2,
y: collection.frame.height - size.height),
size: size)
cache = [blue]
}
override func layoutAttributesForItem(at indexPath: IndexPath) -> UICollectionViewLayoutAttributes? {
return cache[indexPath.item]
}
override func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]? {
return cache
}
TriangleLayout
class TriangleLayout: UICollectionViewLayout {
var cache : [UICollectionViewLayoutAttributes] = [UICollectionViewLayoutAttributes]()
override func prepare() {
configureCache()
}
override func prepareForTransition(to newLayout: UICollectionViewLayout) {
cache.removeAll()
}
override var collectionViewContentSize: CGSize { return CGSize(width: collectionView!.frame.width,
height: collectionView!.frame.height) }
override func prepareForTransition(from oldLayout: UICollectionViewLayout) {
configureCache()
}
func configureCache() {
guard let collection = collectionView else {return}
cache.removeAll()
let first = IndexPath(item: 0, section: 0)
let second = IndexPath(item: 1, section: 0)
let third = IndexPath(item: 2, section: 0)
let blue = UICollectionViewLayoutAttributes(forCellWith: first)
let red = UICollectionViewLayoutAttributes(forCellWith: second)
let red2 = UICollectionViewLayoutAttributes(forCellWith: third)
let size : CGSize = .init(width: 50, height: 50)
blue.frame = CGRect(origin: .init(x: collection.frame.width/2,
y: 0),
size: size)
red.frame = CGRect(origin: .init(x: 0,
y: collection.frame.height - 50),
size: size)
red2.frame = CGRect(origin: .init(x: collection.frame.width - 50,
y: collection.frame.height - 50),
size: size)
cache = [blue, red, red2]
}
override func layoutAttributesForItem(at indexPath: IndexPath) -> UICollectionViewLayoutAttributes? {
return cache[indexPath.item]
}
override func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]? {
return cache
}
}
SingleCollectionViewController
private let reuseIdentifier = "blue"
class SingleBlueCollectionViewController: UICollectionViewController {
init() {
super.init(collectionViewLayout: SingleBlueSquare())
useLayoutToLayoutNavigationTransitions = false
}
override init(collectionViewLayout layout: UICollectionViewLayout) {
super.init(collectionViewLayout: layout)
}
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
}
override func viewDidLoad() {
super.viewDidLoad()
self.collectionView!.register(UICollectionViewCell.self, forCellWithReuseIdentifier: reuseIdentifier)
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
override func viewWillAppear(_ animated: Bool) {
super.viewWillAppear(animated)
self.collectionView?.reloadData()
self.collectionView?.layoutIfNeeded()
}
// MARK: UICollectionViewDataSource
override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 1
}
override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: reuseIdentifier, for: indexPath)
cell.backgroundColor = indexPath.item == 0 ? UIColor.blue : UIColor.red
return cell
}
override func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
guard let cell = collectionView.cellForItem(at: indexPath), cell.backgroundColor == UIColor.blue else {return}
collectionView.collectionViewLayout.invalidateLayout()
navigationController?.pushViewController(TriangleCollectionViewController(), animated: true)
}
}
Here's the triangle view controller
private let reuseIdentifier = "triangle"
class TriangleCollectionViewController : SingleBlueCollectionViewController {
override init() {
super.init(collectionViewLayout: TriangleLayout())
useLayoutToLayoutNavigationTransitions = true
}
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
}
override func viewDidLoad() {
super.viewDidLoad()
// Register cell classes
self.collectionView!.register(UICollectionViewCell.self, forCellWithReuseIdentifier: reuseIdentifier)
self.collectionView?.reloadData()
self.collectionView?.collectionViewLayout.invalidateLayout()
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
}
// MARK: UICollectionViewDataSource
override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 3
}
override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: reuseIdentifier, for: indexPath)
cell.backgroundColor = indexPath.item == 0 ? UIColor.blue : UIColor.red
return cell
}
override func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
guard let cell = collectionView.cellForItem(at: indexPath), cell.backgroundColor == UIColor.blue else {return}
navigationController?.popViewController(animated: true)
}
}