UICollectionView 基础全面解析

在iOS开发中经常会用到UICollectionView，和UITableView同样即成UIScrollView 但是操作起来比UITableVIew要麻烦一些 ，有些地方需要注意，一下是UICollectionView基础详解。

//

//  ViewController.m

//  Collection

#import "ViewController.h"

#import "CollectionViewCell.h"

#import "CollectionViewCell1.h"

#import "CollectionReusableView.h"

@interface ViewController ()<UICollectionViewDelegate,UICollectionViewDataSource>

@property(nonatomic,strong)UICollectionView *collectionView;

@end

@implementation ViewController

- (void)viewDidLoad {

    [super viewDidLoad];

    //此处必须要有创见一个UICollectionViewFlowLayout的对象

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

    //同一行相邻两个cell的最小间距

    layout.minimumInteritemSpacing = 5;

    //最小两行之间的间距

    layout.minimumLineSpacing = 5;

    

    _collectionView=[[UICollectionView alloc]initWithFrame:CGRectMake(0, 0, 375, 667) collectionViewLayout:layout];

    _collectionView.backgroundColor=[UIColor whiteColor];

    _collectionView.delegate=self;

    _collectionView.dataSource=self;

    //这个是横向滑动

    //layout.scrollDirection=UICollectionViewScrollDirectionHorizontal;

    [self.view addSubview:_collectionView];

    

    /*

     *这是重点 必须注册cell

     */

    //这种是xib建的cell 需要这么注册

    UINib *cellNib=[UINib nibWithNibName:@"CollectionViewCell" bundle:nil];

    [_collectionView registerNib:cellNib forCellWithReuseIdentifier:@"CollectionViewCell"];

    //这种是自定义cell不带xib的注册

//   [_collectionView registerClass:[CollectionViewCell1 class] forCellWithReuseIdentifier:@"myheheIdentifier"];

    //这种是原生cell的注册

//    [_collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:@"cell"];

    

    //这是头部与脚部的注册

    UINib *cellNib1=[UINib nibWithNibName:@"CollectionReusableView" bundle:nil];

    [_collectionView registerNib:cellNib1 forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"CollectionReusableView"];

    [_collectionView registerNib:cellNib1 forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"CollectionReusableView"];

}

//一共有多少个组

-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{

    return 1;

}

//每一组有多少个cell

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

    return 10;

}

//每一个cell是什么

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

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

    cell.label.text=[NSString stringWithFormat:@"%ld",indexPath.section*100+indexPath.row];

    cell.backgroundColor=[UIColor groupTableViewBackgroundColor];

    return cell;

}

//头部和脚部的加载

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

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

    UILabel *label=[[UILabel alloc]initWithFrame:CGRectMake(110, 20, 100, 30)];

    if ([kind isEqualToString:UICollectionElementKindSectionHeader]) {

        label.text=@"头";

    }else{

        label.text=@"脚";

    }

    [view addSubview:label];

    return view;

}

//每一个分组的上左下右间距

-(UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section

{

    return UIEdgeInsetsMake(5, 5, 5, 5);

}

//头部试图的大小

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

    return CGSizeMake(50, 60);

}

//脚部试图的大小

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

{

    return CGSizeMake(50, 60);

}

//定义每一个cell的大小

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

{

    return CGSizeMake(115, 100);

}

//cell的点击事件

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

    //cell被电击后移动的动画

    [collectionView selectItemAtIndexPath:indexPath animated:YES scrollPosition:UICollectionViewScrollPositionTop];

}

@end

//如果有什么不到之处，欢迎多多与我交流   今天或明天我还会出进阶篇，自定义流水布局

下面是结果图