Cells inside TableView inside of a CollectionView have incorrect height on first load (Swift 4)

Question

I have a tableView inside several CollectionView Cells. Each tableView takes up the full size of the cell. The CollectionView is swiped horizontally.

CollectionView:

collectionView.frame = .zero
collectionView.backgroundColor = UIColor.clear
collectionView.dataSource = self as UICollectionViewDataSource
collectionView.delegate = self as UICollectionViewDelegate
collectionViewLayout.scrollDirection = .horizontal
collectionViewLayout.minimumLineSpacing = 0.0
collectionViewLayout.minimumInteritemSpacing = 0.0
collectionViewLayout.estimatedItemSize = CGSize(width: view.frame.width, height: view.frame.height)
collectionView.collectionViewLayout = collectionViewLayout
collectionView.isPagingEnabled = true
collectionView.register(collectionViewCell.self, forCellWithReuseIdentifier: collectionViewCellID)
collectionView.translatesAutoresizingMaskIntoConstraints = false

collectionView.leadingAnchor.constraint(equalTo: view.leadingAnchor).isActive = true
collectionView.trailingAnchor.constraint(equalTo: view.trailingAnchor).isActive = true
collectionView.topAnchor.constraint(equalTo: headerView.bottomAnchor).isActive = true
collectionView.bottomAnchor.constraint(equalTo: view.bottomAnchor).isActive = true

TableView inside the cell of the CollectionView:

tableView.delegate = self
tableView.dataSource = self
tableView.translatesAutoresizingMaskIntoConstraints = false
tableView.register(tableViewCell.self, forCellReuseIdentifier: "tableViewCell")
tableView.register(tableViewCell.self, forCellReuseIdentifier: "emptyTableViewCell")
tableView.rowHeight = UITableViewAutomaticDimension
tableView.estimatedRowHeight = 105

tableView.topAnchor.constraint(equalTo: topAnchor).isActive = true
tableView.bottomAnchor.constraint(equalTo: bottomAnchor).isActive = true
tableView.leftAnchor.constraint(equalTo: leftAnchor).isActive = true
tableView.rightAnchor.constraint(equalTo: rightAnchor).isActive = true

The tableView is reloaded under cellForItemAt of the CollectionView and has a custom cell. The custom tableView cell contains several small views that are added to a single view called 'cellView' which takes up the entire size of the cell:

let cellView = UIView()
addSubview(cellView)
cellView.translatesAutoresizingMaskIntoConstraints = false
cellView.topAnchor.constraint(equalTo: topAnchor).isActive = true
cellView.leadingAnchor.constraint(equalTo: leadingAnchor).isActive = true
cellView.trailingAnchor.constraint(equalTo: trailingAnchor).isActive = true
cellView.bottomAnchor.constraint(equalTo: bottomAnchor).isActive = true

So... it loads like this:

1) Load CollectionView

2) Load CollectionViewCell

3) Load TableView inside CollectionViewCell

4) Reload TableView

But... when it loads the first time the individual cells of the TableView are cut down in size:

The only way for the cells to have the correct height is if the entire CollectionView is reloaded. Once this happens everything displays correctly.

I thought it might have to do with the estimatedRowHeight but I've adjusted this with no impact. It's as if the tableView is initially setting the size of the custom cell to that of a typical "non-custom" cell when it first loads.

This is what each tableView cell is supposed to look like.

Any ideas?

Answer 1

I ended up reloading the tableView (not the collectionView) in viewDidAppear but it only runs once (when the app starts). This solves the problem.

This link has some interesting ideas regarding the dynamic height of tableView cells but nothing worked in my particular case.

Answer 2

Not sure if this will help, but it looks like your cells have images. I had issues with dynamic height cells if I did not put a placeholder image inside the image view.