UICollectionView 頭視圖、 尾視圖以及Cell自定製

#import "ViewController.h"

#import "CustomCollectionViewCell.h"

 

@interface ViewController ()<UICollectionViewDataSource,UICollectionViewDelegate,UICollectionViewDelegateFlowLayout>

{

    NSMutableArray *_arrayM;

}

@end

 

@implementation ViewController

 

- (void)viewDidLoad {

    [super viewDidLoad];

    self.view.backgroundColor = [UIColor whiteColor];

    // 1. 獲取數據

    [self getData];

    

    // 2. 添加CollectionView

    [self addCollectionView];

}

 

- (void)getData

{

    _arrayM = [NSMutableArray array];

    for (int i = 0; i < 20; i ++) {

        int j = i % 7 + 1;

        NSString *imageName = [NSString stringWithFormat:@"%d.jpg",j];

        UIImage *image = [UIImage imageNamed:imageName];

        [_arrayM addObject:image];

    }

}

 

- (void)addCollectionView

{

    // 設置UICollectionViewFlowLayout屬性

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

    flowLayout.scrollDirection = UICollectionViewScrollDirectionVertical;

    flowLayout.itemSize = CGSizeMake(100, 100);

    flowLayout.minimumLineSpacing = 10;

    flowLayout.minimumInteritemSpacing = 10;

    

    // 添加UICollectionView

    UICollectionView *collectioView = [[UICollectionView alloc] initWithFrame:self.view.frame collectionViewLayout:flowLayout];

    collectioView.backgroundColor = [UIColor orangeColor];

    collectioView.dataSource = self;

    collectioView.delegate = self;

    [self.view addSubview:collectioView];

    

    // 註冊cell

    [collectioView registerClass:[CustomCollectionViewCell class] forCellWithReuseIdentifier:@"ID"];

    

    // 註冊頭視圖

    [collectioView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"View"];

    

    // 註冊腳視圖

    [collectioView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"View"];

}

 

- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView

{

    return 3;

}

 

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

{

    return _arrayM.count;

}

 

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

{

    CustomCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"ID" forIndexPath:indexPath];

    cell.imageView.image = _arrayM[indexPath.row];

    return cell;

}

 

//頭尾視圖

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

{

    UICollectionReusableView *view = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"View" forIndexPath:indexPath];

    

    if (kind == UICollectionElementKindSectionHeader) {

        // 頭視圖

        UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 40)];

        label.backgroundColor = [UIColor purpleColor];

        label.text = @"我是頭視圖";

        [view addSubview:label];

    }else if (kind == UICollectionElementKindSectionFooter)

    {

        // 腳視圖

        UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 40)];

        label.backgroundColor = [UIColor purpleColor];

        label.text = @"我是腳視圖";

        [view addSubview:label];

    }

    return view;

}

 

#pragma mark 設置頭視圖的高度

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

{

    return CGSizeMake(self.view.frame.size.width, 50);

}

#pragma mark 設置尾視圖的高度

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

{

    return CGSizeMake(self.view.frame.size.width, 50);

}

 自定製Cell 

頭文件

1 #import <UIKit/UIKit.h>
2 
3 @interface CustomCollectionViewCell : UICollectionViewCell
4 @property(nonatomic ,strong)UIImageView *imageView;
5 @end

M文件

 1 #import "CustomCollectionViewCell.h"
 2 
 3 @implementation CustomCollectionViewCell
 4 - (instancetype)initWithFrame:(CGRect)frame
 5 {
 6     if (self = [super initWithFrame:frame]) {
 7         _imageView = [[UIImageView alloc] initWithFrame:CGRectMake(5, 5, self.bounds.size.width - 10, self.bounds.size.height - 10)];
 8         [self.contentView addSubview:_imageView];
 9     }
10     return self;
11 }
12 @end

 

效果圖