iOS瀑布流

最新研究了下iOS中瀑布流的实现方法，一般瀑布流都采用ScrollView + UITableView，或者是使用UICollectionView实现。

ScrollView + UITableView

使用这种方法实现瀑布流的话，首先底层应该是一个 UIScrollView ，然后再 UIScrollView 上面添加 UITableView ，但是这个方法有很多不太好的地方，首先这两个控件都可以单独滚动，所以需要把 UITableView 的滚动禁止了，如果有很多列的话就需要很多个 UITableView，而且还需要单独的管理每一列的东西，下标也不好计算

pbl1.png

UICollectionView

使用这个方法，对比以上方法，UICollectionView 系统帮解决了cell的重用问题，而且不需要分列管理，在计算的时候也比较方便，所以大多数的瀑布流都使用 UICollectionView

实现思路

我们需要把每一个不同高度的cell填充到里面去，而且要保持长短的平均，所以我们需要每次都把cell放到所有列中最短的那一列后边拼接，这样就可以实现长短不一了，然后再加上行跟列的间距以及边缘宽度，就可以了。

pbl1.png

实现

首先我们需要写一个自定义布局，并且继承于 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 {
    ...    
}

实现这个四个方法后，一个布局就写好了

最后的效果~

pbl1.png

Demo代码在github上的地址~~