iOS实现水平方向瀑布流

时间:2022-09-20 11:30:18

效果

iOS实现水平方向瀑布流

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

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
//
// 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

iOS实现水平方向瀑布流

重载uicollectionviewlayout的四个方法

iOS实现水平方向瀑布流

部分实现细节

iOS实现水平方向瀑布流

iOS实现水平方向瀑布流

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