KEZCollectionViewTableLayout 1.0.2

KEZCollectionViewTableLayout 1.0.2

测试已测试
Lang语言 Obj-CObjective C
许可证 MIT
发布上次发布2014 年 12 月

James Richard 维护。



  • James Richard

一个UICollectionViewLayout子类,将你的单元格放入类似于电子表格的网格位置。它支持单元格作为常规单元格,行和列头作为补充视图,以及角落视图作为装饰视图来填充在使用行和列头时右上方的空间。

在使用此布局之前,我强烈建议您仔细考虑这是否是完成工作的最佳工具。更常见的情况是在 iOS 应用程序中不要呈现表格式数据。让我们保持事物的美观,仅在绝对必要时使用此布局。

安装

可以使用 Cocoapods 安装 KEZCollectionViewTableLayout。将以下声明添加到您的 Podfile 中

pod ‘KEZCollectionViewTableLayout’, ‘~> 1.0

如果您不使用 Cocoapods,也可以将文件从 Sources 目录复制到您的项目中。

使用

KEZCollectionViewTableLayout 是 UICollectionViewLayout 的直接子类。要使用它,请创建一个实例 KEZCollectionViewTableLayout 并将其作为布局参数传递给集合视图。

KEZCollectionViewTableLayout *layout = [[KEZCollectionViewTableLayout alloc] init];
UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:CGRectZero collectionViewLayout:layout];

如果您使用的是故事板或 nib 文件,您可以通过选择UICollectionView并更改其布局属性来更改所使用的布局类。

单元格大小调整

您可以通过设置 KEZCollectionViewTableLayout 实例上的 cellSize 属性来设置所有单元格的大小。

KEZCollectionViewTableLayout *layout = [[KEZCollectionViewTableLayout alloc] init];
layout.cellSize = CGSizeMake(200.0f, 44.0f);

类似于 UICollectionViewFlowLayout,KEZCollectionViewTableLayout 有一个从 UICollectionViewDelegate 继承的协议。它添加了一个方法以帮助确定单元格大小。

- (CGSize) collectionView:(UICollectionView *)collectionView layout:(KEZCollectionViewTableLayout *)layout sizeForCellAtIndexPath:(NSIndexPath *)indexPath;

如果您在代理中实现此方法,则将使用它而不是 cellSize 属性。

请注意,indexPath 的术语并不能很好地映射到 UITableView。在 NSIndexPath 中,section 是布局中代表行的部分,row 是该部分内的列。

限制单元格大小

KEZCollectionViewTableLayout 有几个属性可以帮助减少您要设置最小和最大单元格大小的代码复杂性。

KEZCollectionViewTableLayout *layout = [[KEZCollectionViewTableLayout alloc] init];
// This will not allow any cell to have a width or height less than 44 points
layout.minimumCellSize = CGSizeMake(44.0f, 44.0f);
// This will not allow any cell to have a width or height larger than 200 points
layout.maximumCellSize = CGSizeMake(200.0f, 200.0f);

这些限制仅在委托大小调整时使用。在您直接设置 cellSize 时不会使用它们。

头部大小调整

KEZCollectionViewTableLayout 有几个属性可以设置头部单元格的宽度和高度。

KEZCollectionViewTableLayout *layout = [[KEZCollectionViewTableLayout alloc] init];
// This will set the column headers to have a height of 100 points. The width will be determined by the widest cell.
layout.columnHeaderHeight = 100.0f;
// This will set the row headers to have a width of 100 points. The height of the row will be determined by the tallest cell
layout.rowHeaderWidth = 100.0f;

还有一个允许您调整头部单元格大小的委托方法。

- (CGSize) collectionView:(UICollectionView *)collectionView layout:(KEZCollectionViewTableLayout *)layout supplementaryViewOfKind:(NSString *)kind sizeAtIndexPath:(NSIndexPath *)indexPath;

kind的值可以是KEZCollectionViewTableLayoutSupplementaryViewColumnHeader或KEZCollectionViewTableLayoutSupplementaryViewRowHeader。当计算列标题单元格的高度时,将传入KEZCollectionViewTableLayoutSupplementaryViewColumnHeader(列标题的宽度将由列数据中最宽的单元格决定),在计算行标题单元格宽度时将传入KEZCollectionViewTableLayoutSupplementaryViewRowHeader(行标题的高度将由行数据中最高的单元格决定)。

indexPath将代表标题的位置。列标题始终具有0个部分,行标题始终位于第0行。这可能有点令人困惑,但目标是使标题类似于数据的映射。索引路径的每个部分代表数据中的一行,每个行索引是一个列。在样本项目中查看,如果这似乎不清楚。

限制标题大小

标题单元格将使用相同的minimumCellSize和maximumCellSize属性来限制其大小。

粘性标题

如果您需要标题始终可见,可以将stickyHeaders属性设置为YES。这将导致标题单元格随着collection view边界的更改而移动。

角落单元格

如果您既有行标题又有列标题,第一列将移到行标题的右侧,第一行将移到列标题的下方,在左上角留出空白空间。您可以通过注册具有decorationViewKind设置为KEZCollectionViewTableLayoutDecorationViewCornerCell的装饰视图来为它提供装饰视图。

KEZCollectionViewTableLayout *layout = [[KEZCollectionViewTableLayout alloc] init];
[layout registerClass:[MyCornerCell class] forDecorationViewOfKind:KEZCollectionViewTableLayoutDecorationViewCornerCell];

请注意,装饰单元格必须在初始化器或加载其时配置好所有视觉数据。有关装饰单元格的更多信息,请参阅UICollectionViewLayout文档

样本应用

样本应用包含使用KEZCollectionViewTableLayout的多个演示。打开它并四处看看。务必查看Storyboard中视图控制器和布局的用户定义运行时属性,以了解整个配置的故事。

样本应用还包含为布局编写的所有单元测试。

Bitdeli Badge