繁体   English   中英

仅显示7个uicollectionview单元格

[英]Show only 7 uicollectionview cells

我有一个UIcollectionview,它只允许水平滚动内容。 每个UIcollectionviewCell是一个自定义视图,显示两个标签,一个在另一个标签下面。 我在自定义单元格中设置了约束以放置这些标签。 无论屏幕宽度如何,我始终希望显示7个UICollection单元。 这可能吗? 在此处输入图片说明

您需要通过根据设备宽度进行计算来更改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)

希望这就是你想要的

在此处输入图片说明

这是此代码。

//
//  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 您可以根据需要更改高度。 希望这对某人有帮助。 干杯!

第1步-实现UICollectionViewDelegateFlowLayout委托

第2步-添加以下方法

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


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

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

实现collectionView布局委托。

并将屏幕宽度分成7个部分,如下所示。

请注意以下代码是关于collectionView宽度的,考虑到collectionView width的自动布局设置为屏幕空白。

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

尽管这可以满足您的需求,但您还需要处理单元格的子视图以适合单元格并正确显示内容。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM