CollectionViewcollectionView头部添加轮播图

记录下CollectionViewcollectionView使用Header头部添加轮播图

  • 关键点:

    • flowLayout的headerReferenceSize属性是设置collectionView头部的高度,如果不设置头部就不显示
    • 注册collectionView头部视图
      [self.collectionView registerClass:[XYHotADView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:adCellReusableIdentifier];
  • 如果要通过控制器给头部视图传递模型属性,可以在collectionView的数据源方法中传递viewForSupplementaryElementOfKind:

// 这里是collectionView的布局类,这里有一步很关键flowLayout的headerReferenceSize属性就是设置collectionView头部的高度,如果不设置头部就不显示
#import "XYHomeLiveFlowLayout.h"
@implementation XYHomeLiveFlowLayout
@synthesize columnNumber = _columnNumber;

- (void)prepareLayout {
    
    [super prepareLayout];
    
    CGFloat padding = self.columnNumber == 2 ? 1: 0;
    CGFloat wh = self.columnNumber == 2 ? (xyScreenW - self.columnNumber * padding) / self.columnNumber : xyScreenW;
    self.itemSize = CGSizeMake(wh, wh);
    self.minimumLineSpacing = padding;
    self.minimumInteritemSpacing = padding;
    self.headerReferenceSize = CGSizeMake(xyScreenW, 100); // 设置collectionView头部视图的尺寸
    
    self.collectionView.showsVerticalScrollIndicator = NO;
    self.collectionView.showsHorizontalScrollIndicator = NO;
    self.collectionView.alwaysBounceVertical = YES;
    
}


- (void)setColumnNumber:(NSInteger)columnNumber {
    
    _columnNumber = columnNumber;
    
    [self.collectionView reloadData];
}

- (NSInteger)columnNumber {
    
    return _columnNumber ?: 1;
}

@end

#import "XYHomeLiveController.h"
#import "XYHotLiveCell.h"
#import "XYRefreshGifHeader.h"
#import "XYNetworkTool.h"
#import "XYLiveItem.h"
#import "UIViewController+XYExtension.h"
#import "XYTopADItem.h"
#import "XYHotADCell.h"
#import "XYWebViewController.h"
#import "XYRoomLiveController.h"
#import "XYProfileNavigationController.h"
#import "XYHomeLiveFlowLayout.h"
#import "XYMenuView.h"

@interface XYHomeLiveController () 
/** 当前页 */
@property (nonatomic, assign) NSInteger currentPage;
/** 最热直播数据模型数组 */
@property (nonatomic, strong) NSMutableArray *lives;
/** 广告数据模型数组 */
@property (nonatomic, strong) NSMutableArray *topADS;
/** 请求直播数据的urlStr */
@property (nonatomic, strong) NSString *loadLiveURLStr; 
/** 请求直播数据的字段 */
@property (nonatomic, strong) NSMutableDictionary *loadLiveParameters; 
@property (nonatomic, weak) UICollectionView *collectionView;
@property (nonatomic, strong) XYHomeLiveFlowLayout *flowLayout;

@end

// 创建collectionView
XYHomeLiveFlowLayout *flowLayout = [[XYHomeLiveFlowLayout alloc] init];
_flowLayout = flowLayout;
 UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:CGRectZero collectionViewLayout:flowLayout];
[self.view addSubview:collectionView];
_collectionView = collectionView;
        
[collectionView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.edges.mas_equalTo(self.view);
 }];

// 注册collectionView的头部视图的类
[self.collectionView registerClass:[XYHotADView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:adCellReusableIdentifier];
}

// 如果要通过控制器给头部视图传递模型属性,可以在collectionView的数据源方法中传递
//  返回头视图
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath
{
    //如果是头视图
    if ([kind isEqualToString:UICollectionElementKindSectionHeader]) {
        XYHotADCell *header = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:adCellReusableIdentifier forIndexPath:indexPath];
    
        header.adItems = self.topADS;
        return header;
    }
    //如果底部视图
    //    if([kind isEqualToString:UICollectionElementKindSectionFooter]){
    //
    //    }
    return nil;
}


你可能感兴趣的:(CollectionViewcollectionView头部添加轮播图)