以编程方式将UIImage添加到集合视图单元格中

Question

这是我的集合视图单元格的自定义类：

import UIKit

class NavBarCell: UICollectionViewCell {

    var avatarImageView: UIImageView = {
        var avatarView = UIImageView()
        avatarView.contentMode = .scaleAspectFit

        return avatarView
    }()

    override init(frame: CGRect) {
        super.init(frame: frame)

        avatarImageView = UIImageView()
        contentView.addSubview(avatarImageView)
    }

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

}

然后在我的控制器的viewDidLoad中

    let layout:UICollectionViewFlowLayout = UICollectionViewFlowLayout.init()
    navBarCollectionView.setCollectionViewLayout(layout, animated: true)
    navBarCollectionView.backgroundColor = UIColor.clear
    navBarCollectionView.register(NavBarCell.self, forCellWithReuseIdentifier: "cell")
    navBarCollectionView.delegate = self
    navBarCollectionView.dataSource = self
    layout.scrollDirection = .horizontal
    self.navigationController?.navigationBar.addSubview(navBarCollectionView)
    navBarCollectionView.reloadData()

在cellForItem我有：

        let navBarCell = (collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath)) as! NavBarCell

        var image : UIImage = UIImage(named: "TestImage")!
        navBarCell.avatarImageView.image = image
        navBarCell.avatarImageView.layer.borderWidth = 1
        navBarCell.avatarImageView.layer.borderColor = UIColor.getRandomColor().cgColor
        navBarCell.avatarImageView.layer.cornerRadius = 20

        return navBarCell

但是没有显示图像视图。 如果添加navBarCell.backgroundColor = UIColor.red则显示单元格，但不显示图像。

我缺少什么，还是执行不正确？

Answer 1

UICollectionViewCell已经是一个视图，您可以直接向其添加avatarImageView ：

addSubview(avatarImageView)

您还可以设置约束，例如：

avatarImageView.translatesAutoresizingMaskIntoConstraints = false
avatarImageView.topAnchor.constraint(equalTo: topAnchor).isActive = true
avatarImageView.leftAnchor.constraint(equalTo: leftAnchor).isActive = true
avatarImageView.rightAnchor.constraint(equalTo: rightAnchor).isActive = true
avatarImageView.heightAnchor.constraint(equalToConstant: 300).isActive = true

Answer 2

最佳实践是创建一个原型单元并在界面生成器中添加图像视图。 在这种特定情况下，我认为错误是您没有为图像视图设置框架以缩放到单元格框架。

尝试打印出图像视图的框架，它可能会显示0,0,0,0。