UICollectionView(集合视图学习笔记)

#####集合视图的作用 集合视图是为了增强网格视图开发而在IOS6中开放的集合视图API。 #####集合视图的组成 集合视图有4个重要的组成部分，分别为：

1. 单元格：即视图中的一个单元格。
2. 节：即集合视图中的一个行数据，由多个单元格构成。
3. 补充视图：即节的头和脚。
4. 装饰视图：集合视图中的背景视图。 #####集合视图 集合视图UICollectionView继承自UIScrollView。集合视图也有两个协议：UICollectionViewDelegate委托协议和UICollectionViewDataSource数据源协议。UICollectionViewCell是单元格类，它的布局是由UICollectionViewLayout类定义的，它是一个抽象类。UICollectionViewFlowLayout类是UICollectionViewLayout类的子类，对于复杂的布局，可以自定义UICollectionViewLayout类。UICollectionView对应的控制器是UICollectionViewController类。 #####单元格 集合视图单元格是集合视图中最为重要的组成部分，没有样式和风格定义，单元格就是一个视图，可以在内部放置其他视图或控件。自定义一个单元格类，它需要继承UICollectionViewCell。 #####集合视图的一些常见属性 初始化：UICollectionView *collectionView = [[UICollectionView alloc]initWithFrame:CGRectZero collectionViewLayout:布局方式]; 注册cell：[collectionView registerClass:要注册的cell类 forCellWithReuseIdentifier:重用标识符]; 刷新数据：[collectionView reloadData]; 设置代理：delegate； 设置数据源：dataSource； 是否有反弹效果：bounces，默认是YES； 设置垂直方向的反弹是否有效：alwaysBounceVertical； 设置水平方向的反弹是否有效：alwaysBounceHorizontal； 是否允许滚动：scrollEnabled； 是否显示垂直方向的滚动条：showsVerticalScrollIndicator； 是否显示水平方向的滚动条：showsHorizontalScrollIndicator； 是否允许多选：allowsMultipleSelection； #####数据源与委托协议 集合视图的委托协议是UICollectionViewDelegate，数据源协议是UICollectionViewDataSource。 UICollectionViewDataSource中提供的方法如下：

//提供视图中节的个数，这个方法需要注意数据的行是否能与每一行有几个单元格整除，不能整除时要多加一行
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
}
复制代码

//每一节有几个单元格
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
}
复制代码

//为某个单元格提供显示数据
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
}
复制代码

//为补充视图提供显示数据
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath{
}
复制代码

#####创建cell 创建cell通过集合视图的dequeueReusableCellWithReuseIdentifier:forIndexPath：返回可重用单元格， 例如：

UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
复制代码

其中第一个参数是可重用单元格标识符，第二个参数是NSIndexPath类型，NSIndexPath是一种数据结构，是一种复杂多维数组结构，常用的属性是section和row两个，section是集合视图节索引，row是集合视图中单元格的索引。 委托协议UICollectionViewDelegate提供的常用方法如下：

//返回这个UICollectionView是否可以被选择
-(BOOL)collectionView:(UICollectionView *)collectionView shouldSelectItemAtIndexPath:(NSIndexPath *)indexPath{
    return YES;
}
复制代码

//选择单元格之后触发
-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
}
复制代码

//取消选择单元格之后触发
- (void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath{
}
复制代码

创建一个可以多选的集合视图示例:

//多选要设置属性allowsMultipleSelection为YES
-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
//获取当前要操作的Cell
    self.cell = (YSLSeeEvaluateCell *)[collectionView cellForItemAtIndexPath:indexPath];
//可以对cell 的属性做一些设置
    self.cell.title.textColor = [YSLUiUtils colorPrimary];
    CALayer *layer = [self.cell.title layer];
    [layer setBorderWidth:0.5f];
    [layer setBorderColor:[YSLUiUtils colorPrimary].CGColor];
    layer.cornerRadius = 3.0f;
}

- (void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath{
//获取当前要操作的Cell
    self.cell = (YSLSeeEvaluateCell *)[collectionView cellForItemAtIndexPath:indexPath];
//可以对cell 的属性做一些设置
    self.cell.title.textColor = [YSLUiUtils colorThree];
    CALayer *layer = [self.cell.title layer];
    [layer setBorderWidth:0.5f];
    [layer setBorderColor:[YSLUiUtils colorSeven].CGColor];
    layer.cornerRadius = 3.0f;
}
复制代码

#####UICollectionViewFlowLayout流布局管理器 UICollectionViewFlowLayout是一种流布局管理器，即从左到右从上到下布局。 #####流布局管理器的一些常见属性 初始化：UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc]init]; 设置滚动方向：scrollDirection，默认为垂直滚动UICollectionViewScrollDirectionVertical，设置为UICollectionViewScrollDirectionHorizontal为水平滚动。 设置每个单元格的大小：itemSize。 设置整个collectionView的内边距：sectionInset，类型是UIEdgeInsets结构体。UIEdgeInsets包括：top（上边界），left（左边界），bottom（下边界），right（右边界）4个成员。UIEdgeInsetsMake函数可以创建UIEdgeInsets结构体实例。 设置每一行之间的间距：minimumLineSpacing。 设置单元格之间的间距：minimumInteritemSpacing。 #####UICollectionViewDelegateFlowLayout提供的一些方法

//动态设置每个Item的尺寸大小
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
}
复制代码

//动态设置每个分区的EdgeInsets
- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section{
}
复制代码

//动态设置每行的间距大小
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section{
}
复制代码

//动态设置每个单元格的间距大小
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section{
}
复制代码

//动态设置某个分区头视图大小
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section{
}
复制代码

//动态设置某个分区尾视图大小
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section{
}
复制代码

转载于:https://juejin.im/post/5cb467885188251d2869994e