补充标题的 UICollectionView 位置

Posted

技术标签:

【中文标题】补充标题的 UICollectionView 位置【英文标题】:UICollectionView Location for Supplementary Header 【发布时间】:2019-06-21 22:04:43 【问题描述】:

我希望在我的收藏视图的部分上放置一个标题。我在tablebview 中嵌入了一个collectionview。使用 tableview 的部分标题会使标题离内容太远。将节标题作为集合视图的一部分;但是,将该标题放在集合视图单元格本身的顶部。我正在寻找部分标题和部分详细信息之间的一些空间。

func setup() 
        let layout = UICollectionViewFlowLayout()
        layout.itemSize = THUMB_SIZE
        layout.minimumLineSpacing = 25
        layout.sectionInset.right = layout.itemSize.width / 2
        layout.scrollDirection = .horizontal
        collectionView = UICollectionView(frame: self.bounds, collectionViewLayout: layout)
        collectionView.backgroundColor = UIColor(named: "collectionView")
        collectionView.delegate = self
        collectionView.dataSource = self
        collectionView.remembersLastFocusedIndexPath = true
        collectionView.register(MainCVCell.self, forCellWithReuseIdentifier: "cvCell")
        self.addSubview(collectionView)

        self.collectionView.register(HeaderCVCell.self, forCellWithReuseIdentifier: "headerCell")
    

    // MARK: - Collectionview Delegate & Datasource

    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int 
        return topics.shows.count
    

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "cvCell", for: indexPath) as! MainCVCell

        cell.show = topics.shows[indexPath.row]
        cell.selectedIndex = indexPath.row

        return cell
    

    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) 
        delegate.selectedMedia(showID: topics.shows[indexPath.row])
    

    func collectionView(_ collectionView: UICollectionView, viewForSupplementaryElementOfKind kind: String, at indexPath: IndexPath) -> UICollectionReusableView 
        let footerView = collectionView.dequeueReusableCell(withReuseIdentifier: "headerCell", for: indexPath)
        if kind == UICollectionView.elementKindSectionHeader 
            let headerView = collectionView.dequeueReusableCell(withReuseIdentifier: "headerCell", for: indexPath) as! HeaderCVCell
            headerView.headerText = topics.title
            return headerView
         else 
            return footerView
        
    

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize 
        return CGSize(width: 172, height: 60)
    

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForFooterInSection section: Int) -> CGSize 
        return .zero
    

现在是集合视图标题单元格:

class HeaderCVCell: UICollectionViewCell 

    var headerText:String! 
        didSet 
            setup()
        
    

    override init(frame: CGRect) 
        super.init(frame: frame)
    

    required init?(coder aDecoder: NSCoder) 
        super.init(coder: aDecoder)
    

    private func setup() 
        let headerLabel = UILabel()
        headerLabel.text = headerText
        headerLabel.textColor = .white
        headerLabel.sizeToFit()

        self.subviews.forEach $0.removeFromSuperview()
        self.addSubview(headerLabel)
    

通过在标题单元格本身上放置背景颜色,我注意到的一件事是标题单元格的高度等于集合视图的高度。无论如何,我似乎无法独立于集合视图单元格调整标题视图单元格的高度。如果我更改 layout.itemSize 它会更改标题和内容的大小。如果我使用layout.headerReferenceSize,它不会改变任何东西。从代码中可以看出,我也在使用委托方法。根据文档,在这样的水平滚动情况下,它似乎不会查看高度。我也尝试直接设置标题单元格的框架,但这被忽略了。

Net,我的部分标题与收藏视图中的常规内容相冲突。我怀疑这可能是因为标题的高度是集合视图的高度,因此它被定位得尽可能高。我无法更改高度,也无法找到任何其他方式将标题与内容分开。

【问题讨论】:

【参考方案1】:

我有类似的设置,在我的头文件中,我设置了大小:

override func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize 
    return CGSize(width: frame.width / 2 + 60, height: frame.height)

而且,如果你想创建一些间距,你可以使用插图。将顶部设置为负数应在标题后显示一些空格。

    override func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, insetForSectionAt section: Int) -> UIEdgeInsets 
    return UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)

【讨论】:

你的第一个委托方法和我的layout.itemsize基本一样。我尝试过的第二种方法是使用layout.sectionInset.top。这也不起作用,因为随着负数变大,标题会被截断。我认为这又回到了标题单元格的高度,即集合视图的高度。没有它可以走的空间。如前所述,我似乎无法降低标题单元格的高度。

以上是关于补充标题的 UICollectionView 位置的主要内容,如果未能解决你的问题,请参考以下文章

将补充标题视图添加到 UICollectionView 时出错

使用 invalidationContext 重新加载 UICollectionView 的补充视图(标题)时遇到问题

UICollectionView 无法折叠或移除补充视图

如何在 UICollectionView 的补充视图中触发刷新

如何仅刷新/重绘 uicollectionview 中的补充视图?

UICollectionView 的补充视图或装饰视图的 indexpath 是啥?