[翻译] CHTCollectionViewWaterfallLayout

CHTCollectionViewWaterfallLayout

https://github.com/chiahsien/CHTCollectionViewWaterfallLayout

 

CHTCollectionViewWaterfallLayout is a subclass of UICollectionViewLayout, and it trys to imitate UICollectionViewFlowLayout's usage as much as possible.

This layout is inspired by Pinterest. It also is compatible with PSTCollectionView.

CHTCollectionViewWaterfallLayout是UICollectionViewLayout的子类，尽量模仿它的瀑布流效果，这个布局效果灵感来自于Pinterest。它与PSTCollectionView兼容。

Features 特点

• Easy to use, it trys to imitate UICollectionViewFlowLayout's usage as much as possible.
• Highly customizable.
• Outstanding performance, try 10,000+ items and see the smoothness for yourself.
• Support header and footer views.
• 非常好用，已经把UICollectionViewFlowLayout的使用模拟到了极致。
• 高度可定制性质
• 杰出的效果显示，你可以试试10000+个显示内容，自己体验一下它的流畅度
• 支持header以及footer的views

Prerequisite 前提

• ARC
• Xcode 4.4+, which supports literals syntax.
• iOS 6+, or
• iOS 4.x/5.x, with PSTCollectionView.

How to install 怎么安装

• CocoaPods
  Add pod 'CHTCollectionViewWaterfallLayout' to your podfile.
• Manual
  Copy CHTCollectionViewWaterfallLayout.h/m to your project. 将头文件拷贝到你的工程项目即可

How to Use 怎么使用

Read the demo codes and CHTCollectionViewWaterfallLayout.h header file for more information.

你可以从CHTCollectionViewWaterfallLayout.h头文件中读取到更多的使用细节。

Step 1 - 第1步

Below lists the properties for you to customize the layout. Although they have default values, I strongly recommand you to set up at least the columnCount property to suit your needs. The itemRenderDirection property is an enum which decides the order in which your items will be rendered in subsequent rows. For eg. Left-Right | Right-Left | Shortest column filling up first.

以下列表中得属性是让你来定制layout布局的。虽然他们都有默认值，但我强烈建议你至少设置这个列数columnCount的属性来满足你的需求。itemRenderDirection属性是一个枚举值，用来决定你的rows怎么被你渲染。比如，左-右，右-左，最短的填充。

@property (nonatomic, assign) NSInteger columnCount; @property (nonatomic, assign) CGFloat minimumColumnSpacing; @property (nonatomic, assign) CGFloat minimumInteritemSpacing; @property (nonatomic, assign) CGFloat headerHeight; @property (nonatomic, assign) CGFloat footerHeight; @property (nonatomic, assign) UIEdgeInsets sectionInset; @property (nonatomic, assign) ItemRenderDirection itemRenderDirection; 

Step 2 - 第2步

Your collection view's delegate (which often is your view controller) must conforms toCHTCollectionViewDelegateWaterfallLayout protocol and implements the required method, all you need to do is return the original size of the item:

你的collection的代理必须实现这个协议，然后每一个返回相对应的值就行了：

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath; 

Step 3 (Optional) - 第3步

If you need to support iOS 4.x/5.x and you have installed PSTCollectionView, then you NEED to modify some codes.

如果你想要兼容iOS 4.x/5.x，那么你就需要安装这个类PSTCollectionView，然后，你需要修改一些源码。

Quoted from PSTCollectionView README file:

If you want to have PSTCollectionView on iOS4.3/5.x and UICollectionView on iOS6, use PSUICollectionView (basically add PS on any UICollectionView* class to get auto-support for older iOS versions) If you always want to use PSTCollectionView, use PSTCollectionView as class names. (replace the UI with PST)

Limitation 限制

• Only vertical scrolling is supported. 只支持竖直滚动
• No decoration view. 没有装饰用view