自定义UICollectionViewLayout到瀑布流

collectionViewLayout是个很强大的控件,有了它不仅能帮助我们快捷而准确的解决9宫格布局的问题,更是能解决很多特殊布局的难点.比如,瀑布流:


collectionView的创建需要一个layout属性

一般来说我们都是直接使用一个UICollectionViewFlowLayout的布局方式,也就是流水布局,来放置我们的collectionView

但是,为了达到瀑布流的效果,我们就需要根据服务器提供的数据,来重写布局.


创建一个我们自己的布局

这个布局继承自UICollcetionViewLayout

我们需要重写这个类的一些方法.并提供一些外部能自定义的属性


考虑到瀑布流cell和整体的设置需求,留给外部的接口


init方法中去设定一些基本的属性的默认值


这个方法的设定是为了保证只要布局重新计算,我们就刷新layout里面的attributes


用一个字典来存储每一列最大的Y值,用一个可变数组来存放界面中所有cell的attributes


貌似还有可以改善的地方,就是此时只去遍历屏幕中能看见的cell,而不是去遍历整个collectionview中所有cell


这个就是去计算瀑布流的布局了.

首先是遍历了字典中所有的maxY来计算最小的那个Y

然后返回这个最短Y的那个cell的attrs,其中的代理方法是为了得到和服务器提供数据比例一致的宽高比.


这个方法需要返回所有的在attrs,但是每次重新布局时prepareLayout就已经计算好了,就不需要我们再次计算了

最后就是要设定下这个collectionView的contentSize了,应该是最大的cellY加上我们所设置的sectionInset的bottom值了


这样就能够得到一个自定义的瀑布流的布局了

只需要将自己的模型属性放到自定义的cell中,然后创建时直接调用这个布局,就能有瀑布流的效果了.这个方法确实要比以前自定义scrollView的思路简单很多了,而且不需要自己去考虑缓存和datasource方法,使得布局简单了很多.


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

友情链接更多精彩内容