按 y 坐标切割贝塞尔路径

Question

我有具体的UIBezierPath，例子

         override func drawInContext(ctx: CGContext) {
    if let slider = slider {
        // Clip
        let rect = bounds.insetBy(dx: bounds.width / 10, dy: bounds.height / 2.2)
        let path = UIBezierPath(roundedRect: rect, cornerRadius: 5)
        let circleRadius : CGFloat = 10
        let xCoordInset = bounds.width / 10
        let circlePath = UIBezierPath(ovalInRect: CGRectMake(xCoordInset , rect.midY - circleRadius, circleRadius * 2, circleRadius * 2))
        let circlePath1 = UIBezierPath(ovalInRect: CGRectMake(bounds.width - xCoordInset - circleRadius, rect.midY - circleRadius, circleRadius * 2, circleRadius * 2))
        let circlePath2 = UIBezierPath(ovalInRect: CGRectMake(rect.midX - circleRadius, rect.midY - circleRadius, circleRadius * 2, circleRadius * 2))

        path.appendPath(circlePath)
        path.appendPath(circlePath1)
        path.appendPath(circlePath2)

        CGContextAddPath(ctx, path.CGPath)

        CGContextSetFillColorWithColor(ctx, slider.trackTintColor.CGColor)
        CGContextFillPath(ctx)

    }
}

我想用灰色填充此 bezierPath 的一半，用红色填充另一半。所以我想我需要有 2 个相同的层，但是其中 1 个应该被 y 坐标切割，你能建议一些可用的方法来完成这个操作吗？

Answer 1

在填充灰色之前裁剪到切割线上方的矩形。然后裁剪到裁剪线下方的矩形，用红色填充。

    override func drawInContext(ctx: CGContext) {
        if let slider = slider {
            // Clip
            let rect = bounds.insetBy(dx: bounds.width / 10, dy: bounds.height / 2.2)
            let path = UIBezierPath(roundedRect: rect, cornerRadius: 5)
            let circleRadius : CGFloat = 10
            let xCoordInset = bounds.width / 10
            let circlePath = UIBezierPath(ovalInRect: CGRectMake(xCoordInset , rect.midY - circleRadius, circleRadius * 2, circleRadius * 2))
            let circlePath1 = UIBezierPath(ovalInRect: CGRectMake(bounds.width - xCoordInset - circleRadius, rect.midY - circleRadius, circleRadius * 2, circleRadius * 2))
            let circlePath2 = UIBezierPath(ovalInRect: CGRectMake(rect.midX - circleRadius, rect.midY - circleRadius, circleRadius * 2, circleRadius * 2))

            path.appendPath(circlePath)
            path.appendPath(circlePath1)
            path.appendPath(circlePath2)

            let yCut = bounds.midY // or whatever

            CGContextSaveGState(ctx); do {
                CGContextClipToRect(ctx, CGRectMake(bounds.minX, bounds.minY, bounds.width, yCut - bounds.minY))
                CGContextAddPath(ctx, path.CGPath)
                CGContextSetFillColorWithColor(ctx, slider.trackTintColor.CGColor)
                CGContextFillPath(ctx)
            }; CGContextRestoreGState(ctx)

            CGContextSaveGState(ctx); do {
                CGContextClipToRect(ctx, CGRectMake(bounds.minX, yCut, bounds.width, bounds.maxY - yCut))
                CGContextAddPath(ctx, path.CGPath)
                CGContextSetFillColorWithColor(ctx, slider.progressTintColor.CGColor)
                CGContextFillPath(ctx)
            }; CGContextRestoreGState(ctx)

        }
    }

按 y 坐标切割贝塞尔路径

Cut Bezier Path by y coordinate

core-graphics

ios

uibezierpath

swift