android 水平方向瀑布流,iOS实现水平方向瀑布流

效果

697cef5a58c4d273d6df17293ee0e66d.gif

//

// 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 ()

@property (nonatomic, strong) UICollectionView *collectionView;

@property (nonatomic) CGFloat rowHeight;

@property (nonatomic, strong) NSMutableArray *datas;

@property (nonatomic, strong) ResponseData *picturesData;

@property (nonatomic, strong) NSMutableArray *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

52582f49613770f7943add9c40ce4ba6.png

重载UICollectionViewLayout的四个方法

cbf5e0b718b6b1df8557b4be079ea83c.png

部分实现细节

52011dcbafad5f780d64f7662dca1b1e.png

eefc1c0a63591be084fef5b59eba4d64.png

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

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值