iOS实现水平方向瀑布流

效果

源码：https://github.com/youxianming/animations 

//
// gridflowlayoutviewcontroller.m
// animations
//
// created by youxianming on 16/5/5.
// copyright © 2016年 youxianming. all rights reserved.
//

#import "gridflowlayoutviewcontroller.h"
#import "uiview+setrect.h"
#import "gridlayout.h"
#import "flowstylecell.h"
#import "filemanager.h"
#import "nsstring+md5.h"
#import "nsdata+jsondata.h"
#import "responsedata.h"
#import "math.h"
#import "gcd.h"

static nsstring *picturessource = @"http://www.duitang.com/album/1733789/masn/p/0/50/";

@interface gridflowlayoutviewcontroller () <uicollectionviewdatasource, uicollectionviewdelegate, gridlayoutdelegate>

@property (nonatomic, strong) uicollectionview *collectionview;
@property (nonatomic)   cgfloat   rowheight;
@property (nonatomic, strong) nsmutablearray *datas;
@property (nonatomic, strong) responsedata  *picturesdata;
@property (nonatomic, strong) nsmutablearray <waterfallpicturemodel *> *datasource;

@end

@implementation gridflowlayoutviewcontroller

- (void)setup {
 
 [super setup];
 
 _datasource = [nsmutablearray new];
 
 // 初始化布局文件
 cgfloat gap    = 1;
 nsinteger rowcount  = arc4random() % 3 + 2;
 _rowheight    = (self.contentview.height - (rowcount + 1) * gap) / (cgfloat)rowcount;
 gridlayout *layout  = [gridlayout new];
 layout.manager.edgeinsets = uiedgeinsetsmake(gap, gap, gap, gap);
 layout.manager.gap  = gap;
 layout.delegate   = self;
 
 nsmutablearray *rowheights = [nsmutablearray array];
 for (int i = 0; i < rowcount; i++) {
  
  [rowheights addobject:@(_rowheight)];
 }
 layout.manager.rowheights = rowheights;
 
 self.collectionview        = [[uicollectionview alloc] initwithframe:self.contentview.bounds
                   collectionviewlayout:layout];
 self.collectionview.delegate      = self;
 self.collectionview.datasource      = self;
 self.collectionview.backgroundcolor    = [uicolor clearcolor];
 self.collectionview.showshorizontalscrollindicator = no;
 self.collectionview.alpha       = 0;
 [self.collectionview registerclass:[flowstylecell class] forcellwithreuseidentifier:@"flowstylecell"];
 [self.contentview addsubview:self.collectionview];
 
 // 获取数据
 [gcdqueue executeinglobalqueue:^{
  
  nsstring *string  = [picturessource lowermd532bitstring];
  nsstring *realfilepath = [filemanager therealfilepath:[nsstring stringwithformat:@"~/documents/%@", string]];
  nsdata *data   = nil;
  
  if ([filemanager fileexistwithrealfilepath:realfilepath] == no) {
   
   data = [[nsdata alloc] initwithcontentsofurl:[nsurl urlwithstring:picturessource]];
   [data writetofile:realfilepath atomically:yes];
   
  } else {
   
   data = [nsdata datawithcontentsoffile:realfilepath];
  }
  
  nsdictionary *datadic = [data tolistproperty];
  
  [gcdqueue executeinmainqueue:^{
   
   self.picturesdata = [[responsedata alloc] initwithdictionary:datadic];
   if (self.picturesdata.success.integervalue == 1) {
    
    for (int i = 0; i < self.picturesdata.data.blogs.count; i++) {
     
     [_datasource addobject:self.picturesdata.data.blogs[i]];
    }
    
    [_collectionview reloaddata];
    [uiview animatewithduration:0.5f animations:^{
     
     _collectionview.alpha = 1.f;
    }];
   }
  }];
 }];
}

- (nsinteger)collectionview:(uicollectionview *)collectionview numberofitemsinsection:(nsinteger)section {
 
 return self.datasource.count;
}

- (uicollectionviewcell *)collectionview:(uicollectionview *)collectionview cellforitematindexpath:(nsindexpath *)indexpath {
 
 waterfallpicturemodel *picturemodel = _datasource[indexpath.row];
 
 flowstylecell *cell = [collectionview dequeuereusablecellwithreuseidentifier:@"flowstylecell" forindexpath:indexpath];
 cell.indexpath  = indexpath;
 cell.data   = picturemodel;
 cell.rowheight  = _rowheight;
 [cell loadcontent];
 
 return cell;
}

- (cgfloat)itemwidthwithindexpath:(nsindexpath *)indexpath {
 
 waterfallpicturemodel *picturemodel = _datasource[indexpath.row];
 
 return [math resetfromsize:cgsizemake(picturemodel.iwd.floatvalue, picturemodel.iht.floatvalue)
    withfixedheight:_rowheight].width;
}

@end 

细节
继承uicollectionviewlayout

重载uicollectionviewlayout的四个方法

部分实现细节

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。