Swift 中带有 UICollectionView 的时间线

Question

我正在尝试为我的应用编写时间线。我在草图上设计它是为了给你一个洞察力：

我不是 Swift 方面的专家，所以我真的不知道如何编写代码。我考虑过创建一个 UICollectionView，并使用 indexPath 来改变单元格的设计，如果它是偶数或奇数。

你怎么看？

Answer 1

如果我理解正确的话，你想知道这个设计是怎么做的吗？

你有两种方法来实现这样的设计：

第一个（最简单的方法）： 您需要的只是一个顶部带有时间线视图 (UICollectionView) 的 tableView，其中有 2 个自定义集合视图单元格，一个用于奇数，另一个用于偶数 tableview 将有 2 个单元格，一个用于带有图像的文本，另一个用于平面文本

如何渲染时间线：

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
    if (indexPath.row + 1) % 2 == 0 {
        return even cell
    } else {
        return odd cell
    }

如何在用户滚动时间轴时通过计算 indexPath 来检测偶数或奇数：

@IBOutlet weak var collectionViewTimeLine: UICollectionView!
func scrollViewDidScroll(_ scrollView: UIScrollView) {
    if let timeline = scrollView as? collectionViewTimeLine {
        // calculate and find selected indexPath
        // reload data
    }
}

第二种方式： 当您希望在用户滚动时间轴时平滑地为内容设置动画时使用这种方式

您需要 2 个 UICollectionView，第一个用于时间线，第二个用于内容 当用户滚动时间轴时，您滚动 collectionViewContent

@IBOutlet weak var collectionViewTimeLine: UICollectionView!
    func scrollViewDidScroll(_ scrollView: UIScrollView) {
        if let timeline = scrollView as? collectionViewTimeLine {
            // calculate and find selected indexPath
            // scroll collectionViewContent with selected indexPath
        }
    }