博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
iOS之瀑布流布局设计
阅读量:4316 次
发布时间:2019-06-06

本文共 3517 字,大约阅读时间需要 11 分钟。

#import "CXDWaterflowLayout.h"/** 默认的列数 */static const NSInteger CXDDefaultColumnCount = 3;/** 每一列之间的间距 */static const CGFloat CXDDefaultColumnMargin = 10;/** 每一行之间的间距 */static const CGFloat CXDDefaultRowMargin = 10;/** 边缘间距 */static const UIEdgeInsets CXDDefaultEdgeInsets = {
10, 10, 10, 10};@interface CXDWaterflowLayout()/** 存放所有cell的布局属性 */@property (nonatomic, strong) NSMutableArray *attrsArray;/** 存放所有列的当前高度 */@property (nonatomic, strong) NSMutableArray *columnHeights;@end@implementation CXDWaterflowLayout- (NSMutableArray *)columnHeights{ if (!_columnHeights) { _columnHeights = [NSMutableArray array]; } return _columnHeights;}- (NSMutableArray *)attrsArray{ if (!_attrsArray) { _attrsArray = [NSMutableArray array]; } return _attrsArray;}/** * 初始化 */- (void)prepareLayout{ [super prepareLayout]; // 清除以前计算的所有高度 [self.columnHeights removeAllObjects]; for (NSInteger i = 0; i < CXDDefaultColumnCount; i++) { [self.columnHeights addObject:@(CXDDefaultEdgeInsets.top)]; } // 清除之前所有的布局属性 [self.attrsArray removeAllObjects]; // 开始创建每一个cell对应的布局属性 NSInteger count = [self.collectionView numberOfItemsInSection:0]; for (NSInteger i = 0; i < count; i++) { // 创建位置 NSIndexPath *indexPath = [NSIndexPath indexPathForItem:i inSection:0]; // 获取indexPath位置cell对应的布局属性 UICollectionViewLayoutAttributes *attrs = [self layoutAttributesForItemAtIndexPath:indexPath]; [self.attrsArray addObject:attrs]; }}/** * 决定cell的排布 */- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect{ return self.attrsArray;}/** * 返回indexPath位置cell对应的布局属性 */- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath{ // 创建布局属性 UICollectionViewLayoutAttributes *attrs = [UICollectionViewLayoutAttributes layoutAttributesForCellWithIndexPath:indexPath]; // collectionView的宽度 CGFloat collectionViewW = self.collectionView.frame.size.width; // 设置布局属性的frame CGFloat w = (collectionViewW - CXDDefaultEdgeInsets.left - CXDDefaultEdgeInsets.right - (CXDDefaultColumnCount - 1) * CXDDefaultColumnMargin) / CXDDefaultColumnCount; CGFloat h = 50 + arc4random_uniform(100); // 找出高度最短的那一列 NSInteger destColumn = 0; CGFloat minColumnHeight = [self.columnHeights[0] doubleValue]; for (NSInteger i = 1; i < CXDDefaultColumnCount; i++) { // 取得第i列的高度 CGFloat columnHeight = [self.columnHeights[i] doubleValue]; if (minColumnHeight > columnHeight) { minColumnHeight = columnHeight; destColumn = i; } } CGFloat x = CXDDefaultEdgeInsets.left + destColumn * (w + CXDDefaultColumnMargin); CGFloat y = minColumnHeight; if (y != CXDDefaultEdgeInsets.top) { y += CXDDefaultRowMargin; } attrs.frame = CGRectMake(x, y, w, h); // 更新最短那列的高度 self.columnHeights[destColumn] = @(CGRectGetMaxY(attrs.frame)); return attrs;}- (CGSize)collectionViewContentSize{ CGFloat maxColumnHeight = [self.columnHeights[0] doubleValue]; for (NSInteger i = 1; i < CXDDefaultColumnCount; i++) { // 取得第i列的高度 CGFloat columnHeight = [self.columnHeights[i] doubleValue]; if (maxColumnHeight < columnHeight) { maxColumnHeight = columnHeight; } } return CGSizeMake(0, maxColumnHeight + CXDDefaultEdgeInsets.bottom);}@end

ps:继承UICollectionViewLayout类,实现其中方法,找到高度最短的那一列填充对应数据即可

转载于:https://www.cnblogs.com/chixuedong/p/5349867.html

你可能感兴趣的文章
(转))iOS App上架AppStore 会遇到的坑
查看>>
解决vmware与主机无法连通的问题
查看>>
做好产品
查看>>
项目管理经验
查看>>
笔记:Hadoop权威指南 第8章 MapReduce 的特性
查看>>
JMeter响应数据出现乱码的处理-三种解决方式
查看>>
获取设备实际宽度
查看>>
Notes on <High Performance MySQL> -- Ch3: Schema Optimization and Indexing
查看>>
Alpha冲刺(10/10)
查看>>
数组Array的API2
查看>>
为什么 Redis 重启后没有正确恢复之前的内存数据
查看>>
No qualifying bean of type available问题修复
查看>>
第四周助教心得体会
查看>>
spfile
查看>>
Team Foundation Service更新:改善了导航和项目状态速查功能
查看>>
WordPress资源站点推荐
查看>>
Python性能鸡汤
查看>>
android Manifest.xml选项
查看>>
Cookie/Session机制具体解释
查看>>
ATMEGA16 IOport相关汇总
查看>>