Nest a UICollectionView inside a UIVIew programmatically - ios

Question

I am attempting to get a UICollectionView to be inside a UIView as the framework I'm using requires a UIView to be returned. I have looked at this question: How do I add a UICollectionView to a UIView as a subview? and Adding UICollectionView inside UIView without Storyboards but not sure how to get it to work.
I have a attempted it like this:
class TopView : UIView, UICollectionViewDataSource, UICollectionViewDelegate {
override init(frame: CGRect) {
super.init(frame: frame)
self.backgroundColor = .red
addSubview(collectionView)
}
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
}
lazy var collectionView : UICollectionView = {
let layout = UICollectionViewFlowLayout()
let cv = UICollectionView(frame: CGRect.zero, collectionViewLayout: layout)
cv.translatesAutoresizingMaskIntoConstraints = false
cv.delegate = self
cv.dataSource = self
cv.register(HeaderCell.self, forCellWithReuseIdentifier: "HeaderCell")
cv.backgroundColor = .yellow
return cv
}()
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 1
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "HeaderCell", for: indexPath) as! HeaderCell
return cell
}
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
return CGSize(width: self.collectionView.frame.width, height: 200)
}
func collectionView(_ collectionView: UICollectionView, numberOfSections section: Int) -> Int {
return 1
}
}
But I'm getting a blank screen.
Update:
This is how I add the TopView to a UIViewController:
class MainViewController: UIViewController {
var mainView = TopView()
override func viewDidLoad() {
super.viewDidLoad()
view.addSubview(mainView)
}
}
I get just a black screen.

Answer 1

TopView.swift
class TopView : UIView, UICollectionViewDataSource, UICollectionViewDelegate {
lazy var collectionView : UICollectionView = {
let layout = UICollectionViewFlowLayout()
let cv = UICollectionView(frame: CGRect.zero, collectionViewLayout: layout)
//If you set it false, you have to add constraints.
cv.translatesAutoresizingMaskIntoConstraints = false
cv.delegate = self
cv.dataSource = self
cv.register(HeaderCell.self, forCellWithReuseIdentifier: "HeaderCell")
cv.backgroundColor = .yellow
return cv
}()
override init(frame: CGRect) {
super.init(frame: frame)
self.backgroundColor = .red
addSubview(collectionView)
//Add constraint
collectionView.leadingAnchor.constraint(equalTo: leadingAnchor).isActive = true
collectionView.trailingAnchor.constraint(equalTo: trailingAnchor).isActive = true
collectionView.topAnchor.constraint(equalTo: topAnchor).isActive = true
collectionView.bottomAnchor.constraint(equalTo: bottomAnchor).isActive = true
}
required init?(coder aDecoder: NSCoder) {
super.init(coder: aDecoder)
}
func collectionView(_ collectionView: UICollectionView, numberOfSections section: Int) -> Int {
return 1
}
func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
return 30
}
func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "HeaderCell", for: indexPath) as! HeaderCell
cell.backgroundColor = .cyan
return cell
}
func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
return CGSize(width: self.collectionView.frame.size.width, height: 200)
}
}
ViewController.swift
lazy var topView: TopView = {
let tv = TopView()
tv.translatesAutoresizingMaskIntoConstraints = false
return tv
}()
func addTopView() {
view.addSubview(topView)
topView.leadingAnchor.constraint(equalTo: view.leadingAnchor).isActive = true
topView.trailingAnchor.constraint(equalTo: view.trailingAnchor).isActive = true
topView.topAnchor.constraint(equalTo: view.topAnchor, constant: 300).isActive = true
topView.widthAnchor.constraint(equalTo: view.widthAnchor).isActive = true
topView.heightAnchor.constraint(equalToConstant: 200).isActive = true
}
Call addTopView() from viewDidLoad()