瀑布流视图控件“quilt”的用法

 "quilt"的用法：

      1.首先去github上下载开源的代码吧。

      2.你会发现下载下来的代码中有好几个文件夹，将下面路径下的6个文件直接拖拽到你的工程里（不用像demo中添加那么多）：

      3.去往你要实现的类，在头文件中添加如下代码：

[csharp] view plaincopy

1. #import <UIKit/UIKit.h>  
2. #import "TMQuiltView.h"  
3. @interface WaterFlowVC : UIViewController<TMQuiltViewDataSource,TMQuiltViewDelegate>  
4. {  
5.     TMQuiltView *_tmQuiltView;  
6.     NSMutableArray *_images;  
7. }  
8. @property (nonatomic,retain)TMQuiltView *tmQuiltView;  
9. @property (nonatomic,retain)NSMutableArray *images;  
10. @end  

       其中tmQuiltView就是1000memories他们定义的瀑布流控件了，类似于tableView（从添加的协议就可以看的出来很像），_images是个数据源，存放图片的数组。

       4.再去.m文件实现数据源和代理：

[csharp] view plaincopy

1. #pragma mark -  
2. #pragma mark TMQuiltViewDataSource  
3. -(NSInteger)quiltViewNumberOfCells:(TMQuiltView *)TMQuiltView  
4. {  
5.     return [self.images count];  
6. }  
7.   
8. -(TMQuiltViewCell *)quiltView:(TMQuiltView *)quiltView cellAtIndexPath:(NSIndexPath *)indexPath  
9. {  
10.     NSString *identifierStr = @"photoIdentifier";  
11.     TMPhotoQuiltViewCell *cell = (TMPhotoQuiltViewCell *)[quiltView dequeueReusableCellWithReuseIdentifier:identifierStr];  
12.     if (!cell)  
13.     {  
14.         cell = [[[TMPhotoQuiltViewCell alloc] initWithReuseIdentifier:identifierStr] autorelease];  
15.     }  
16.     cell.photoView.image = [self imageAtIndexPath:indexPath];  
17.     cell.titleLabel.text = [NSString stringWithFormat:@"%d", indexPath.row + 1];  
18.     return cell;  
19. }  
20. #pragma mark -  
21. #pragma mark TMQuiltViewDelegate  
22. //列数  
23. - (NSInteger)quiltViewNumberOfColumns:(TMQuiltView *)quiltView  
24. {  
25.     return 2;  
26. }  
27. //单元高度  
28. - (CGFloat)quiltView:(TMQuiltView *)quiltView heightForCellAtIndexPath:(NSIndexPath *)indexPath {  
29.       
30.     float height = [self imageAtIndexPath:indexPath].size.height / [self quiltViewNumberOfColumns:quiltView];  
31.     return height;  
32. }  

         数据源和代理方法需要的就这么多，有其它需求可以跳转到定义数据源和代理的类看一下。给出的demo中将

-(NSArray *)images和- (UIImage *)imageAtIndexPath:(NSIndexPath *)indexPath两个方法也写在了数据源中，注意这两个方法不是数据源的方法。

        其中TMPhotoQuiltViewCell是我直接从demo中拷贝出来的自定义的单元，你可以根据自己的需求将其改成你想要的外观。

        代理方法与tableview的代理很是相似，所以也很容易懂。

        5.最后是一些需要定义的变量了：

[csharp] view plaincopy

1. - (void)viewDidLoad  
2. {  
3.     [super viewDidLoad];  
4.     self.view.backgroundColor = [UIColor blackColor];  
5.       
6.     _tmQuiltView = [[TMQuiltView alloc] init];  
7.     _tmQuiltView.frame = CGRectMake(0, 0, 320, [[UIScreen mainScreen] bounds].size.height-20-44);  
8.     _tmQuiltView.delegate = self;  
9.     _tmQuiltView.dataSource = self;  
10.    
11.     [self.view addSubview:_tmQuiltView];  
12.     [_tmQuiltView reloadData];  
13.       
14.     NSMutableArray *imageNames = [[NSMutableArray alloc] init];  
15.     for (int i = 0; i< kNumberOfCells;i++ )  
16.     {  
17.         [imageNames addObject:[NSString stringWithFormat:@"%d.jpeg",i % 10 + 1]];  
18.     }  
19.     self.images = imageNames;  
20.     [imageNames release];  
21.       
22.     [_tmQuiltView reloadData];  
23. }  

另外，如果要给每个UIImageView添加上阴影，滚动起来会有卡顿的现象，不过，加上下面的第一行代码就OK了：

[plain] view plaincopy

1. //添加这句解决了阴影卡顿问题  
2. self.layer.shadowPath =[UIBezierPath bezierPathWithRect:self.bounds].CGPath;  
3. self.layer.shadowColor = [UIColor blackColor].CGColor;  
4. self.layer.shadowOffset = CGSizeMake(1, 1);  
5. self.layer.shadowOpacity = 0.5;