Question

我已经阅读了一些有关但不适用于我的主题...我尝试将渐变颜色应用于使用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作为蒙版应用于渐变图层。然后它揭示了渐变。

Answer 2

你应该设置shapeMask的fillColor和strokeColor，而不是图层。

将我的渐变设置为BezierPath的弧

2 个答案: