这是一个关于OC时间轴的简单实现,我认为重要的是思路。
感谢作者:Cyandev 的文章《iOS 实现时间线列表效果》给的思路。这里先附上Objective-C的代码实现,有时间再去试试Swift
先看一下效果:
再看一段主要的代码:
//根据cell判断cell中bottomLine的颜色,如果不是最后一个,则颜色和topLine颜色一样。
cell.buttomLine.backgroundColor = indexPath.row == (_dataArray.count-1) ? [UIColor grayColor] : cell.topLine.backgroundColor; self.topLine.backgroundColor = cell.topLine.backgroundColor; // cell.topLine.backgroundColor = indexPath.row == 0 ? [UIColor clearColor] : self.topLine.backgroundColor; //使创建的 topLine 视图背景颜色 等于 cell中 topLine 的背景颜色
self.topLine.backgroundColor = cell.topLine.backgroundColor; //获取cell中topLine 或者bottomLine 的 x 位置。
/** * 将像素point由point所在视图转换到目标视图view中,返回在目标视图view中的像素值 * (CGPoint)convertPoint:(CGPoint)point toView:(UIView *)view */ self.leadingSpaceOfLines = [cell convertPoint:cell.topLine.frame.origin toView:self.view].x; [self scrollViewDidScroll:tableView];
#pragma mark --important code--
//根据上下拉动,动态改变 topLine 和 bottomLine 的 y 轴坐标。
- (void)scrollViewDidScroll:(UIScrollView *)scrollView { _topLine.frame = CGRectMake(_leadingSpaceOfLines, 0, 3, -scrollView.contentOffset.y); CGFloat yOffSet = scrollView.frame.size.height - scrollView.contentSize.height + scrollView.contentOffset.y ; _bottomLine.frame = CGRectMake(_leadingSpaceOfLines, self.view.frame.size.height - yOffSet, 3, self.view.frame.size.height); }
这里是我的GitHub上的demo:TimeLine