ios - 创建带有透明孔的 CAGradient 图层？

Question

目前我是这样做的:

final class BorderedButton: BottomNavigationButton {

private let gradient = CAGradientLayer()
private let shapeLayer = CAShapeLayer()

override func layoutSubviews() {
    super.layoutSubviews()

    let radius = bounds.size.height / 2
    let outside = UIBezierPath(roundedRect: CGRect(x: 0.0, y: 0.0, width: bounds.width, height: bounds.height), cornerRadius: radius)
    let inside = UIBezierPath(roundedRect: CGRect(x: 3.0, y: 3.0, width: bounds.width - 6, height: bounds.height - 6), cornerRadius: radius - 3)
    outside.append(inside)
    outside.usesEvenOddFillRule = true
    shapeLayer.path = outside.cgPath
}

init(color: UIColor?) {
    super.init(frame: .zero)

    let isGradient = color == nil

    shapeLayer.fillRule = kCAFillRuleEvenOdd
    shapeLayer.fillColor = UIColor.red.cgColor
    layer.insertSublayer(shapeLayer, at: 0)
    //gradient part
    gradient.colors = isGradient ? [Constants.gradientStart, Constants.gradientEnd] : [color!.cgColor, color!.cgColor]
    gradient.startPoint = CGPoint(x: 0.2, y: 0.5)
    gradient.endPoint = CGPoint(x: 1, y: 1)
}
}

如何将渐变应用于我的代码？

Answer 1

不要将 CAShapeLayer 添加到 View 的 layer，而是将其设置为 CAGradientLayer 的 mask >。也不要忘记设置渐变层的边界。

我必须进行一些修改才能让它在 Playground 上运行，但这对我有用:

let gradientStart = UIColor.orange
let gradientEnd = UIColor.blue

final class BorderedButton: UIButton {

    private let gradient = CAGradientLayer()
    private let shapeLayer = CAShapeLayer()

    override func layoutSubviews() {
        super.layoutSubviews()

        let radius = bounds.size.height / 2
        let outside = UIBezierPath(roundedRect: CGRect(x: 0.0, y: 0.0, width: bounds.width, height: bounds.height), cornerRadius: radius)
        let inside = UIBezierPath(roundedRect: CGRect(x: 3.0, y: 3.0, width: bounds.width - 6, height: bounds.height - 6), cornerRadius: radius - 3)
        outside.append(inside)
        outside.usesEvenOddFillRule = true
        shapeLayer.path = outside.cgPath
        gradient.frame = CGRect(x: 0, y: 0, width: bounds.size.width, height: bounds.size.height)
    }

    init(color: UIColor?, frame: CGRect = .zero) {
        super.init(frame: frame)

        let isGradient = color == nil

        shapeLayer.fillRule = kCAFillRuleEvenOdd

        //gradient part
        gradient.colors = isGradient ? [gradientStart.cgColor, gradientEnd.cgColor] : [color!.cgColor, color!.cgColor]
        gradient.startPoint = CGPoint(x: 0.2, y: 0.5)
        gradient.endPoint = CGPoint(x: 1, y: 1)

        gradient.mask = shapeLayer

        layer.addSublayer(gradient)
    }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
}