添加 CollectionView 作为表视图标题

Posted 2023-03-04

【中文标题】添加 CollectionView 作为表视图标题

【英文标题】：Add CollectionView as Table View Header

【发布时间】：2017-01-13 09:38:44

【问题描述】：

我想显示这样的横幅：

我的方法是将CollectionView 添加为TableViewHeader

我的代码：

extension HomeViewController: UICollectionViewDataSource, UICollectionViewDelegateFlowLayout 
    func configureHeaderView() 

        let layout = UICollectionViewFlowLayout()
        layout.scrollDirection = .horizontal
        layout.sectionInset = UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)

        let headerView = UICollectionView(frame: CGRect(x: 0, y: 0, width: view.frame.width, height: headerHeight), collectionViewLayout: layout)
        headerView.backgroundColor = .blue
        headerView.isPagingEnabled = true
        headerView.isUserInteractionEnabled = true

        headerView.dataSource = self
        headerView.delegate = self
        headerView.register(BannerCollectionViewCell.self, forCellWithReuseIdentifier: BannerCollectionViewCell.reuseIdentifier)
        headerView.showsHorizontalScrollIndicator = false

        tableView.tableHeaderView = headerView
    

    // MARK: UICollectionViewDataSource
    func numberOfSections(in collectionView: UICollectionView) -> Int 
        return 1
    

    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int 
        return 3
    

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: BannerCollectionViewCell.reuseIdentifier, for: indexPath) as! BannerCollectionViewCell
        return cell
    

    // MARK: UICollectionViewDelegateFlowLayout
    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize 
        return CGSize(width: UIScreen.main.bounds.width, height: headerHeight)
    

我的BannerCollectionViewCell 有一张默认图片。

class BannerCollectionViewCell: UICollectionViewCell 

    @IBOutlet weak var bannerImageView: UIImageView!

但我在标题上没有看到该图像。它只是显示一个空标题。

【问题讨论】：

您是否尝试过使用委托方法viewForHeaderInSection？

还没有，我已经设置了tableView.tableHeaderView = headerView，它们是等价的吗？

在cellForItemAt indexPath 中，你必须设置图像。喜欢cell.imageView.image = "abc.png"

不完全是，但如果你只有 1 个部分，两者都可以。

#Ben Ong，我只有 1 个部分，#the_dahiya_boy，我已设置默认图像。

【参考方案1】：

您使用的是NIB，因此您应该使用func register(UINib?, forCellWithReuseIdentifier: String) 而不是func register(AnyClass?, forCellWithReuseIdentifier: String)

【讨论】：

仅在您对问题有任何答案时才发布答案，否则请写在评论中。

这是正确答案。感谢您的所有帮助:)

@zhongwuzw 谢谢我遇到了 Autolayout 的问题。你能帮帮我吗？

【参考方案2】：

也许您正在寻找顶部的图像寻呼机KIImagePager，而不是集合视图。您也可以使用内置的PageViewController 创建相同的内容。

您可以在此下方单独添加TableView。

【讨论】：

他通过禁用垂直移动来使用UIcollectionview，而不是PageController