UICollectionView看起来像iOS日历应用程序的最佳方法

Question

我正在构建一个应用程序,我真的需要显示一个类似于iOS日历应用程序中的列表.我需要创建一个collectionView,我可以在其中扩展足以覆盖各自小时的单元格,如下所示:

我尝试了各种各样的东西,包括在Github的这个项目,我不明白如何在另一个项目中使用

除了这个项目,我还快速使用UITableViewController进行了探索不同的方法:

但我并没有真正得到我想要的地方.我需要在第一张图片中看到设计,并想知道是否有人能指出我正确的方向来实现这一目标？

非常感谢你的帮助!!

更新:

实际的单元格框架不应该代表一个小时的开始,在这个例子中是10:00吗？(而不是定制的分隔符)

更新

为什么层次结构如下所示:

这种定位似乎是"阻挡"细胞的触摸,并且该didSelectItemAtIndexPath方法不会被调用.这适用于比其他单元更靠后的单元格.

Answer 1

您确实应该使用UICollectionView自定义布局.只需提供supplementary views构建基础日常计划(每小时一个视图),然后使用它cells来放置您的事件.

子类化时UICollectionViewLayout,需要实现一些方法:

• collectionViewContentSize 应该返回一个等于小时数(24)的高度乘以代表一小时的补充视图的高度.
• prepareLayout做几乎一切.在该方法中,您将计算需要使用的每个layoutAttributes.通过获取事件的时间及其持续时间,您可以计算每个事件的帧.补充视图框(每个"小时"块)也非常简单,因为它们的高度是固定的(origin.y =固定高度乘以小时).
• layoutAttributesForElementsInRect:简单地遍历您之前准备的layoutAttributes并返回其所有帧与提供的帧相交的所有帧.

• layoutAttributesForItemAtIndexPath:查找并返回单元格的layoutAttributes匹配提供indexPath说.

• layoutAttributesForSupplementaryViewOfKind:atIndexPath查找并返回补充视图的layoutAttributes,数学提供的indexPath.

接下来,将该布局的实例提供给集合视图:

self.collectionView = [[UICollectionView alloc] initWithFrame:CGRectZero collectionViewLayout:myCustomLayout]

然后,您只需要通过UICollectionView的委托和dataSource为补充视图(也称为小时块)和单元格提供所需的视图.如果您需要UIViewController来提供与标准委托/ dataSource相关的更多信息,请随意在自定义布局中创建自定义委托!

注意:由于指示小时开始的行是单元格顶部边框下方的几个像素,因此您需要每次将事件移动相同的像素数.假设你每行上面有6个像素,每小时块的高度为60像素,那么如果在凌晨2点开始均匀,你将设置它origin.y = 2 * 60 + 6(2小时*60像素/小时+ 6像素填充).您还需要将最后一个单元格块调整为6像素更高,因为它下面不会有另一个单元格.

我建议您阅读有关创建自定义布局的官方文档.

为了帮助你:我做了一个快速的示例项目,因为制作自己的布局有时会很麻烦.去检查CalendarViewLayout课程,我添加了一些注释来解释我如何处理填充.这是它看起来像: