Variable height CollectionView inside a self-sized TableView cell with AutoLayout on iOS8+

Question

I have a UITableView with self-sized cell's height using UITableViewAutomaticDimension and AutoLayout constraints. On one of prototype cells I need to add UICollectionView with UICollectionViewFlowLayout which will layout cells vertically in a single column for Compact Size Classes or in grid of 3 columns for Regular Size Classes. The height of the collection view is therefore dynamic and the layout may change even on rotation on iPhone 6 Plus (Compact->Regular).

I setup my tableview with custom prototype cells in storyboard and add the custom collectionview into a prototype cell, AutoLayout constraints always to zero to the corresponding edge of the superview (leading, trailing, top, bottom = 0 to superview) ... collectionView->tableviewContentView->tableviewCell.

I need the variable height of the collection view to drive the height of the tableview prototype cell. So far I am always getting the following AutoLayout error on runtime.

Warning once only: Detected a case where constraints ambiguously suggest a height of zero for a tableview cell's content view. We're considering the collapse unintentional and using standard height instead.

Can you please suggest the right approach to this? Thank you!

Main TableViewController:

class TableViewController: UITableViewController {
    override func viewDidLoad() {
        super.viewDidLoad()
        tableView.estimatedRowHeight = 200.0
        tableView.rowHeight = UITableViewAutomaticDimension
    }
    /// ... plus tableview datasource functions
}

CollectionView:

class AttachmentCollectionView: UICollectionView, UICollectionViewDataSource, UICollectionViewDelegate {

    override func awakeFromNib() {
        let nib = UINib(nibName: Constants.AttachmentCollectionView.cellNibName, bundle: nil)
        registerNib(nib, forCellWithReuseIdentifier: Constants.AttachmentCollectionView.cellIdentifier)
        collectionViewLayout = attachmentFlowLayout()
        dataSource = self
        delegate = self
        backgroundColor = UIColor.whiteColor()
    }

    private func attachmentFlowLayout() -> UICollectionViewFlowLayout {
        let layout = UICollectionViewFlowLayout()
        layout.scrollDirection = .Vertical
        layout.itemSize = CGSize(width: 70, height: 50)
        layout.sectionInset = UIEdgeInsets(top: 0.0, left: 0.0, bottom: 0.0, right: 0.0)
        layout.minimumLineSpacing = 0.0
        layout.minimumInteritemSpacing = 0.0
        layout.headerReferenceSize = CGSizeMake(0.0, 0.0)
        layout.footerReferenceSize = CGSizeMake(0.0, 0.0)
        return layout
    }
    // ...plus collectionview datasource functions
}

If have you finished it then can you send me a demo code for it , i have 5 section in table view , and in the last section one row there is a collection view,without scrollable , i want its dynamic size with dynamic table cell size — Ravi Ojha

dudeman dudeman · Accepted Answer · 2015-12-14T22:00:47

I think implementing the tableView's delegate method tableView(_ tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat may work.

Variable height CollectionView inside a self-sized TableView cell with AutoLayout on iOS8+

1 Answers