如何在collectionView的顶部使用UIView，以便在滚动单元格时UIView不应移动？

Question

我正在使用collectionView Cells创建水平轮播，并且我想应用一个在collectionView顶部带有标签的自定义视图，以便在滚动单元格时应该保留UIView，但应更改标签和单元格的文本更改。请帮助我。

Answer 1

希望这就是您的期望。

以编程方式将所有内容用于演示目的。 CollectionViewController和整个代码就是这样。

//
//  SliderController.swift
//  AssignmentSO
//
//  Created by Chanaka Caldera on 7/5/19.
//  Copyright © 2019 StackOverflow. All rights reserved.
//

import UIKit

private let reuseIdentifier = "Cell"

class SliderController: UICollectionViewController {

    var topview: UIView!
    var label: UILabel!

    override func viewDidLoad() {
        super.viewDidLoad()

        //MARK: - set up top view and label
        topview = UIView(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 100))
        topview.backgroundColor = .green
        view.addSubview(topview)

        label = UILabel(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width, height: 100))
        label.text = "Title 0.0"
        label.textAlignment = .center
        label.font = UIFont.systemFont(ofSize: 40)
        topview.addSubview(label)


        // MARK: - Registering the cell and set EdgeInsets (if you are using storyboard set EdgeInset would be enough
        self.collectionView!.register(CustomCell.self, forCellWithReuseIdentifier: reuseIdentifier)
        self.collectionView.contentInset = UIEdgeInsets(top: 100, left: 0, bottom: 0, right: 0)
        self.collectionView.isPagingEnabled = true

    }
}

// MARK: Datasource
extension SliderController {

    override func numberOfSections(in collectionView: UICollectionView) -> Int {
        // #warning Incomplete implementation, return the number of sections
        return 1
    }


    override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        // #warning Incomplete implementation, return the number of items
        return 5
    }

    override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: reuseIdentifier, for: indexPath) as! CustomCell
        cell.label.text = "Cell \(indexPath.row)"
        return cell
    }
}

extension SliderController: UICollectionViewDelegateFlowLayout {

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

        let height = UIScreen.main.bounds.height - 100
        let width = UIScreen.main.bounds.width
        return CGSize(width: width, height: height)
    }
}

extension SliderController {
    override func scrollViewDidScroll(_ scrollView: UIScrollView) {
        let xvalue = scrollView.contentOffset.x
        let width = UIScreen.main.bounds.width

        let cellIndex = xvalue/width

        switch cellIndex {
        case 0:
            label.text = "Title \(cellIndex)"
        case 1:
            label.text = "Title \(cellIndex)"
        case 2:
            label.text = "Title \(cellIndex)"
        case 3:
            label.text = "Title \(cellIndex)"
        case 4:
            label.text = "Title \(cellIndex)"
        default:
            label.text = ""
        }
    }
}


//MARK: Custom cell
class CustomCell: UICollectionViewCell {


    var label: UILabel!

    override init(frame: CGRect) {
        super.init(frame: frame)
        backgroundColor = .lightGray
        label = UILabel(frame: CGRect(x: 0, y: 0, width: contentView.bounds.size.width, height: contentView.bounds.size.height))
        label.font = UIFont.systemFont(ofSize: 40)
        label.text = "2"
        label.textAlignment = .center
        addSubview(label)
    }

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

}

希望这将对某人有所帮助，并且将所有文件都放在同一文件中以进行演示。对此表示抱歉。欢呼！

Answer 2

您可以像下面这样在UIView()节标题中加载collectionView。

使用类类型UICollectionReusableView创建页眉Xib

注册刚创建的Xib

collectionFeatured.register(TodaySectionHeader.nib, forSupplementaryViewOfKind: UICollectionView.elementKindSectionHeader, withReuseIdentifier: "TodaySectionHeader")

CollectionView Delegate和DataSource

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize {
    return CGSize(width: collectionView.bounds.width, height: 80)
}

func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView {
    let sectionHeader = collectionView.dequeueReusableSupplementaryView(ofKind: kind, withReuseIdentifier: "TodaySectionHeader", for: indexPath) as! TodaySectionHeader
    sectionHeader.labelDate.text = Date().toString(format: "EEEE dd MMMM").uppercased()
    sectionHeader.labelTitle.text = "Today"
    return sectionHeader
}

如果您现在想将该标题保留在顶部，则必须在集合初始化期间设置UICollectionViewFlowLayout，在其中设置delegate datasource并在{{1 }}

xib