UICollectionView 中的 UIImageView 未正确绘制

Posted 2023-03-14

【中文标题】UICollectionView 中的 UIImageView 未正确绘制

【英文标题】：UIImageView in UICollectionView not drawing correctly

【发布时间】：2017-08-01 17:06:41

【问题描述】：

我有一个应用程序，其屏幕分为四个相等的单元格。每个单元格都有一个图像、标签和颜色。我正在尝试添加图像，但由于某种原因，只有第一个单元格中的图像有效。

现在看起来像这样：

这是我的代码： 在 ViewController.swift 中：

override func viewDidLoad() 
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.

    colorArray += [UIColor.red, UIColor.blue, UIColor.green, UIColor.yellow]

    pictureArray += [UIImage(named: "budget")!, UIImage(named: "journey")!,
                     UIImage(named: "learn")!, UIImage(named: "settings")!]

    titleArray += ["Budget", "Journey", "Learn", "Settings"]


override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int 

    return 4


override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 

    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath) as UICollectionViewCell


    // Set cell properties
    cell.backgroundColor = colorArray[indexPath.row]

    let imageview:UIImageView=UIImageView(image: pictureArray[indexPath.row])
    let size = CGSize(width: 100, height: 100)
    imageview.center = cell.center
    imageview.bounds = CGRect(origin: cell.bounds.origin, size: size)

    cell.contentView.addSubview(imageview)

    let label = cell.viewWithTag(1) as! UILabel
    label.text = titleArray[indexPath.row]

    return cell

标签和颜色工作正常，但由于某种原因，图像视图似乎不在屏幕上。我有一种感觉，我的中心/边界限制迫使图像离开屏幕，但我尝试了很多组合，但它们似乎都不适合我。

我应该怎么做？

【问题讨论】：

如果使用原型单元格会更好。您是否尝试过查看视图层次结构？

在 pictureArray 的开头放置一些其他图像并检查该图像是否也在第一个单元格中绘制？

@YogeshSuthar 我创建了自己的 UICollectionViewCell 子类，其中包含图像和标题的 IBOutlet 并且它有效！谢谢！

【参考方案1】：

我在这里发布了谁会用谷歌搜索的正确答案。 （因为它在一小时前就解决了，没有人发布答案）

最佳做法是继承UICollectionViewCell，连接所有出口（标签、图像等）并在单元格上使用此类

祝大家好运

【参考方案2】：

在 Yogesh Suthar 的评论之后，这是有效的：

我继承了UICollectionViewCell，连接了图片和标签：

class NavigationCollectionViewCell: UICollectionViewCell 
    @IBOutlet weak var navImage: UIImageView!
    @IBOutlet weak var navLabel: UILabel!

然后，在 ViewController 中，我这样做了：

override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 

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


    // Set cell properties
    cell.backgroundColor = colorArray[indexPath.row]

    cell.navImage.image = imageArray[indexPath.row]

    cell.navLabel.text = titleArray[indexPath.row]

    return cell

在Main.storyboard中设置图片和标签的大小和位置！

【参考方案3】：

将所需的视图作为子类插入，并将所有约束设置为 cell.heightAchor 等等。由于某种原因，这将修复错误。如果子视图作为子视图而不是作为单元格的属性添加到单元格中，则它可以工作