以编程方式将UICollectionView嵌套在UIVIew中

Question

我正在尝试将一个UICollectionView放在一个UIView内，因为我所使用的框架要求返回一个UIView。我已经查看了这个问题：如何将UICollectionView作为子视图添加到UIView中？ 和 在没有故事板的情况下在UIView中添加UICollectionView ，但不确定如何使其工作。

我已经尝试过如下方法：

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
    }

}

我遇到了一个空白的屏幕。

更新：

这是我将TopView添加到UIViewController的方式：

class MainViewController: UIViewController {

    var mainView = TopView()

    override func viewDidLoad() {
        super.viewDidLoad()

        view.addSubview(mainView)
    }
}

我只看到一个黑屏。

- Chace

---

你需要为布局设置UICollectionViewDelegateFlowLayout。 - Jay Patel

这可能会有所帮助 https://stackoverflow.com/a/44359451/7084910 - Jay Patel

我已经看过了。但是现在我该如何显示这个视图？ - Chace

只需在UIViewController中像普通的UIView一样添加，并添加约束即可。 - Jay Patel

我已经将UIView嵌套在UIViewController中。但是它返回一个空白。当我添加断点时，似乎没有到达它。我还为UIView添加了颜色，并确保类是TopView。UIView出现了，但似乎没有接受该类。 - Chace

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)
    }    
}

视图控制器.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
}

在viewDidLoad()中调用addTopView()

- Jay Patel

---

我已经按照这个做了，但它仍然返回一个黑屏。 - Chace

你是否为UIViewController中的TopView分配了约束？ - Jay Patel

是的，就像你上面的例子一样。 - Chace

等等！我忘记在viewDidLoad里调用它了，现在它可以工作了 :) 在你的示例结束前最好提一下，这样我才能批准它 :) - Chace