转载：
屎壳郎情调-成长日记
首先要知道：瀑布流的核心就是要获取到图片的长宽
网上的很多例子都是加载本地图片的 对于新手而言 改成加载网络图片的确是有点压力的 因为本地的图片 我们是很容易就能获取到他的 长宽的 但是网络图片的话 我们只能是先加载图片 然后得到他的长宽 这个时候就涉及到 异步加载图片的问题了 我们现在的思路是 获取网络图片地址 然后 开辟线程来加载该地址的图片 从而获取他的长宽
#import "shopRViewController.h" #import "TMQuiltView.h" #import "TMPhotoQuiltViewCell.h" @interface shopRViewController ()<TMQuiltViewDataSource,TMQuiltViewDelegate> { TMQuiltView *qtmquitView; } @property (nonatomic, retain) NSMutableArray *images; @end @implementation shopRViewController @synthesize images = _images; - (void)viewDidLoad { [super viewDidLoad]; [self.view setBackgroundColor:[[UIColor grayColor] colorWithAlphaComponent:0.2]]; //请求数据 self.factory = [[DataFactory alloc] initDataWithUrlString:ChanPinTuiJianHttpUrl vHttpMethod:@"post"]; self.factory.delegate = self; qtmquitView = [[TMQuiltView alloc] initWithFrame:CGRectMake(0, 0, 1024, 768)]; qtmquitView.delegate = self; qtmquitView.dataSource = self; [self.view addSubview:qtmquitView]; // [self createHeaderView]; // [self performSelector:@selector(testFinishedLoadData) withObject:nil afterDelay:0.0f]; } //解析数据 -(void)JsonDataDictionaryDetail:(NSMutableDictionary *)dataDic { self.arrayHeight = [[NSMutableArray alloc] initWithCapacity:1]; self.arrayWidth = [[NSMutableArray alloc] initWithCapacity:1]; @try { if(dataDic!=nil) { if(self.arrayProductDetail==nil) { self.arrayProductDetail = [[NSMutableArray alloc] initWithCapacity:1]; } else { [self.arrayProductDetail removeAllObjects]; [self.arrCopy removeAllObjects]; } for (int i = 0; i<[[dataDic objectForKey:@"data"] count]; i++) { ProdectDetail *p = [[ProdectDetail alloc] init]; p.ID = [dataDic objectForKey:@"data"][i][@"id"]; p.img = [dataDic objectForKey:@"data"][i][@"img"]; p.title = [dataDic objectForKey:@"data"][i][@"title"]; p.marketprice = [NSString stringWithFormat:@"%.2f",[[dataDic objectForKey:@"data"][i][@"marketprice"] floatValue]]; p.sellprice =[NSString stringWithFormat:@"%.2f",[[dataDic objectForKey:@"data"][i][@"sellprice"] floatValue]]; p.guige = [dataDic objectForKey:@"data"][i][@"guige"]; p.hots = [dataDic objectForKey:@"data"][i][@"hots"]; [self.arrayProductDetail addObject:p]; //开辟线程来加载图片 [self performSelectorInBackground:@selector(backgr:) withObject:p]; } self.arrCopy = [NSMutableArray arrayWithArray:self.arrayProductDetail]; } else { [self Msg:@"当前无网络连接！"]; } } @catch (NSException *exception) { } [qtmquitView reloadData]; } //线程加载图片获取 长 宽 -(void)backgr:(ProdectDetail *)p { NSURL *url = [NSURL URLWithString:p.img]; UIImage *imga = [[UIImage alloc] initWithData:[NSData dataWithContentsOfURL:url]]; [self.arrayWidth addObject:[NSString stringWithFormat:@"%f",imga.size.width]]; [self.arrayHeight addObject:[NSString stringWithFormat:@"%f",imga.size.height]]; //更新主线程 [self performSelectorOnMainThread:@selector(updateMain) withObject:nil waitUntilDone:NO]; } //刷新主线程做的事情 -(void)updateMain { //主线层要做的事情就是刷新布局 //刷新布局 [qtmquitView reloadData]; } //cell的个数 - (NSInteger)quiltViewNumberOfCells:(TMQuiltView *)TMQuiltView { return self.arrayWidth.count;//注意 这个count要跟 子线程里面的组数个数一致 （之前越界了 原来问题处在这里） } //cell事件 - (TMQuiltViewCell *)quiltView:(TMQuiltView *)quiltView cellAtIndexPath:(NSIndexPath *)indexPath { TMPhotoQuiltViewCell *cell = (TMPhotoQuiltViewCell *)[quiltView dequeueReusableCellWithReuseIdentifier:@"PhotoCell"]; if (!cell) { cell = [[[TMPhotoQuiltViewCell alloc] initWithReuseIdentifier:@"PhotoCell"] autorelease]; } ProdectDetail *p = [self.arrayProductDetail objectAtIndex:indexPath.row]; // cell.photoView.image = [self imageAtIndexPath:indexPath]; [cell.photoView setImageWithURL:[NSURL URLWithString:p.img]]; [cell.titleLabel setFont:[UIFont systemFontOfSize:15]]; [cell.headLabel setTextColor:[UIColor orangeColor]]; cell.headLabel.text = [NSString stringWithFormat:@"¥ %@",p.sellprice]; cell.titleLabel.text = [NSString stringWithFormat:@"%@%d",p.title, indexPath.row]; return cell; } #pragma mark - TMQuiltViewDelegate //设备旋转 - (NSInteger)quiltViewNumberOfColumns:(TMQuiltView *)quiltView { if ([[UIDevice currentDevice] orientation] == UIDeviceOrientationLandscapeLeft || [[UIDevice currentDevice] orientation] == UIDeviceOrientationLandscapeRight) { return 3; } else { return 4; } } //cell高度 这个是关键点 - (CGFloat)quiltView:(TMQuiltView *)quiltView heightForCellAtIndexPath:(NSIndexPath *)indexPath { if(self.arrayHeight.count>0) { float cell_height = 0.9*viewWidth/4*[[self.arrayHeight objectAtIndex:indexPath.row] floatValue]/[[self.arrayWidth objectAtIndex:indexPath.row] floatValue]; return cell_height; } } //选中事件要做的事情 - (void)quiltView:(TMQuiltView *)quiltView didSelectCellAtIndexPath:(NSIndexPath *)indexPath { NSLog(@"index:%d",indexPath.row); } - (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated. } @end
demo使用注意点：
使用方法 在TMQuiltView.m里面 修改间距 constCGFloat kTMQuiltViewDefaultMargin = 5.0f; //修改间距 修改Cell的布局样式 在 TMPhotoQuiltViewCell.m里面 添加布局样式 添加布局 / #import "TMPhotoQuiltViewCell.h" constCGFloat kTMPhotoQuiltViewMargin = 5; @implementation TMPhotoQuiltViewCell @synthesize photoView =_photoView; @synthesize titleLabel =_titleLabel; - (void)dealloc { [_photoView release], _photoView =nil; [_titleLabel release], _titleLabel =nil; [superdealloc]; } - (id)initWithReuseIdentifier:(NSString *)reuseIdentifier { self = [superinitWithReuseIdentifier:reuseIdentifier]; if (self) { self.backgroundColor = [UIColorwhiteColor]; } return self; } - (UIImageView *)photoView { if (!_photoView) { _photoView = [[UIImageViewalloc] init]; _photoView.contentMode =UIViewContentModeScaleAspectFill; _photoView.clipsToBounds =YES; [selfaddSubview:_photoView]; } return_photoView; } // //注意 添加的的布局一定要你写成这样 get set 形式否则会闪屏 // // - (UILabel *)titleLabel { if (!_titleLabel) { _titleLabel = [[UILabelalloc] init]; _titleLabel.backgroundColor = [[UIColorblackColor] colorWithAlphaComponent:0.5]; _titleLabel.textColor = [UIColorwhiteColor]; _titleLabel.textAlignment =UITextAlignmentCenter; [selfaddSubview:_titleLabel]; } return_titleLabel; } //布局 - (void)layoutSubviews { self.photoView.frame =CGRectInset(self.bounds,kTMPhotoQuiltViewMargin, kTMPhotoQuiltViewMargin); //下标题 self.titleLabel.frame =CGRectMake(kTMPhotoQuiltViewMargin,self.bounds.size.height - 20 - kTMPhotoQuiltViewMargin, self.bounds.size.width -2 * kTMPhotoQuiltViewMargin,20); }
@end
demo下载地址 （加载本地图片的）
http://download.csdn.net/detail/aa741649143/6518895