ios - 使用 CGPath 绘制一条多色线

Question

下面您会看到每次调用 drawMulticolorLine 时都会绘制一条多色线的代码。

    void drawMulticolorLine
    {
        CGContextBeginPath(secondaryContext);
        CGContextMoveToPoint(secondaryContext, h, v);
        for( int i = 1; i < lineWidth; ++ )
        {
            SetStrokeColor(i);
            CGContextAddLineToPoint(secondaryContext, h+i, v);
            CGContextDrawPath(secondaryContext, kCGPathFillStroke);
            CGContextMoveToPoint(secondaryContext, h+i, v);
        }
    }

    //a function that sets a different color for each i
    void SetStrokeColor(int i)
    {
        CGContextSetRGBStrokeColor(secondaryContext,…
    }

上面的代码有效，但如果我在现实生活中使用它，它就是一个性能 killer 。所以我尝试用下面的代码提高绘图性能。

    void drawMulticolorLine
    {
        CGContextBeginPath(secondaryContext);
        CGContextMoveToPoint(secondaryContext, h, v);
        for( int i = 1; i < lineWidth; ++ )
        {
            SetStrokeColor(i);
            CGContextAddLineToPoint(secondaryContext, h+i, v);
        }
        CGContextDrawPath(secondaryContext, kCGPathFillStroke);
    }

    //a function that sets a different color for each i
    void SetStrokeColor(int i)
    {
        CGContextSetRGBStrokeColor(secondaryContext,…
    }

如果线条颜色始终相同，则此代码性能良好。

我现在的问题是，一旦调用 CGContextDrawPath，整条线就会以最后一个 CGContextSetRGBStrokeColor 的颜色绘制。

有没有办法让路径保持添加的每个线段的颜色？

非常感谢任何帮助。

干杯，

Answer 1

最近在 Playground 玩，所以共享源代码。

extension CGFloat {
    static func random() -> CGFloat {
        return CGFloat(arc4random()) / CGFloat(UInt32.max)
    }
}

extension UIColor {
    static func random() -> UIColor {
        return UIColor(red:   .random(),
                       green: .random(),
                       blue:  .random(),
                       alpha: 1.0)
    }
}
let copy: CGPath = ...
let image = UIGraphicsImageRenderer(size: copy.boundingBoxOfPath.size).image { context in

    context.cgContext.setLineWidth(2)

    copy.applyWithBlock { element in
        switch element.pointee.type {
        case .moveToPoint:
            context.cgContext.move(to: element.pointee.points[0])
        case .addLineToPoint:
            context.cgContext.addLine(to: element.pointee.points[0])
            context.cgContext.setStrokeColor(UIColor.random().cgColor)
            context.cgContext.strokePath()
            context.cgContext.move(to: element.pointee.points[0])
        case .addQuadCurveToPoint:
            let controlPoint = element.pointee.points[0]
            let point = element.pointee.points[1]
            context.cgContext.addCurve(to: point, control1: controlPoint, control2: controlPoint)
            context.cgContext.setStrokeColor(UIColor.random().cgColor)
            context.cgContext.strokePath()
            context.cgContext.move(to: point)
        case .addCurveToPoint:
            let controlPoint1 = element.pointee.points[0]
            let controlPoint2 = element.pointee.points[1]
            let point = element.pointee.points[2]
            context.cgContext.addCurve(to: point, control1: controlPoint1, control2: controlPoint2)
            context.cgContext.setStrokeColor(UIColor.random().cgColor)
            context.cgContext.strokePath()
            context.cgContext.move(to: point)
        case .closeSubpath:
            context.cgContext.setStrokeColor(UIColor.random().cgColor)
            context.cgContext.strokePath()
        }
    }
}