collectionView頂部header懸停效果

須要在商品列表頂部添加一個banner,而且添加分類標識按鈕,要求滑動UICollectionView的時候banner滑動,而分類標識按鈕懸停(最後有圖)代理

方法步驟:ci

1.先建立UICollectionViewit

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

    layout.sectionHeadersPinToVisibleBounds = YES;//頭視圖懸浮class

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

 metal_collection.backgroundColor = [UIColor clearColor];meta

 metal_collection.delegate = self;queue

 metal_collection.dataSource = self;方法

 metal_collection.bounces = YES;im

 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;

}

相關文章
相關標籤/搜索