Swift：滚动时 UICollectionView 标题消失

Posted 2023-03-06

【中文标题】Swift：滚动时 UICollectionView 标题消失

【英文标题】：Swift: UICollectionView Header Disappear When Scrolling

【发布时间】：2019-04-26 15:11:30

【问题描述】：

这是我在 *** 上的第一篇文章，我是 Swift 的新手。

我使用UICollectionView 实现了类似android 的CollapsingToolbarLayout，并使用自定义CollectionViewFlowLayout 动态更改了标题的高度。 但是当我向上滚动时，我的标题消失了，我发现它消失在某个高度。

有没有人有任何想法或遇到过同样的问题？

我曾尝试将headerReferenceSize 或sectionHeaderPinToVisibleBound 添加到我的自定义布局中，但前者失败了，而后者修复了标题的高度。

override func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]? 

        let layoutAttributes = super.layoutAttributesForElements(in: rect)

        layoutAttributes?.forEach( (attribute) in

            if attribute.representedElementKind == UICollectionView.elementKindSectionHeader

                guard let collectionView = collectionView else return

                let contentOffsetY = collectionView.contentOffset.y

                let width = collectionView.frame.width
                let height = attribute.frame.height - contentOffsetY
                let titleHeight = UIScreen.main.bounds.height/10

                let testHeight = attribute.frame.height - titleHeight

                if contentOffsetY > testHeight 
                    attribute.frame = CGRect(x: 0, y: contentOffsetY, width: width, height: titleHeight)
                    headerReferenceSize = CGSize(width: width, height: titleHeight)                   
                 else 
                    attribute.frame = CGRect(x: 0, y: contentOffsetY, width: width, height: height)
                

            

        )

        return layoutAttributes
    

Youtube

上面是问题demo的链接，不好意思我不知道怎么把视频贴到***上

【问题讨论】：

我和你有同样的情况。不知道为什么它消失了:(

【参考方案1】：

之所以会出现这种情况是因为layoutAttributesForElements在向上滚动一定时间后调用了不同的CGRect。

我有同样的效果，可以通过在 viewDidLoad() 中设置 sectionHeadersPinToVisibleBounds = true 来消除它

    if let layout = collectionViewLayout as? UICollectionViewFlowLayout 
        layout.sectionInset = .init(top: kPadding, left: kPadding, bottom: kPadding, right: kPadding)
        layout.minimumLineSpacing = 10
        layout.headerReferenceSize = .init(width: self.view.frame.width, height: ProfileViewHeader.kHeight)
        layout.sectionHeadersPinToVisibleBounds = true
    

但是 layoutAttributesForElements(in:) 将不再为滚动视图的每次移动调用。如果您只需要设置标题的布局，最好像这样使用 layoutAttributesForElements(ofKind:at:) ：

override func layoutAttributesForSupplementaryView(ofKind elementKind: String, at indexPath: IndexPath) -> UICollectionViewLayoutAttributes? 

    if let attributes =  super.layoutAttributesForSupplementaryView(ofKind: elementKind, at: indexPath) 
        if attributes.representedElementKind == UICollectionView.elementKindSectionHeader 
            guard let collectionView = collectionView else  return attributes 
            let contentOffsetY = collectionView.contentOffset.y
            let width = collectionView.frame.width
            let newHeight = attributes.frame.height - contentOffsetY
            let height = newHeight > 64 ? newHeight: 64
            attributes.frame = CGRect(x: 0, y: contentOffsetY, width: width, height: height)

            if let headerView = collectionView.supplementaryView(forElementKind: UICollectionView.elementKindSectionHeader, at: attributes.indexPath) as? ProfileViewHeader 
                headerView.blur(alpha: (contentOffsetY > 0) ? 0.0 : abs(contentOffsetY * 2) / 100)
            
        
        return attributes
    
    return nil