在 Swift 中分别在单个列中显示多个 CollectionView Cell

Question

我在集合视图中有 4 个部分，所以我需要 4 个集合视图单元。当 numberOfItemsInSection 增加时，它显示在下一行，但我想分别在单列的同一部分显示。它的滚动方向是垂直的。

这是我工作的图像。

enter image description here

enter image description here

import UIKit

class CollectionVC: UIViewController, UICollectionViewDelegate , 
UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {



@IBOutlet weak var collectionView:UICollectionView!


var englishArray = ["You", "Apple" , "Me" , "Developer",  "Phone" , "Time"]
var hindiArray = ["आप","सेब","मैं","डेवलपर","फ़ोन","समय"]

var emptyArray = ["1","2","3","4","5","6"]

override func viewDidLoad() {
    super.viewDidLoad()

}


func numberOfSections(in collectionView: UICollectionView) -> Int {
    return 4
}

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
    
    if section == 0 {
        return englishArray.count
    } else if section == 1 {
        return englishArray.count
    } else if section == 2 {
        return englishArray.count
    } else {
        return englishArray.count
    }
    
    
}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    
    if indexPath.section == 0 {
        
        let  Cell  =  collectionView.dequeueReusableCell(withReuseIdentifier: "EnglishCollectionViewCell", for: indexPath) as! EnglishCollectionViewCell
        return Cell
        
        
        
    } else if indexPath.section == 1 {
        
        let  Cell  =  collectionView.dequeueReusableCell(withReuseIdentifier: "AnswerCollectionViewCell", for: indexPath) as! AnswerCollectionViewCell
        return Cell
    } else if indexPath.section == 2 {
        
        let  Cell  =  collectionView.dequeueReusableCell(withReuseIdentifier: "StatusCollectionViewCell", for: indexPath) as! StatusCollectionViewCell
        return Cell
    } else {
        
        let  Cell  =  collectionView.dequeueReusableCell(withReuseIdentifier: "HindiCollectionViewCell", for: indexPath) as! HindiCollectionViewCell
        return Cell
    }
    
    
}

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize
{

    if indexPath.section == 0 {
        

        let width  = (view.frame.width-10)/4
        return CGSize(width: width, height: width)
        
        
    } else if indexPath.section == 1 {
        let width  = (view.frame.width-10)/4
        return CGSize(width: width, height: width)

      
    } else if indexPath.section == 2 {
        let width  = (view.frame.width-10)/4
        return CGSize(width: width, height: width)

      
    } else {
        let width  = (view.frame.width-10)/4
        return CGSize(width: width, height: width)
    }
    
      
}


@IBAction func resetButton(sender:UIButton) {
    hindiArray.shuffle()
    collectionView.reloadData()
    
}

}

请帮我解决这个问题。

Answer 1

对于您想要的输出，您必须使用嵌套集合视图的概念。 用简单的语言你必须在collectionviewcell中使用collectionview。

这里有mainCollectionView。然后在这个集合的每个单元格上创建并初始化一个新的UICollectionView 并且正确的地方是在 UICollectionView 的以下委托中

例如，我在这里初始化MainCollectionViewCell，然后MainCollectionViewCell 处理创建新UICollectionView 的逻辑

guard let collectionViewCell = cell as? MainCollectionViewCell else { return }
    
    collectionViewCell.delegate = self
    
    let dataProvider = ChildCollectionViewDataSource()
    dataProvider.data = data[indexPath.row] as NSArray
    
    let delegate = ChildCollectionViewDelegate()
    
    collectionViewCell.initializeCollectionViewWithDataSource(dataProvider, delegate: delegate, forRow: indexPath.row)
    
    collectionViewCell.collectionViewOffset = storedOffsets[indexPath.row] ?? 0

这是MainCollectionViewCell 上的初始化程序，它创建了一个新的UICollectionView

func initializeCollectionViewWithDataSource<D: protocol<UICollectionViewDataSource>,E: protocol<UICollectionViewDelegate>>(dataSource: D, delegate :E, forRow row: Int) {
    
    self.collectionViewDataSource = dataSource
    
    self.collectionViewDelegate = delegate
    
    let flowLayout = UICollectionViewFlowLayout()
    flowLayout.scrollDirection = .Horizontal
    
    let collectionView = UICollectionView(frame: self.bounds, collectionViewLayout: flowLayout)
    collectionView.registerClass(UICollectionViewCell.self, forCellWithReuseIdentifier: reuseChildCollectionViewCellIdentifier)
    collectionView.backgroundColor = UIColor.whiteColor()
    collectionView.dataSource = self.collectionViewDataSource
    collectionView.delegate = self.collectionViewDelegate
    collectionView.tag = row
    
    self.addSubview(collectionView)
    
    self.collectionView = collectionView
            
    collectionView.reloadData()
}

希望对你有所帮助... :)

你也可以参考完整的代码：-https://github.com/irfanlone/Collection-View-in-a-collection-view-cell