自定义UICollectionView布局

Posted 2023-03-19

参考技术A 相对于UITableView而言，UICollectionView具有更高的定制性和灵活性。它将其子视图的位置，大小和外观的控制权委托给一个单独的布局对象。通过提供这样一个自定义的布局对象，你几乎可以实现任何你能想想到的布局。布局继承自UICollectionViewLayout这几个抽象基类。ios6中以UICollectionViewFlowLayout类的形式提出了一个具体的布局实现。

一般有两种类型的collection view布局：

每个cell的位置和外观不是基于其显示的内容，但是所有的cell的显示顺序是基于内容的顺序。可以把默认的flowlayout作为例子。每个cell都基于前一个cell放置（或者如果没有足够的空间，则从下一行开始）。布局对象不必访问实际数据来计算布局。

布局对象不仅需要取出当前可见cell的数据，还需要从所有记录中取出一些决定当前哪些cell可见的数据。

首先做布局的准备工作，我们主要做两件事：1.用一个数组保存每列cell的origin.x。2.随机生成所有cell的高度，并用数组保存

提供collectionView的滚动区域大小。第一次进来的时候是0。

为每一个cell加一个layout属性

通过给每个cell的frame重新赋值来改变cell的坐标

最终根据cell的布局排列来确定collectionView的滚动区域大小

首先我们通过以下的方法获取collctionView有多少组,每组有多少列的数据

再计算出每列cell的origin.x，并用数组保存起来

最后随机生成所有cell的高度，保存到数组中

在刚进来的时候会走一次，为每个可见cell重新赋值frame之后又会走一次。maxCellYArrayWithArray:方法是用来求最大的cell的y坐标。以此来确定collection view 的滚动区域

为每一个cell加一个layout属性,返回一个数组。
initCellYArray方法是创建一个数组用来保存每列即将要排列的cell的origin.y

通过给每个cell的frame重新赋值来改变cell的坐标。你需要布局多少个cell，那么这个方法就会走多少次。每次都为每个cell重新赋上属性。本文里面只包含了它的frame。你还可以添加其他的属性，建议点开UICollectionViewLayoutAttributes的源文件查看。

iOS UICollectionView自定义流水布局(一)

参考技术A UICollectionViewFlowLayout

创建UICollectionViewLayout对象，通过设置UICollectionViewLayout对象属性的值可以设置item的基本布局，包括大小，间距，内边距、滚动方向等

当系统的布局无论怎么设置都无法满足需求的时候，我们就需要自定义布局，重写其计算布局的方法。

上图是系统默认布局，下图是自定义布局，可以注意到系统布局是将item两端对齐，间距根据剩余的宽度自己缩放，UICollectionViewFlowLayout的minimumInteritemSpacing属性设置的是最小间距，但如果要设置间距相等，系统布局就实现不了了。

两种方案都是通过继承UICollectionViewFlowLayout，这两种方案本质上都是通过修改对应位置的item来实现的

1.//获取指定位置的cell的布局

2.重写layoutAttributesForItemAtIndexPath:方法返回指定indexPath的布局

1.重写prepareLayout，每次更新布局的时候collectionView都回先调用这个方法，为将要开始的更新做准备，此时会将计算好的布局存储起来

2.重写layoutAttributesForElementsInRect:方法返回指定区域的布局

3.重写并调用layoutAttributesForItemAtIndexPath方法计算布局

4.如果需要自定义分区头部和尾部可以重写下面两个方法，并在prepareLayout里面做相应的处理

demo: https://github.com/SunshineLily/CollectionViewFlowLayout
参考： https://blog.csdn.net/lg767201403/article/details/90518273
参考： https://www.jianshu.com/p/5ee9333644ed