美文网首页
UICollectionView 设置headerView部分悬

UICollectionView 设置headerView部分悬

作者: Nest0912 | 来源:发表于2017-10-17 11:07 被阅读0次

    恶心需求又来啦!老总需要在商品列表顶部添加一个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;
    }
    OK,至此大功告成!比起网上很多通过contentofset.y来滑动判断方便多了。

    相关文章

      网友评论

          本文标题:UICollectionView 设置headerView部分悬

          本文链接:https://www.haomeiwen.com/subject/cyaruxtx.html