collectionView顶部header悬停效果

需要在商品列表顶部添加一个banner，并且添加分类标识按钮，要求滑动UICollectionView的时候banner滑动，而分类标识按钮悬停（最后有图）

方法步骤：

1.先创建UICollectionView

    UICollectionViewFlowLayout * layout = [[UICollectionViewFlowLayout alloc]init];

    layout.sectionHeadersPinToVisibleBounds = YES;//头视图悬浮

 metal_collection = [[UICollectionView alloc]initWithFrame:CGRectMake(0, 40, SCREEN_WDITH, 0)       collectionViewLayout:layout];

 metal_collection.backgroundColor = [UIColor clearColor];

 metal_collection.delegate = self;

 metal_collection.dataSource = self;

 metal_collection.bounces = YES;

 metal_collection.alwaysBounceVertical = YES;//数据不够也可以垂直滑动

 metal_collection.showsVerticalScrollIndicator = YES;

    [self.view addSubview:metal_collection];

    [metal_collection registerClass:[TMetalProductCell class] forCellWithReuseIdentifier:@"MetalCollectionCell"];

    [metal_collection registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"MetalCollectionHead"];

    [metal_collection registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"MetalCollectionFooter"];

2.实现代理方法

#pragma -------------UICollectionDataSource-------------

-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView

{

 return 2;//这里很关键，分两组，把banner放在第一组的footer，把分类按钮放在第二组的header

}

-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section

{

 if (section == 0) {

 return 0;

    }

 return metal_Muarry.count;

}

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath

{

 TMetalProductCell * cell = [metal_collection dequeueReusableCellWithReuseIdentifier:@"MetalCollectionCell" forIndexPath:indexPath];

    cell.metalModel = metal_Muarry[indexPath.item];

 return cell;

}

#pragma -------------UICollectionDelegateFlowLayout-------------

-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section

{

 if (section == 1) {

 return CGSizeMake(SCREEN_WDITH, 45);

    }

 return CGSizeZero;

}

-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section

{

 if (section == 0) {

 return CGSizeMake(SCREEN_WDITH, 150);

    }

 return CGSizeZero;

}

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath

{

 if (indexPath.section == 1) {

 return CGSizeMake((SCREEN_WDITH - 5)/2, (SCREEN_WDITH - 5)/2 + 83);

    }

 return CGSizeZero;

}

- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section

{

 return 5;

}

- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section

{

 return 5;

}

#pragma -------------UICollectionDelegate-------------

-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath

{

 TMetalProductModel * model = metal_Muarry[indexPath.item];

 TMetalProductDetailVC * transForVC =  [[TMetalProductDetailVC alloc]init];

    transForVC.metal_id = model.merchId;

    [self.navigationController pushViewController:transForVC animated:YES];

}

-(UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath*)indexPath

{

 if ([kind isEqualToString:UICollectionElementKindSectionFooter] && indexPath.section == 0) {

 UICollectionReusableView * footerView = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"MetalCollectionFooter" forIndexPath:indexPath];

 if (footerView.subviews.count == 0) {//加一个限制，避免无限创建新的 

 banner_Sc = [[UIScrollView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WDITH, 150)];

 banner_Sc.backgroundColor = [UIColor clearColor];

 banner_Sc.showsVerticalScrollIndicator = NO;

 banner_Sc.showsHorizontalScrollIndicator = NO;

 banner_Sc.pagingEnabled = YES;

 banner_Sc.delegate = self;

[footerView addSubview:banner_Sc];

        }

 return footerView;

    }else if ([kind isEqualToString:UICollectionElementKindSectionHeader] && indexPath.section == 1){

 UICollectionReusableView * headView = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"MetalCollectionHead" forIndexPath:indexPath];

 if (headView.subviews.count == 0) {//加一个限制，避免无限创建新的 

 HTScrollMenuView * menuView = [[HTScrollMenuView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WDITH, 40) withItem:@[@"工艺类",@"钱币类",@"首饰类",@"投资类"] withDelegate:self];

[headView addSubview:menuView];

        }

 return headView;

    }

 return nil;

}

转载于:https://www.cnblogs.com/chenweb/p/10802944.html