ios - 将我的渐变设置为 BezierPath 的弧线

Question

这个问题已经有答案了:

How to draw a circle path with color gradient stroke (4 个回答)

已关闭 6 年前。

我读过一些主题，但不适用于我...我尝试将渐变颜色应用于用 UIBezierPath 绘制的弧线。问题是我的渐变填充了整个圆而不仅仅是圆环。

func layerWith(size: CGSize, color: UIColor) -> CALayer {
    let layer: CAShapeLayer = CAShapeLayer()
    var path: UIBezierPath = UIBezierPath()
    let lineWidth: CGFloat = 2

    layer.backgroundColor = nil
    layer.path = path.cgPath
    layer.frame = CGRect(x: 0, y: 0, width: size.width, height: size.height)


    switch self {
    case .ring:
        path.addArc(withCenter: CGPoint(x: size.width / 2, y: size.height / 2),
                    radius: size.width / 2,
                    startAngle: 0,
                    endAngle: CGFloat(2 * M_PI),
                    clockwise: false);

        layer.fillColor =  UIColor.clear.cgColor
        layer.strokeColor = color.cgColor
        layer.lineWidth = lineWidth

        let colorGradStart  = UIColor(red: 0/255, green: 209/255, blue: 192/255, alpha: 1.0)
        let colorGradEnd = UIColor(red: 00/255, green: 99/255, blue: 91/255, alpha: 1.0)

        let gradient = CAGradientLayer()
        gradient.frame = path.bounds
        gradient.colors = [colorGradStart.cgColor, colorGradEnd.cgColor]

        let shapeMask = CAShapeLayer()
        shapeMask.path = path.cgPath
        gradient.mask = shapeMask


        layer.addSublayer(gradient)
    }
    return layer
}

所以这段代码，将渐变应用于所有填充的表单，我只需要弧线。

Answer 1

一种方法是将 CAShapeLayer 作为 mask 应用到渐变层。然后它会显示渐变。