如何在iOS中创建可缩放的时间轴？

Question

我想在我的iOS应用程序中创建一个可缩放的时间轴,用于一种todo-list.放大将显示日期和小时,缩小将触发折叠日或缩小到几个月.会有滚动功能.

举个例子,我希望它能像这样工作:http://almende.github.com/chap-links-library/js/timeline/doc/

什么样的基本视图是适当的起点,请记住所需的内存应该尽可能低？UITableView,UIScrollView或其他东西可以用于此吗？

Answer 1

该UICollectionView/ UITableView不会起作用,因为细胞几乎都是相同的宽度/高度.最重要的是,细胞在每个细胞之间总是具有相同的间距.因此,它能够轻松计算索引范围,并根据索引查询dataSource所需的单元格.

另一方面,时间轴视图与这些控件有很大不同.细胞之间的间隔是不同的,细胞有时彼此重叠.如果您有按位置排序的数据源,则控件仍然需要猜测从哪里开始查找范围.因此,找到正确的指数范围将会更加昂贵 - 您只需要找到正确的算法,以便在更短的时间内确定这一点.

你将不得不通过子类化来构建自己的控件UIScrollView.你根本不应该搞砸drawRect.由UITableViewand 使用的一个重要概念UICollectionView是将细胞出列.Apple的PhotoScroller的iOS 5版本通过分页演示了这个概念(iOS 6版本取代了自定义分页UIPageViewController).您必须下载旧文档才能获取旧的示例代码.

我目前正在构建一个时间轴视图,我将在某个时候开源.它有点基于UITableView并且在水平或垂直方向上工作.它就像那样出列的细胞UITableView.我不是专注于标签或缩放,而是在单元格之间具有不一致的间距的概念.为了给你一个良好的开端,这里是我确定的dataSource方法:

- (NSInteger)numberOfCellsInTimelineView:(TimelineView *)timelineView;
- (CGRect)timelineView:(TimelineView *)timelineView cellFrameForIndex:(NSInteger)index;
- (TimelineViewCell *)timelineView:(TimelineView *)timelineView cellForIndex:(NSInteger)index;

其中两个调用UITableView与之相同,但它有一个叫做的新调用cellFrameForIndex.这个调用的重要之处在于,TimelineView可以猜测索引并查找单元格的框架,并查看它在可见边界中的位置.如果它猜测可见边界内的一个单元格,它可以简单地向前和向后迭代,直到找到边缘.

目前我正在使用的算法round(count * (CGRectGetMidX(timelineView.bounds) / timelineView.contentSize.width))(水平方向).基本上它的作用是获取UIScrollView的可见边界的中点,并获得滚动的百分比.然后它乘以单元格数.这工作相当好.当随机间隔测试随机数据集的100,000个记录时,调用cellFrameForIndex范围从8到150.我可以用这个来拉动52-60 FPS.我还在努力,并试图找到一种更好/更快的方法来确定索引范围.我试图将其保持在可见细胞计数+10(最大)迭代.

如果你有时间等待,我会更新我的答案,在我完成时包含一个指向我的GitHub项目的链接.这可能是几天到一周.我可以添加缩放.但你必须分叉它并添加标签和你想要的任何其他东西.

编辑:

这是我的Github项目:https://github.com/lukescott/TimelineView