UICollectionView的布局是可以自己定义的，在这篇博客中先在上篇博客的基础上进行扩充，我们先使用UICollectionViewFlowLayout，然后好好的介绍一下UICollectionView的一些回调方法，主要包括UICollectionViewDataSource，UICollectionViewDelegateFlowLayout，UICollectionViewDelegate相关回调方法，并通过实例来介绍每个回调的用法。并且给每个Section添加定制的Header和Footer，好废话少说进入今天的正题。
一、Demo总览
下图是本篇博客中Demo的最终运行效果，下面是我们要做的事情：
1. 给每个Section添加自定义的重用Header和Footer
2.调整第一个Section的上左下右的边距（UIEdgeInsets）
3.给UICollectioinView设置多选
4.处理Cell的高亮事件
5.处理Cell的选中事件
6.调整Cell的上下左右边距
7.对Cell进行编辑
二、UICollectionViewDataSource介绍
1、在UICollectionViewDataSource回调方法中有一个返回Section数量的方法，如下所示，该方法和UITableView中的用法一致。在这儿我们返回5个Section，如下所示：
1#PRagmamark <UICollectionViewDataSource>23/**4* 返回Section的个数5*/6- (NSInteger)numberOfSectionsInCollectionView: (UICollectionView *)collectionView {7return5;8}
2、在UICollectionViewDataSource的回调方法中，还有一个是返回每个Section中Cell的数量的方法，在这我们返回30个Cell, 如下代码所示：
1/**2* 返回每个Section中Cell的个数3*/4- (NSInteger)collectionView: (UICollectionView *)collectionView5numberOfItemsInSection: (NSInteger)section {67return30;8}
3、在UICollectionViewDataSource还有一个必须实现的方法, 就是选择我们CollectionView中所使用的Cell, 在这里我们所使用的Cell是在Storyboard上实现的，所以不需要在我们的代码中注册Cell, 之间使用重用标示符就可以获取Cell的对象，如下所示：
1/**2* 返回Cell种类3*/4- (UICollectionViewCell *)collectionView: (UICollectionView *)collectionView5cellForItemAtIndexPath: (NSIndexPath *)indexPath {67//通过Cell重用标示符来获取Cell8CollectionViewCell *cell =[collectionView dequeueReusableCellWithReuseIdentifier: reuseIdentifier9forIndexPath: indexPath];1011returncell;12}
4、在UICollectionViewDataSource方法中有一个可选的方法就是为我们的Section添加Supplementary View（追加视图），下面是添Supplementary View（追加视图）的步骤。在UICollectionView中的Section中我们可以为其增加Header View和Footer View, 也就是官方文档上提到的Supplementary View（追加视图）。追加视图是可以重用的，也就是UICollectionReusableView。我们可以创建两个UICollectionReusableView的子类，一个是Header View, 另一个是Footer View。
（1）创建UICollectionReusableView
追加视图可以在Storyboard上添加，然后设置重用标示符，在代码中使用即可。这里我们是从xib文件来加载的Supplementary View, 先创建两个UICollectionReusableView子类，在创建该子类的同时创建相应的xib文件，如下所示：
创建Header View和Footer View的UICollectionReusableView，创建后的文件目录如下：
(2) 因为我们是从xib文件中加载的UICollectionReusableView，所以需要在相应的UICollectionView上进行注册。如果你是使用的Storyboard, 只需要在Storyboard中指定重用标示符即可。下面的代码就是在ViewDidLoad中调用注册UICollectionReusableView的方法。
1/**2* 注册Header和FooterView3* 便于在UICollectionViewDataSource中使用4*/5- (void) registerHeaderAndFooterView {6//注册headerView7//获取含有UICollectionReusableView的Nib文件。8UINib *headerNib = [UINib nibWithNibName:@"CollectionHeaderReusableView"9bundle: [NSBundle mainBundle]];1011//注册重用View12[self.collectionView registerNib: headerNib13forSupplementaryViewOfKind: UICollectionElementKindSectionHeader14withReuseIdentifier:@"CollectionHeaderReusableView"];151617//注册FooterView18UINib *footerNib = [UINib nibWithNibName:@"CollectionFooterReusableView"19bundle:[ NSBundle mainBundle]];2021[self.collectionView registerNib: footerNib22forSupplementaryViewOfKind: UICollectionElementKindSectionFooter23withReuseIdentifier:@"CollectionFooterReusableView"];2425}
（3）在UICollectionViewDataSource中的设置Supplementary View的方法中通过Header View和Footer View的重用标示符来为我们的Section设置Supplementary View，具体代码如下所示：
1/**2* 设置Setion的Header和Footer(Supplementary View)3*/4- (UICollectionReusableView *)collectionView: (UICollectionView *)collectionView5viewForSupplementaryElementOfKind: (NSString *)kind6atIndexPath: (NSIndexPath *)indexPath{78//设置SectionHeader9if([kind isEqualToString: UICollectionElementKindSectionHeader]) {1011UICollectionReusableView *view = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"CollectionHeaderReusableView"forIndexPath:indexPath];1213returnview;14}1516//设置SectionFooter17UICollectionReusableView *view = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"CollectionFooterReusableView"forIndexPath:indexPath];18returnview;1920}
UICollectionViewDataSource中的四个方法在上面都进行了实现，UICollectionViewDataSource主要是负责加载数据源的，包括Section的个数，每个Section中Cell的个数，每个Section中Supplementary View的种类。
三.UICollectionViewDelegateFlowLayout回调实现
UICollectionViewDelegateFlowLayout主要是负责显示的，比如Secion的大小、边距，Cell的大小边距，headerView的大小已经FooterView的大小，都是在UICollectionViewDelegateFlowLayout的相应协议的方法来实现的。接下来详细的介绍一下UICollectionViewDelegateFlowLayout协议中的方法。
1.同一个Section中同一种Cell(通过同一个Cell重用标示符获取的对象)可以有不同的尺寸，下面的代码是给Cell定制尺寸。代码的具体意思是第一个Section中的所有Cell的尺寸是（50，50）。 其余的时（60，60）。
1#pragmamark <UICollectionViewDelegateFlowLayout>2/**3* 改变Cell的尺寸4*/5- (CGSize)collectionView: (UICollectionView *)collectionView6layout: (UICollectionViewLayout*)collectionViewLayout7sizeForItemAtIndexPath: (NSIndexPath *)indexPath{89if(indexPath.section ==0) {10returnCGSizeMake(50,50);11}1213returnCGSizeMake(60,60);14}
2.改变Section的上下左右边距--UIEdgeInsetsMake(上,左,下,右)，逆时针旋转。第一个Section的上左下右的边距都是50， 其余的Section上左下右的边距是0。具体实现看如下代码：
1/**2* Section的上下左右边距--UIEdgeInsetsMake(上, 左, 下, 右);逆时针3*/4- (UIEdgeInsets)collectionView: (UICollectionView *)collectionView5layout: (UICollectionViewLayout*)collectionViewLayout6insetForSectionAtIndex: (NSInteger)section{78if(section ==0) {9returnUIEdgeInsetsMake(50,50,50,50);10}11returnUIEdgeInsetsMake(0,0,0,0);12}
3.设置每个Cell的上下边距的回调如下所示，第一个Section的Cell上下边距是5.0f, 其余的为20.0f。
1/**2* Section中每个Cell的上下边距3*/4- (CGFloat)collectionView: (UICollectionView *)collectionView5layout: (UICollectionViewLayout*)collectionViewLayout6minimumLineSpacingForSectionAtIndex: (NSInteger)section{7if(section ==0) {8return5.0f;9}10return20.0f;11}
4.设置Cell的左右边距，第一个Section的Cell左右边距是5.0f, 其余的为20.0f。
1/**2* Section中每个Cell的左右边距3*/4- (CGFloat)collectionView: (UICollectionView *)collectionView5layout: (UICollectionViewLayout*)collectionViewLayout6minimumInteritemSpacingForSectionAtIndex: (NSInteger)section{7if(section ==0) {8return5.0f;9}10return20.0f;11}
5.设置Header View和Footer View的大小的回调如下。
1/**2* headerView的大小3*/4- (CGSize)collectionView: (UICollectionView *)collectionView5layout: (UICollectionViewLayout*)collectionViewLayout6referenceSizeForHeaderInSection: (NSInteger)section{7returnCGSizeMake(200,50);8}910/**11* footerView的大小12*/13- (CGSize)collectionView: (UICollectionView *)collectionView14layout: (UICollectionViewLayout*)collectionViewLayout15referenceSizeForFooterInSection: (NSInteger)section{16returnCGSizeMake(200,50);17}
上面的方法就是UICollectionViewDelegateFlowLayout中所有的方法了，负责布局显示的。
四、UICollectionViewDelegate回调实现
UICollectionViewDelegate中的代理方法主要是负责Cell的交互的，比如是否高亮，是否选，是否可编辑等，接下来要为大家详细的介绍UICollectionViewDelegate中的代理方法。
1.为了这部分的效果展示，我们需要对Cell添加一些控件，并且设置其Highlight和Selected的一些状态。为Cell添加上ImageView, Cell的高亮状态和非高亮状态对应的ImageView上的图片是不同的。再添加一个Button, 并为Button设置Selected和Default状态下的图片，Button的选中和默认状态由Cell的选中状态来定。Cell中改变ImageView的图片的代码如下所示，函数传入的参数是当前Cell的高亮状态，根据高亮状态来设置ImageView上的Image。（有的小伙伴会问为什么给ImageView在Default状态和Highlight下设置不同的图片，然后直接改变ImageView的高亮状态即可。你可以试一下，达不到预期的效果）
1- (void) changeHighLightWithBool: (BOOL) highlight{23NSString *imageName =@"003.jpg";45if(highlight) {6imageName =@"002.jpg";7}89[_highlightImage setImage: [UIImage imageNamed:imageName]];10}
2.设置Cell可以高亮, 返回YES代表Cell可以高亮，返回NO代表Cell不可高亮。高亮就是触摸Cell时该Cell变为高亮状态，在代码中的反应就是Cell的Highligth属性变为YES。而触摸结束时，Cell的Highligth属性就变为NO。
1#pragmamark <UICollectionViewDelegate>23/**4* Cell是否可以高亮5*/6- (BOOL)collectionView: (UICollectionView *)collectionView7shouldHighlightItemAtIndexPath: (NSIndexPath *)indexPath{89returnYES;1011}
3.下面这个方法是自己写的，用来在界面上反应Cell的高亮状态。 ImageView在当前Cell高亮状态下和非高亮状态下所加载的图片不同，所以可以看出Cell高亮和非高亮。
1/**2* 根据高亮状态修改背景图片3*/4- (void) changeHighlightCellWithIndexPaht: (NSIndexPath *) indexPath{5//获取当前变化的Cell6CollectionViewCell *currentHighlightCell = (CollectionViewCell *)[self.collectionView cellForItemAtIndexPath:indexPath];78[currentHighlightCell changeHighLightWithBool:currentHighlightCell.highlighted];910if(currentHighlightCell.highlighted ==YES){1112NSLog(@"第%ld个Section上第%ld个Cell变为高亮",indexPath.section ,indexPath.row);13return;14}1516if(currentHighlightCell.highlighted ==NO){17NSLog(@"第%ld个Section上第%ld个Cell变为非高亮",indexPath.section ,indexPath.row);18}192021}
4.Cell从非高亮变为高亮状态时回调用下面的方法，为了反映Cell的高亮状态，我们去改变一下Cell上ImageView的图片。
1/**2* 如果Cell可以高亮，Cell变为高亮后调用该方法3*/4- (void)collectionView: (UICollectionView *)collectionView5didHighlightItemAtIndexPath: (NSIndexPath *)indexPath{67[self changeHighlightCellWithIndexPath:indexPath];8}91011/**12* 如果Cell可以高亮，Cell从高亮变为非高亮调用该方法13*/14- (void)collectionView: (UICollectionView *)collectionView15didUnhighlightItemAtIndexPath: (NSIndexPath *)indexPath{1617[self changeHighlightCellWithIndexPath:indexPath];1819}
5.设定Cell是否可选的回调如下所示，Cell被选中时该Cell的Selected为YES, 取消选中Selected为NO;
1/**2* Cell是否可以选中3*/4- (BOOL)collectionView:(UICollectionView *)collectionView shouldSelectItemAtIndexPath:(NSIndexPath *)indexPath{5returnYES;6}
6. 如果想让你的Cell支持多选，就需要设定一下CollectionView的allowsMultipleSelection属性，下面的代码是在ViewDidLoad中添加的，如下所示：
1//设置Cell多选2self.collectionView.allowsMultipleSelection = YES;
7.如果在多选状态下需要支持取消Cell的多选，那么就去执行下面的方法，并返回YES。就是支持在多选状态下取消选中状态。
1/**2* Cell多选时是否支持取消功能3*/4- (BOOL)collectionView:(UICollectionView *)collectionView shouldDeselectItemAtIndexPath:(NSIndexPath *)indexPath{5returnYES;6}
8.下面这个方法是自己封装的，用来根据Cell的选中状态来改变Cell上Button的选中状态，具体代码实现如下：
1/**2* Cell根据Cell选中状态来改变Cell上Button按钮的状态3*/4- (void) changeSelectStateWithIndexPath: (NSIndexPath *) indexPath{5//获取当前变化的Cell6CollectionViewCell *currentSelecteCell = (CollectionViewCell *)[self.collectionView cellForItemAtIndexPath:indexPath];78currentSelecteCell.selectButton.selected =currentSelecteCell.selected;910if(currentSelecteCell.selected ==YES){11NSLog(@"第%ld个Section上第%ld个Cell被选中了",indexPath.section ,indexPath.row);12return;13}1415if(currentSelecteCell.selected ==NO){16//NSLog(@"第%ld个Section上第%ld个Cell取消选中",indexPath.section ,indexPath.row);17}1819}
9.在Cell选中和取消选中时都会调用上面的方法来改变Button的选中状态，下面是Cell在选中时以及取消选中时所调用的方法：
1/**2* Cell选中调用该方法3*/4- (void)collectionView: (UICollectionView *)collectionView5didSelectItemAtIndexPath: (NSIndexPath *)indexPath{67[self changeSelectStateWithIndexPath:indexPath];8}910/**11* Cell取消选中调用该方法12*/13- (void)collectionView: (UICollectionView *)collectionView didDeselectItemAtIndexPath: (NSIndexPath *)indexPath{1415[self changeSelectStateWithIndexPath:indexPath];16}
10.下方四个方法是Cell将要出现，Cell出现后，Supplementary View将要出现以及Supplementary View已经出现所调用的方法，具体信息请看下方代码实现：
1/**2* Cell将要出现的时候调用该方法3*/4- (void)collectionView:(UICollectionView *)collectionView willDisplayCell:(UICollectionViewCell *)cell forItemAtIndexPath:(NSIndexPath *)indexPath NS_AVAILABLE_IOS(8_0){5NSLog(@"第%ld个Section上第%ld个Cell将要出现",indexPath.section ,indexPath.row);6}78/**9* Cell出现后调用该方法10*/11- (void)collectionView:(UICollectionView *)collectionView didEndDisplayingCell:(UICollectionViewCell *)cell forItemAtIndexPath:(NSIndexPath *)indexPath{12NSLog(@"第%ld个Section上第%ld个Cell已经出现",indexPath.section ,indexPath.row);13}141516/**17* headerView或者footerView将要出现的时候调用该方法18*/19- (void)collectionView:(UICollectionView *)collectionView willDisplaySupplementaryView:(UICollectionReusableView *)view forElementKind:(NSString *)elementKind atIndexPath:(NSIndexPath *)indexPath NS_AVAILABLE_IOS(8_0){2021NSLog(@"第%ld个Section上第%ld个扩展View将要出现",indexPath.section ,indexPath.row);2223}2425/**26* headerView或者footerView出现后调用该方法27*/28- (void)collectionView:(UICollectionView *)collectionView didEndDisplayingSupplementaryView:(UICollectionReusableView *)view forElementOfKind:(NSString *)elementKind atIndexPath:(NSIndexPath *)indexPath{2930NSLog(@"第%ld个Section上第%ld个扩展View已经出现",indexPath.section ,indexPath.row);3132}
在UICollectionViewDelegate回调方法中还有三个回调方法是关于Cell编辑的，比如copy, past, cut等操作，具体代码就不在此赘述了。在Demo中给出了实现方式，主要涉及到UIPasteboard的操作，本篇博客的整体的Demo回分享到Github上，下方是Github上的分享链接，感兴趣的小伙伴可以进行Clone。
Github分享链接：https://github.com/lizelu/CollectionViewControllerDemo