最新研究了下iOS中瀑布流的实现方法,一般瀑布流都采用ScrollView + UITableView,或者是使用UICollectionView实现。
ScrollView + UITableView
使用这种方法实现瀑布流的话,首先底层应该是一个 UIScrollView
,然后再 UIScrollView
上面添加 UITableView
,但是这个方法有很多不太好的地方,首先这两个控件都可以单独滚动,所以需要把 UITableView
的滚动禁止了,如果有很多列的话就需要很多个 UITableView
,而且还需要单独的管理每一列的东西,下标也不好计算
UICollectionView
使用这个方法,对比以上方法,UICollectionView
系统帮解决了cell的重用问题,而且不需要分列管理,在计算的时候也比较方便,所以大多数的瀑布流都使用 UICollectionView
实现思路
我们需要把每一个不同高度的cell填充到里面去,而且要保持长短的平均,所以我们需要每次都把cell放到所有列中最短的那一列后边拼接,这样就可以实现长短不一了,然后再加上行跟列的间距以及边缘宽度,就可以了。
实现
首先我们需要写一个自定义布局,并且继承于 UICollectionViewLayout
我们需要实现四个方法:
- (void)prepareLayout
- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect
- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath
- (CGSize)collectionViewContentSize
这四个方法作用分别是
/**
* 布局准备方法 初始化会被调用一次
* 当collectionView的布局发生变化时 会被调用
* 通常是做布局的准备工作 itemSize.....
*/
- (void)prepareLayout {
[super prepareLayout];
...
}
/**
* 所有cell的布局属性
*/
- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect {
...
}
/**
* 返回indexPath位置cell对应的布局属性
*/
- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath {
...
}
/**
* 内容大小
*
* @return 大小
*/
- (CGSize)collectionViewContentSize {
...
}
实现这个四个方法后,一个布局就写好了
最后的效果~