collectionView

经典应用：流水布局，滚动轮播，照片墙

1.collectionView的元素

• a. cell:单元格，展示内容的容器

• b. supplementaryView：补充视图，相当于tableView的组头和组尾

• c. DecorationView：装饰View,装饰整个collectionView的背景

• 2. Cell的使用：

• a.注册：collectionView的cell必须要注册（苹果官方推荐tableView的cell也使用注册的方式，这点注意下）。

- (void)registerClass:forCellWithReuseIdentifier:
- (void)registerNib:forCellWithReuseIdentifier:

• b.数据源：使用collectionViewDatasource来设置数据，和tableView的使用类似，多少组，每组多少行，每一个cell的内容.

• c. Cell的重用：这也是collectionView得以重用的一个很重要的原因，系统自带一个缓存池，我们使用cell的时候除了初次创建的时，系统会帮我们创建 系统可显现的个数+1 个cell,后面再需要显示cell时，都不会再创建了，而是从缓存池中根据设定的重用标识符去取。而且这些工作都是系统帮我们做的，我们需要做的只是简单的使用一行代码dequeueReusableCellWithReuseIdentifier:forIndexPath:就可以搞定。

• d. UICollectionViewDelegate:

->.控制cell的高亮显示

collectionView:shouldHighlightItemAtIndexPath:
collectionView:didHighlightItemAtIndexPath:
collectionView:didUnhighlightItemAtIndexPath

-> cell的被选中调用

collectionView:shouldSelectItemAtIndexPath:
collectionView:didSelectItemAtIndexPath:
collectionView:shouldDeselectItemAtIndexPath:
collectionView:didDeselectItemAtIndexPath:

3. UICollectionViewLayout，UICollectionViewFlowLayout及自定义layout

不同于tableView只有简单的两个style样式(group和plane),collectionView采用一个布局变量来描述其布局方式. 这两个都是collectionView的布局属性，也是collectionView的重点所在，我们可以通过自定义布局属性继承自这俩，来实现很多酷炫的界面布局。其中UICollectionViewFlowLayout继承自UICollectionViewLayout。

• UICollectionViewLayout:为我们提供了一些基本布局属性：位置，大小，透明度，Zindex(上下的顺序)，专场。

• UICollectionViewFlowLayout:系统帮我们实现的一个强大的流水布局，因为一般呈网格状布局，所以也叫网格布局、我们只需要在实例化collectionView的时候指定该布局变量，然后设置每个item的size，系统就可以帮我们实现一个网格的布局。UICollectionViewFlowLayout可设置的属性：

  • itemSize(每个cell的大小)

  • scrollingDirection(滚动方向),

  • header和footer的size，

  • minimumInteritemSpacing(相邻item之间的间距),

  • minimumLineSpacing(最小行间距)

• 自定义layout:一般选择继承自UICollectionViewFlowLayout(静态布局可继承自UICollectionViewLayout),

  然后在自定义类中实现以下几个方法,因为在实例化一个UICollectionViewLayout后,系统会调用这一系列的准备方法.

[objc]  view plain  copy

 

1. - (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath;//返回一个布局变量  
2. - (NSArray<UICollectionViewLayoutAttributes *> *)layoutAttributesForElementsInRect:(CGRect)rect//返回一个布局变量的数组,在这个里面调用上面的方法生成布局变量.这里实例化UICollectionViewLayoutAttributes的时候一定不能使用alloc,init  
3. - (CGSize)collectionViewContentSize//计算collectionView的contentSize  
4. - (void)prepareLayout;//记得先调用super的prepareLayout,一般在里面做一些必要参数的初始化.例如环形布局中的center和radius.因为每次在重新给出layout时,该方法都会被调用  
5. - (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds//边界发生改变时,是否刷新布局  

• 注意:调用顺序

  • (void)prepareLayout---默认什么都没做,一般重写该方法初始化必要的参数

  • (CGSize)collectionViewContentSize,计算collectionView的contentSize,指的是所有内容的contentSize.只有配置好这个,collectionView才能滚动

  • (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect,返回一组布局变量

• 布局切换

setCollectionViewLayout:animated://可使用动画方式切换布局

4.supplementaryView(组头，组尾)

• 通过数据源的方法提供内容,需要注册使用

• 在layout中需要添加布局变量

• size即可以通过属性设置,也可以通过代理方法设置

5.DecorationView：装饰View,装饰整个collectionView的背景.它完全由layout去控制实现的,只需要给它注册后设置好布局属性,系统就会给它显示出来.

backgroundView只能设置全屏的背景,但是decorationView可以添加多个背景

• a.在自定义的layout.m中的- (void)prepareLayout中注册decorationView:

  [self registerNib: forDecorationViewOfKind:];//这里的self,指的是layout对象
  [self registerClass:forDecorationViewOfKind:];

• b.在- (NSArray*)layoutAttributesForElementsInRect:(CGRect)rect中添加decorationView的布局变量(item的布局变量也是同时加入的).

• c.在 - (UICollectionViewLayoutAttributes )layoutAttributesForDecorationViewOfKind:(NSString )elementKind atIndexPath:(NSIndexPath *)indexPath 中返回一个decorationView的布局变量

• d.自定义的decorationView,要继承自UICollectionReusableView