单元格大小不等于集合视图大小

Question

我写了一个代码，我得到了包含 4 个单元格的集合视图，我可以滑动查看每个单元格。

我的 collectionview 背景色是红色的，我在单元格中放置了一张图片（在此之前我使用蓝色而不是图片），但我遇到了一个问题，即在我的单元格中的 collection view 中看到小红线。

我必须说我之前遇到的问题是我有更大的线，我通过隐藏视图控制器的导航视图来解决这个问题。

class CheckViewController: UIViewController, UICollectionViewDataSource,
UICollectionViewDelegate, UICollectionViewDelegateFlowLayout {


    lazy var collectionView: UICollectionView = {
        let layout = UICollectionViewFlowLayout()
        layout.scrollDirection = .horizontal
        layout.minimumLineSpacing = 0
        let cv = UICollectionView(frame: .zero, collectionViewLayout: layout)
        cv.backgroundColor = .red
        cv.dataSource = self
        cv.delegate = self
        cv.isPagingEnabled = true
        return cv
    }()


    let cellId = "cellId"

    override func viewDidLoad() {
        super.viewDidLoad()
        self.navigationController?.setNavigationBarHidden(true, animated: true)

        view.addSubview(collectionView)


       // collectionView.frame = view.frame

        //use autolayout instead

        collectionView.anchorToTop(top: view.topAnchor, left: view.leftAnchor, bottom: view.bottomAnchor, right: view.rightAnchor)

        collectionView.register(PageCell.self, forCellWithReuseIdentifier: cellId)


    }


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


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

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


      //  cell.backgroundColor  = .white
        return cell
    }

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




}

extension UIView {
    func anchorToTop(top: NSLayoutYAxisAnchor? = nil, left:
        NSLayoutXAxisAnchor? = nil, bottom: NSLayoutYAxisAnchor? = nil, right:
        NSLayoutXAxisAnchor? = nil) {

        anchorWithConstantsToTop(top: top, left: left, bottom: bottom, right: right, topConstant: 0, leftConstant: 0, bottomConstant: 0, rightConstant: 0)
    }
    func anchorWithConstantsToTop(top: NSLayoutYAxisAnchor? = nil, left:
        NSLayoutXAxisAnchor? = nil, bottom: NSLayoutYAxisAnchor? = nil, right:
        NSLayoutXAxisAnchor? = nil, topConstant: CGFloat = 0,leftConstant:
        CGFloat = 0, bottomConstant: CGFloat = 0, rightConstant: CGFloat = 0)
    {
        translatesAutoresizingMaskIntoConstraints = false
        if let top = top {
            topAnchor.constraint(equalTo: top, constant: topConstant).isActive = true
        }
        if let bottom = bottom {
            bottomAnchor.constraint(equalTo: bottom, constant: bottomConstant).isActive = true
        }
        if let left = left {
            leftAnchor.constraint(equalTo: left, constant: leftConstant).isActive = true
        }
        if let right = right {
            rightAnchor.constraint(equalTo: right, constant: rightConstant).isActive = true
        }

    }
}

这是image。

Answer 1

有两个问题

1) 您设置的是相对于视图而不是 collectionView 的单元格大小。

您在设置单元格大小时出错..

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

2) 看起来您的视图的 backgroundImage 不适合 100%。您想使用另一个纵横比来填充视图。您可能想要使用 .scaleToFill。

Difference between UIViewContentModeScaleAspectFit and UIViewContentModeScaleToFill?