iOS - 未应用我的 UICollectionViewCell 上的自定义

Question

我正在使用堆叠在 ScrollView 内的 StackLayout 中的多个水平 UICollectionViews 对 iOS 应用程序进行编程。 我想在这些集合视图中显示图像，但我的自定义 UICollectionViewCell 没有显示任何内容。

这是我在做什么

我已经按照本教程中的多个收集意见，这一个自定义单元格。

这是我的 ViewController ：

import UIKit

struct CustomImage {
    var title: String
    var image: UIImage
}

class ViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout {

@IBOutlet weak var perspectiveCV: UICollectionView!
@IBOutlet weak var monkeyCV: UICollectionView!
@IBOutlet weak var beachCV: UICollectionView!

let perspectiveImages = [
    CustomImage(title: "Perspective 1", image: #imageLiteral(resourceName: "perspective-1")),
    CustomImage(title: "Perspective 2", image: #imageLiteral(resourceName: "perspective-2")),
    CustomImage(title: "Perspective 3", image: #imageLiteral(resourceName: "perspective-3")),
    CustomImage(title: "Perspective 4", image: #imageLiteral(resourceName: "perspective-4")),
    CustomImage(title: "Perspective 5", image: #imageLiteral(resourceName: "perspective-5")),
    CustomImage(title: "Perspective 6", image: #imageLiteral(resourceName: "perspective-6"))
]

let monkeyImages = [
    CustomImage(title: "Monkey 1", image: #imageLiteral(resourceName: "monkey-1")),
    CustomImage(title: "Monkey 1", image: #imageLiteral(resourceName: "monkey-2")),
    CustomImage(title: "Monkey 1", image: #imageLiteral(resourceName: "monkey-3"))
]

let beachImages = [
    CustomImage(title: "Beach 1", image: #imageLiteral(resourceName: "beach-1")),
    CustomImage(title: "Beach 2", image: #imageLiteral(resourceName: "beach-2")),
    CustomImage(title: "Beach 3", image: #imageLiteral(resourceName: "beach-3")),
    CustomImage(title: "Beach 4", image: #imageLiteral(resourceName: "beach-4"))
]

override func viewDidLoad() {
    super.viewDidLoad()
    title = "Images"

    setupCollectionViews()
}

fileprivate func setupCollectionViews() {
    // Heights
    perspectiveCV.heightAnchor.constraint(equalTo: view.widthAnchor, multiplier: 0.8).isActive = true
    monkeyCV.heightAnchor.constraint(equalTo: view.widthAnchor, multiplier: 0.8).isActive = true
    beachCV.heightAnchor.constraint(equalTo: view.widthAnchor, multiplier: 0.8).isActive = true

    // Left and right padding
    perspectiveCV.contentInset = UIEdgeInsets(top: 0, left: 20, bottom: 0, right: 20)
    monkeyCV.contentInset = UIEdgeInsets(top: 0, left: 20, bottom: 0, right: 20)
    beachCV.contentInset = UIEdgeInsets(top: 0, left: 20, bottom: 0, right: 20)

    // Hide scrolling indicator
    perspectiveCV.showsHorizontalScrollIndicator = false
    monkeyCV.showsHorizontalScrollIndicator = false
    beachCV.showsHorizontalScrollIndicator = false
}

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    switch collectionView {
    case monkeyCV:
        return monkeyImages.count
    case beachCV:
        return beachImages.count
    default:
        return perspectiveImages.count
    }
}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    switch collectionView {
    case monkeyCV:
        let monkeyCell = monkeyCV.dequeueReusableCell(withReuseIdentifier: "monkeyCell", for: indexPath) as! ImageCollectionViewCell
        monkeyCell.backgroundColor = UIColor.systemOrange
        monkeyCell.data = monkeyImages[indexPath.row]
        return monkeyCell
    case beachCV:
        let beachCell = beachCV.dequeueReusableCell(withReuseIdentifier: "beachCell", for: indexPath) as! ImageCollectionViewCell
        beachCell.backgroundColor = UIColor.systemBlue
        beachCell.data = beachImages[indexPath.row]
        return beachCell
    default:
        let perspectiveCell = perspectiveCV.dequeueReusableCell(withReuseIdentifier: "perspectiveCell", for: indexPath) as! ImageCollectionViewCell
        perspectiveCell.backgroundColor = UIColor.systemRed
        perspectiveCell.data = perspectiveImages[indexPath.row]
        return perspectiveCell
    }
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    return CGSize(width: collectionView.frame.width * 0.8, height: collectionView.frame.width * 0.8)
}

}

这是我的自定义 UICollectionViewCell ：

import UIKit

class ImageCollectionViewCell: UICollectionViewCell {

var data: CustomImage? {
    didSet {
        guard let data = data else { return }
        bg.image = data.image
    }
}

fileprivate let bg: UIImageView = {
    let iv = UIImageView()
    iv.translatesAutoresizingMaskIntoConstraints = false
    iv.contentMode = .scaleAspectFit
    iv.clipsToBounds = true
    return iv
}()

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

    bg.topAnchor.constraint(equalTo: contentView.topAnchor).isActive = true
    bg.leadingAnchor.constraint(equalTo: contentView.leadingAnchor).isActive = true
    bg.trailingAnchor.constraint(equalTo: contentView.trailingAnchor).isActive = true
    bg.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).isActive = true

    contentView.addSubview(bg)
}

required init?(coder: NSCoder) {
    super.init(coder: coder)
}
}

这是我的故事板

你能向我解释我的代码有什么问题吗？

我的设置：

• 斯威夫特版本：5.1.3
• Xcode 版本：11.3.1
• 目标 iOS 版本：13.2
• MacBook Pro（13 英寸，2016，四个 Thunderbolt 3 端口）MacOS Catalina 10.15.2 (19C57)

Answer 1

看起来您还没有建立分配给每个集合视图的委托/数据源。

在您的视图中确实加载将委托和数据源连接到您的每个集合视图。

self.mycollectionView1.delegate = self
self.mycollectionView1.datasource = self
self.mycollectionView2.delegate = self
self.mycollectionView2.datasource = self
self.mycollectionView3.delegate = self
self.mycollectionView3.datasource = self

您还可以通过故事板设置委托和数据源。 您可以选择每个 collectionView 和 ctrl + 拖动到您的 ViewController 而不是 VIEW！

请注意上图中突出显示的部分。 这表示您的 viewController。 Ctrl + 将每个集合视图拖动到该点并单击委托和数据源

编辑 - - -

而不是像你在这里那样使用 switch 语句

switch collectionView {
    case monkeyCV:
        let monkeyCell = monkeyCV.dequeueReusableCell(withReuseIdentifier: "monkeyCell", for: indexPath) as! ImageCollectionViewCell
        monkeyCell.backgroundColor = UIColor.systemOrange
        monkeyCell.data = monkeyImages[indexPath.row]
        return monkeyCell
    case beachCV:
        let beachCell = beachCV.dequeueReusableCell(withReuseIdentifier: "beachCell", for: indexPath) as! ImageCollectionViewCell
        beachCell.backgroundColor = UIColor.systemBlue
        beachCell.data = beachImages[indexPath.row]
        return beachCell
    default:
        let perspectiveCell = perspectiveCV.dequeueReusableCell(withReuseIdentifier: "perspectiveCell", for: indexPath) as! ImageCollectionViewCell
        perspectiveCell.backgroundColor = UIColor.systemRed
        perspectiveCell.data = perspectiveImages[indexPath.row]
        return perspectiveCell
    }

尝试像这样建立你的细胞

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath)-> UICollectionViewCell {
      let cell = myCollectionView1.dequeueResuableCell(withReuseIdentifier: "myIdentifier", for: indexPath) as! mycustomCellClass
      cell.backgroundColor = UIColor.systemOrange
      return cell


      if collectionView == mycollectionView2 {
          let cell2 = mycollectionView2.dequeueResuableCell(withReuseIdentifier: "myIdentifier2", for: indexPath) as! mycustomCellClass
          cell2.backgroundColor = UIColor.systemBlue
      }

}

等等。 您可能还需要修改 numberOfItemsInSection 函数以替换该 switch 语句。

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    switch collectionView {
    case monkeyCV:
        return monkeyImages.count
    case beachCV:
        return beachImages.count
    default:
        return perspectiveImages.count
    }
}

从上面改成下面

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
     if (collectionView == mycollectionView1 { 
        return monkeyImages.count
     } else if (collectionView == myCollectionView2 {
        return beachImages.count
     } else {
       //this is your final collectionview 
       return persepctiveImages.count
     }
}

编辑 2-----------

尝试删除 sizeForItemAt

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    return CGSize(width: collectionView.frame.width * 0.8, height: collectionView.frame.width * 0.8)
}

转到您的故事板并实际拖动您希望单元格的大小。 在尺寸检查器的右侧面板上，确保“估计尺寸”选项设置为无。

你也可以试试这个。

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
    return CGSize(width: (collectionView.frame.size.width/3), height: collectionView.frame.size.height)
}

除以 3 得到三个单元格。