仅显示 7 个 uicollectionview 单元格

Question

我有一个 UIcollectionview，它只允许水平滚动内容。每个 UIcollectionviewCell 都是一个自定义视图，显示两个标签，一个在另一个之下。我在自定义单元格中设置了约束来定位这些标签。无论屏幕宽度如何，我总是想显示 7 个 UICollection 单元格。这可能吗？

Answer 1

您需要通过从设备宽度计算来更改itemSize

let itemSpacing: CGFloat = 5
let itemsInOneLine: CGFloat = 7
let flow = self.collectionView.collectionViewLayout as! UICollectionViewFlowLayout
flow.sectionInset = UIEdgeInsets(top: itemSpacing, left: itemSpacing, bottom: itemSpacing, right: itemSpacing)
flow.minimumInteritemSpacing = itemSpacing
flow.minimumLineSpacing = itemSpacing
let cellWidth = (UIScreen.main.bounds.width - (itemSpacing * 2) - ((itemsInOneLine - 1) * itemSpacing)) / itemsInOneLine
flow.itemSize = CGSize(width: cellWidth, height: 120)

Answer 2

希望这是你想要的，

这里是代码。

//
//  ViewController.swift
//  AssignmentSO
//
//  Created by Anuradh Caldera on 4/24/19.
//  Copyright © 2019 personal. All rights reserved.
//

import UIKit

class ViewController: UIViewController {

    private var mycollectionview: UICollectionView!
    private let cellidentifier = "cellIdentifier"
    private let minimuminterspace: CGFloat = 2

    override func viewDidLoad() {
        super.viewDidLoad()

        setCollectionView()
    }
}

extension ViewController {
    fileprivate func setCollectionView() {
        let layout = UICollectionViewFlowLayout()
        layout.scrollDirection = .horizontal
        layout.minimumLineSpacing = minimuminterspace
        layout.minimumInteritemSpacing = minimuminterspace

        mycollectionview = UICollectionView(frame: .zero, collectionViewLayout: layout)
        mycollectionview.translatesAutoresizingMaskIntoConstraints = false
        mycollectionview.register(MyCell.self, forCellWithReuseIdentifier: cellidentifier)
        mycollectionview.dataSource = self
        mycollectionview.delegate = self
        mycollectionview.backgroundColor = .white
        mycollectionview.isPagingEnabled = true
        //        mycollectionview.contentInset = UIEdgeInsets(top: 0, left: minimuminterspace, bottom: 0, right: minimuminterspace)
        view.addSubview(mycollectionview)
        let collectionviewConstraints = [mycollectionview.leftAnchor.constraint(equalTo: view.leftAnchor, constant: minimuminterspace),
                                         mycollectionview.topAnchor.constraint(equalTo: view.topAnchor, constant: 20),
                                         mycollectionview.rightAnchor.constraint(equalTo: view.rightAnchor, constant: -minimuminterspace),
                                         mycollectionview.heightAnchor.constraint(equalToConstant: UIScreen.main.bounds.height/4)]
        NSLayoutConstraint.activate(collectionviewConstraints)
    }
}

extension ViewController: UICollectionViewDataSource {
    func numberOfSections(in collectionView: UICollectionView) -> Int {
        return 1
    }

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

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: cellidentifier, for: indexPath) as! MyCell
        cell.index = indexPath.item
        cell.backgroundColor = .purple
        return cell
    }
}

extension ViewController: UICollectionViewDelegateFlowLayout {
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        let cellwidth = mycollectionview.frame.width/7 - minimuminterspace
        let cellheight = mycollectionview.frame.height
        return CGSize(width: cellwidth, height: cellheight)
    }
}



class MyCell: UICollectionViewCell {

    private var mainlabel: UILabel!
    override init(frame: CGRect) {
        super.init(frame: frame)
        setLabel()
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    var index: Int! {
        didSet {
            mainlabel.text = "\(index+1)"
        }
    }
}

extension MyCell {
    fileprivate func setLabel() {
        mainlabel = UILabel()
        mainlabel.translatesAutoresizingMaskIntoConstraints = false
        mainlabel.textColor = .white
        mainlabel.textAlignment = .center
        addSubview(mainlabel)

        let mainlabelConstraints = [mainlabel.centerXAnchor.constraint(equalTo: centerXAnchor),
                                    mainlabel.centerYAnchor.constraint(equalTo: centerYAnchor)]
        NSLayoutConstraint.activate(mainlabelConstraints)
    }
}

注意：如果要显示7个单元格，最好启用pagination。您可以根据需要更改高度。希望这对某人有所帮助。干杯！

Answer 3

第 1 步 - 实现 UICollectionViewDelegateFlowLayout 委托

第 2 步 - 添加以下方法

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


return CGSize(width: (collectionViewSize/7) , height: 50  )
}

第 3 步 - 根据您的要求传递尺寸

Answer 4

实现 collectionView 布局委托。

并将屏幕宽度分为以下 7 个部分。

请注意以下代码是关于 collectionView 宽度的，考虑到 collectionView 宽度的自动布局设置为屏幕边距。

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

虽然这足以满足您的需要，但您还需要处理 Cell 的子视图以适应单元格并正确显示内容。