Swift3 - Visual Format Constraint crashing

Question

Im trying to add constraints to a UICollectionViewCell with the visual format in the setupViews() function but whenever I set them and then run the code the constraints crash and no cells are displayed. I get the Error of: [LayoutConstraints] Unable to simultaneously satisfy constraints. Any idea why this is happening?

import UIKit

class MainController: UICollectionViewController, UICollectionViewDelegateFlowLayout {

override func viewDidLoad() {
    super.viewDidLoad()

    let navBar: UINavigationBar = UINavigationBar(frame: CGRect(x: 0, y: 0, width: view.frame.width, height: 50))
    self.view.addSubview(navBar)
    let navItem = UINavigationItem(title: "Drops")
    navItem.rightBarButtonItem = UIBarButtonItem(title: "Logout", style: .plain, target: self, action: #selector(handleLogout))
    navBar.setItems([navItem], animated: false);

    collectionView?.backgroundColor = UIColor.white
    collectionView?.register(ImageCell.self, forCellWithReuseIdentifier: "cell-id")
}

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: "cell-id", for: indexPath)
    return cell
 }

func handleLogout() {
    let loginController = LoginController()
    present(loginController, animated: true, completion: nil)
  }
}

class ImageCell: UICollectionViewCell {
override init(frame: CGRect) {
    super.init(frame: frame)
    setupViews()
 }

let smallCellView: UIImageView = {
    let imgview = UIImageView()
    imgview.translatesAutoresizingMaskIntoConstraints = false
    imgview.backgroundColor = UIColor.purple
    return imgview
 }()

let largeCellView: UIImageView = {
    let imgview = UIImageView()
    imgview.translatesAutoresizingMaskIntoConstraints = false
    imgview.backgroundColor = UIColor.green
    return imgview
 }()

func setupViews(){
    //addSubview(smallCellView)
    addSubview(largeCellView)

    addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|-50-[v1]-50-|", options: NSLayoutFormatOptions(), metrics: nil, views: ["v1" : largeCellView]))
    addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|-50-[v1]-50-|", options: NSLayoutFormatOptions(), metrics: nil, views: ["v1" : largeCellView]))

 }

required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
 }

}

Answer 1

You need to ensure that the constrained views can fit inside your collection view cell; i.e. With a margin of 50 on top/bottom/left/right around your image view, your collection view cell must be at least 100 x 100 (and this will result in a 0 size image view) in order to avoid a unsatisfiable constraint error.

You can set the cell size in your storyboard if you are using it or implement the UICollectionViewDelegateFlowLayout sizeForItemAt