iOS实现UICollectionView顶部header悬浮效果

//
//  DDCollectionViewFlowLayoutOverRide.h
//  AdvancePlan
//
//  Created by 董德帅 on 2020/2/21.
//  Copyright © 2020 www.dong.com 董德帅. All rights reserved.
//

#import 

NS_ASSUME_NONNULL_BEGIN

@interface DDCollectionViewFlowLayoutOverRide : UICollectionViewFlowLayout

@end

NS_ASSUME_NONNULL_END

//
//  DDCollectionViewFlowLayoutOverRide.m
//  AdvancePlan
//
//  Created by 董德帅 on 2020/2/21.
//  Copyright © 2020 www.dong.com 董德帅. All rights reserved.
//

#import "DDCollectionViewFlowLayoutOverRide.h"

@implementation DDCollectionViewFlowLayoutOverRide
{
    NSInteger leastSectionNum;
}
- (instancetype)init
{
    self = [super init];
    if (self) {
        leastSectionNum = -1;
    }
    return self;
}

- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect{
    
    //获取所有的Attributes
    NSMutableArray *allLayoutAttributes = [[super layoutAttributesForElementsInRect:rect] mutableCopy];
    
    //当前界面最顶部的cell所属的section
    if (leastSectionNum == -1) {
        leastSectionNum = 0;
        return allLayoutAttributes;
    }
    leastSectionNum = [self getLeastSectionNum];
    
    //判断当前顶部的section的header是否被回收
    BOOL hadAttribute = 0;
    for (UICollectionViewLayoutAttributes *attribute in allLayoutAttributes) {
        if (attribute.indexPath.section == leastSectionNum && [attribute.representedElementKind isEqualToString:UICollectionElementKindSectionHeader]) {
            hadAttribute = YES;
            break;
        }
    }

    if (!hadAttribute) {
        //顶部section的header被回收,获取其结构再次添加
        UICollectionViewLayoutAttributes *headerAttribute = [self layoutAttributesForSupplementaryViewOfKind:UICollectionElementKindSectionHeader atIndexPath:[NSIndexPath indexPathForItem:0 inSection:leastSectionNum]];
        if (headerAttribute) {
            [allLayoutAttributes addObject:headerAttribute];
        }
    }
    
    //遍历superArray,改变header结构信息中的参数,使它可以在当前section还没完全离开屏幕的时候一直显示
    for (UICollectionViewLayoutAttributes *attributes in allLayoutAttributes) {
        //如果当前item是header
        if ([attributes.representedElementKind isEqualToString:UICollectionElementKindSectionHeader]){

            //得到当前header所在分区的cell的数量
            NSInteger numberOfItemsInSection = [self.collectionView numberOfItemsInSection:attributes.indexPath.section];
            //得到第一个item的indexPath
            NSIndexPath *firstItemIndexPath = [NSIndexPath indexPathForItem:0 inSection:attributes.indexPath.section];
            //得到最后一个item的indexPath
            NSIndexPath *lastItemIndexPath = [NSIndexPath indexPathForItem:MAX(0, numberOfItemsInSection-1) inSection:attributes.indexPath.section];
            UICollectionViewLayoutAttributes *firstItemAttributes, *lastItemAttributes;
            
            //得到第一个item和最后一个item的结构信息
            if (numberOfItemsInSection>0){
                //cell有值,则获取第一个cell和最后一个cell的结构信息
                firstItemAttributes = [self layoutAttributesForItemAtIndexPath:firstItemIndexPath];
                lastItemAttributes = [self layoutAttributesForItemAtIndexPath:lastItemIndexPath];
            }else{
                //cell没值,就新建一个UICollectionViewLayoutAttributes
                firstItemAttributes = [UICollectionViewLayoutAttributes new];
                //然后模拟出在当前分区中的唯一一个cell,cell在header的下面,高度为0,还与header隔着可能存在的sectionInset的top
                CGFloat y = CGRectGetMaxY(attributes.frame)+self.sectionInset.top;
                firstItemAttributes.frame = CGRectMake(0, y, 0, 0);
                //因为只有一个cell,所以最后一个cell等于第一个cell
                lastItemAttributes = firstItemAttributes;
            }
            
            //获取当前header的frame
            CGRect rect = attributes.frame;
            //当前的滑动距离 + 因为导航栏产生的偏移量,默认为64(如果app需求不同,需自己设置)
            CGFloat offset = self.collectionView.contentOffset.y;
            //第一个cell的y值 - 当前header的高度 - 可能存在的sectionInset的top
            CGFloat headerY = firstItemAttributes.frame.origin.y - rect.size.height - self.sectionInset.top;
            
            //哪个大取哪个,保证header悬停
            //针对当前header基本上都是offset更加大,针对下一个header则会是headerY大,各自处理
            CGFloat maxY = MAX(offset,headerY);

            //最后一个cell的y值 + 最后一个cell的高度 + 可能存在的sectionInset的bottom - 当前header的高度
            //当当前section的footer或者下一个section的header接触到当前header的底部,计算出的headerMissingY即为有效值
            CGFloat headerMissingY = CGRectGetMaxY(lastItemAttributes.frame) + self.sectionInset.bottom - rect.size.height;
            //给rect的y赋新值,因为在最后消失的临界点要跟谁消失,所以取小
            rect.origin.y = MIN(maxY,headerMissingY);
            
            //给header的结构信息的frame重新赋值
            attributes.frame = rect;
            //如果按照正常情况下,header离开屏幕被系统回收,而header的层次关系又与cell相等,如果不去理会,会出现cell在header上面的情况
            //通过打印可以知道cell的层次关系zIndex数值为0,我们可以将header的zIndex设置成1,如果不放心,也可以将它设置成非常大,这里随便填了个7
            attributes.zIndex = 10;

        }
    }

    return [allLayoutAttributes copy];
}

//获取顶部的section
- (NSInteger)getLeastSectionNum{
    
    NSInteger  m = self.collectionView.numberOfSections;
    for (NSIndexPath *indexPath in self.collectionView.indexPathsForVisibleItems) {
        if (indexPath.section <= m) {
            m = indexPath.section;
        }
    }
    return m;
    
}

//页面布局
- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds
{
    return YES;
}
@end

借鉴XLPlainFlowLayout,优化部分逻辑

2020,04,06补充,建议使用XLPlainFlowLayout,这个有点小问题,还没想到解决办法 ̄□ ̄||/:,@f

你可能感兴趣的:(iOS实现UICollectionView顶部header悬浮效果)