我无法设计uicollectionview

如何解决我无法设计uicollectionview

此collectionView不能有3个单元格用于行。

• 通过情节提要添加了UICollectionView，单元格相同，然后添加了约束。所有其他内容都是通过代码制作的。
• 如果我让单元格为空，则它们将完全为正方形，但在iPhone 11上它们为6行
• 如果添加一些出口（例如IE）中的图像和标签（固定为0,00 fil，fill），则它们分布不均
• 如果我通过单元格中的代码给图像施加约束，情况会有所改变，但结果却不是我所期望的，每行3个单元格。
• 两种方法均失败

我的控制器

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var myCollectionView: UICollectionView!
    
    var collectionData = ["1?","2?","3 ?","4?","5?","6?","7?","8?","9?","10?","11?","12?"]

    override func viewDidLoad() {
        super.viewDidLoad()
        
        myCollectionView.delegate = self
        myCollectionView.dataSource = self
        configureCollectionView()
    }
    
    
    private func configureCollectionView() {
        
        let widthOfScreen = (view.frame.size.width - 20) / 3
        let layout = myCollectionView.collectionViewLayout as! UICollectionViewFlowLayout
        layout.itemSize = CGSize(width: widthOfScreen,height: widthOfScreen )
        layout.sectionInset =  UIEdgeInsets(top: 40.0,left: 10.0,bottom: 40.0,right: 10.0)
    }
    
    
    
    private func configureCollectionView2() {
        let width = view.bounds.width
        let padding: CGFloat = 12
        let minimumItemSpacing: CGFloat = 10
        let availableWidth = width - (padding * 2) - (minimumItemSpacing * 2)
        let itemWidth = availableWidth / 3
        
        let layout = myCollectionView.collectionViewLayout as! UICollectionViewFlowLayout
        layout.sectionInset =  UIEdgeInsets(top: padding,left: padding,bottom: padding,right: padding)
        layout.itemSize = CGSize(width: itemWidth,height: itemWidth)
    }
    
    
    
    
}


extension ViewController: UICollectionViewDelegate {
    
    func collectionView(_ collectionView: UICollectionView,didSelectItemAt indexPath: IndexPath) {
        print(self.collectionData[indexPath.item])
    }
    
}

extension ViewController: UICollectionViewDataSource {

    
    func collectionView(_ collectionView: UICollectionView,numberOfItemsInSection section: Int) -> Int {
        return collectionData.count
    }
    
    
    
    func collectionView(_ collectionView: UICollectionView,cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

        let model = collectionData[indexPath.item]
        let cell = myCollectionView.dequeueReusableCell(withReuseIdentifier: MyCollectionViewCell.reuseId,for: indexPath) as! MyCollectionViewCell
        cell.configure(with: model)
        
        return cell
    }
    
    
}

我的手机

import UIKit

class MyCollectionViewCell: UICollectionViewCell {
    
    static let reuseId = "MyCollectionViewCell"
    
//    @IBOutlet weak var myCellImage: UIImageView!
//    @IBOutlet weak var myCellLabel: UILabel!
    
    
    func configure(with: String) {
        
        backgroundColor = .systemPink
//        myCellImage.backgroundColor = .black
        
//        myCellImage.translatesAutoresizingMaskIntoConstraints = false
//
//        NSLayoutConstraint.activate([
//
//            myCellImage.widthAnchor.constraint(equalToConstant: 50),//            myCellImage.heightAnchor.constraint(equalToConstant: 50),//
//        ])

        
    }
    
    
    
    
}

解决方法

• 对于单元格为空的情况：您需要在单元格之间添加一些间距，以便连续有3个单元格；最简单的方法是从最小间距下的集合视图大小检查器中，一个单元格用于水平间距，而线用于垂直间距。
• 在添加插座时：一种解决方法是设置至少一个插座的高度和宽度。

P.S。您需要在两种情况下都添加间距。