UICollectionView - 在单元格之间绘制一条线

Question

如何在跨越空格的UICollectionView中的单元格之间绘制线条？ 预期的输出是这样的。：

我所做的最好的是在每个单元格中添加线条。如何通过空格连接线？

Answer 1

我可以通过以下代码实现这一点，也可能有不同的方法。

好的，我正在使用自定义UIView创建自定义frame并盲目地提供frame，您可以根据相邻的单元格进行计算。

    let cell1 = collectionView.cellForItemAtIndexPath(NSIndexPath(forRow: 0, inSection: 0))
    let myView = UIView.init(frame: CGRectMake((cell1?.frame.origin.x)!, ((cell1?.frame.origin.y)! + 50.0), (cell1?.frame.size.width)!*4, 10))
    myView.backgroundColor = UIColor.blueColor()
    collectionView.addSubview(myView)
    collectionView.bringSubviewToFront(myView)

这将绘制一行height 10.0。如果这有助于你，请告诉我。

Answer 2

我做了一个扩展，你可以像这样使用：

collectionView.drawLineFrom(indexPathA, to: indexPathB, color: UIColor.greenColor())

这是扩展名：

extension UICollectionView {

    func drawLineFrom(
        from: NSIndexPath,
        to: NSIndexPath,
        lineWidth: CGFloat = 2,
        strokeColor: UIColor = UIColor.blueColor()
    ) {
        guard
            let fromPoint = cellForItemAtIndexPath(from)?.center,
            let toPoint = cellForItemAtIndexPath(to)?.center
        else {
            return
        }

        let path = UIBezierPath()

        path.moveToPoint(convertPoint(fromPoint, toView: self))
        path.addLineToPoint(convertPoint(toPoint, toView: self))

        let layer = CAShapeLayer()

        layer.path = path.CGPath
        layer.lineWidth = lineWidth
        layer.strokeColor = strokeColor.CGColor

        self.layer.addSublayer(layer)
    }
}

结果如下：