如何在集合视图单元格中插入图像

Question

我想在集合视图单元格中插入三张图片，3 张图片。每个 cell.Only 一个部分一张图片。但是当模拟器显示黑屏时，没有任何图像。这是我的部分代码：

import Foundation
import UIKit

class CatImagesViewController:UIViewController,UICollectionViewDataSource,UICollectionViewDelegate
{
func numberOfSectionsInCollectionView(collectionView: UICollectionView) -> Int {
    return 1
}
func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {

    return 3
}

func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {

    let con = CatService(test:"test")

    let temp = NSUserDefaults()
    let  number = temp.integerForKey("num_of_images")

    var title_array:Array<String> = con.imageNamesForCategoryAtIndex(number)

    var string:String = title_array[indexPath.row]

    print("indexPath.row \(indexPath.row)");
    print("string is \(string)")

    let cell = collectionView.dequeueReusableCellWithReuseIdentifier("firstCollectionCell", forIndexPath: indexPath)

    let imageview:UIImageView=UIImageView(frame: CGRectMake(50, 50, self.view.frame.width-200, 50))
    let image:UIImage = UIImage(named:string)!
    imageview.image = image
   // self.view.addSubview(imageview)
    cell.contentView.addSubview(imageview)
    return cell
}
}

修改了cell.contentView.addSubview(image view)，还是黑屏

Answer 1

您需要将图像放入 contentView --

cell.contentView.addSubview (...)

此外，您在每张图片上重复使用同一帧，这会导致它们相互重叠。

Answer 2

你应该使用

cell.contentView.addSubview(imageview)

indexPath.row用于知道table中的单元格位置。

设置高度：

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
    return CGSizeMake(50, 414)
}

并且您应该使用 NSIndexPath

的属性项

func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {

let con = CatService(test:"test")

let temp = NSUserDefaults()
let  number = temp.integerForKey("num_of_images")

var title_array:Array<String> = con.imageNamesForCategoryAtIndex(number)

var string:String = title_array[indexPath.item]

print("indexPath.row \(indexPath.item)");
print("string is \(string)")

let cell = collectionView.dequeueReusableCellWithReuseIdentifier("firstCollectionCell", forIndexPath: indexPath)

let imageview:UIImageView=UIImageView(frame: CGRectMake(50, 0, self.view.frame.width-200, 50))
let image:UIImage = UIImage(named:string)!
imageview.image = image
cell.contentView.addSubview(imageview)
return cell
}

Answer 3

Swift 4 的代码：indexPath.row 用于了解 table 中的单元格位置。设置高度：

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {   
    return 1   
}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cell", for: indexPath)

    var imageview:UIImageView=UIImageView(frame: CGRect(x: 50, y: 50, width: 200, height: 200));

        var img : UIImage = UIImage(named:"Your image name")
        imageview.image = img

        cell.contentView.addSubview(imageview)

    return cell
}

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
    return CGSize(width: 50, height: 414)
}

Answer 4

当您向单元格添加子视图时，可以重复使用该单元格，这意味着您将在上下滚动时创建多个 UIImageView。这是我会使用的：

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "Cell", for: indexPath)
        
        for view in cell.contentView.subviews {
            view.removeFromSuperview()
        }
        
        let img = UIImageView(frame: cell.frame)
        img.image = UIImage(named: collectionViewData[indexPath.row])
        cell.contentView.addSubview(img)
        
        return cell
    }

Answer 5

对于 SWIFT 5 您可以使用 switch 语句并创建 Collection View Cell。

@IBOutlet weak var imageCell: UIImageView!

override func collectionView(_ collectionView: UICollectionView,

cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

let cell = collectionView.dequeueReusableCell(withReuseIdentifier: 

reuseIdentifier, for: indexPath) as! CollectionViewCell
     
    switch indexPath.row {

    case 0:

        cell.imageCell.image = ImageLiteral

    case 1:

        cell.imageCell.image = ImageLiteral

    case 2:

        cell.imageCell.image = ImageLiteral

    default:

        break

    }

    return cell
}

如何在集合视图单元格中插入图像

how to insert images in collection view cell

ios

swift

ios-autolayout