Nested vertical UICollectionView and dynamic height - swift

Question

I have a parent UICollectionView that nests 2 other UICollectionViews:
Parent UICollectionView (Vertical)
First nested UICollectionView (Horizontal) - Grey
Second nested UICollectionView (Vertical) - Red
The parent UICollectionView
I use numberOfSections(in collectionView:) and manually set the number of sections in the parent collection view. In this case I return 2; one for first (grey) nested horizontal UICollectionView and one for the second (red) nested vertical UICollectionView
Then in collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) I return 1. That means each nested UICollectionView will be placed inside a single item.
For each section I dequeue collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) a specific cell [see Nested UICollectionViews step 3] for the first nested horizontal UICollectionView and a specific cell [see Nested UICollectionViews step 3] for the second nested vertical UICollectionView.
Then I set the size of each item in section using collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath). This is where my problem begins. But let me continue on how I setup the nested UICollectionViews.
Nested UICollectionViews
This is a 3-step procedure for each nested UICollectionView:
I create the UICollectionViewCell (the appearance of the cell)
I use a UICollectionViewController to:
Fetch the data from Firebase
Dequeue the cell mentioned in step 1 and pass in the data fetched from Firebase
Set the dimensions of each item using collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath)
I create another UICollectionViewCell that:
Initializes the UICollectionViewController mentioned in step 2
Uses the view of this UICollectionViewController and adds it to the cell's contentView by filling the superview (aka the cell)
contentView.addSubview(UICollectionViewController().view) UICollectionViewController().view.fillSuperview()
The problem
When I set the dimensions of the section where the horizontal UICollectionView (grey) will be, I just need to match the height of the UICollectionView to the height of each cell.
But when I set the dimensions of the section where the vertical UICollectionView will be (red) I need to know the number of cells to calculate the correct height. Otherwise, the section could either be too big or too small.
Any idea how I can notify the parent UICollectionView controller of the number of cells of the vertical nested collection view?
Thanks in advance.

Answer 1

For those nested behaviours I recommend creating UICollectionView by code, instead of IB Storyboard, so you do not have to deal so much with autoresizing constraints. You can create UICollectionView programmatically (instead of UICollectionViewController with desired frame.size and then assigning UICollectionViewFlowLayout to it so you can better controll how big should be your item layout in your nested collectionView based on its frame. Some example code is here:
lazy var layout: UICollectionViewFlowLayout = {
let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
layout.itemSize = self.frame.size
layout.scrollDirection = .horizontal
layout.sectionInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
layout.minimumInteritemSpacing = 0
layout.minimumLineSpacing = 0
return layout
}()
lazy var customCollectionView: UICollectionView = {
let collectionView = UICollectionView(frame: CGRect(x: 0, y: 0, width: self.frame.width, height: self.frame.width * 0.5), collectionViewLayout: self.layout)
collectionView.backgroundColor = UIColor.clear
collectionView.dataSource = self
collectionView.delegate = self
let collectionCellNib = UINib.init(nibName: "CustomCell", bundle: Bundle.main)
collectionView.register(collectionCellNib, forCellWithReuseIdentifier: "customCellId")
return collectionView
}()