将图层蒙版设置为UIBezierPath superview

时间:2017-08-17 11:08:27

标签: swift calayer mask uibezierpath caanimation

所以我有一个用UIBezierPath绘制的圆圈,我需要将superview设置为与我的圆圈相同,这里是我的代码:

   override func draw(_ rect: CGRect) {
    let circlePath = UIBezierPath(arcCenter: CGPoint(x: rect.midX, y: rect.midY), radius: circleRadius, startAngle: 0.0, endAngle:CGFloat(Double.pi * 2), clockwise: true)
    let strokeColorAnimation = CABasicAnimation(keyPath: "strokeColor")
    let strokeEndAnimation = CABasicAnimation(keyPath: "strokeEnd")

    shapeLayer.path = circlePath.cgPath
    shapeLayer.lineWidth = 0.3 * circleRadius
    shapeLayer.fillColor = UIColor.clear.cgColor

    if oldColor == nil { oldColor = newColor }
    if oldStrokeEnd == nil { oldStrokeEnd = 0.01 * currentCGFloatProximity }

    strokeColorAnimation.fromValue = oldColor!.cgColor
    strokeColorAnimation.toValue = newColor.cgColor
    strokeColorAnimation.duration = 0.3
    strokeColorAnimation.isRemovedOnCompletion = false
    strokeColorAnimation.fillMode = kCAFillModeForwards

    strokeEndAnimation.fromValue = oldStrokeEnd
    strokeEndAnimation.toValue = 0.01 * currentCGFloatProximity
    strokeEndAnimation.duration = 0.3
    strokeEndAnimation.isRemovedOnCompletion = false
    strokeEndAnimation.fillMode = kCAFillModeForwards

    shapeLayer.add(strokeColorAnimation, forKey: strokeColorAnimation.keyPath)
    shapeLayer.add(strokeEndAnimation, forKey: strokeEndAnimation.keyPath)

    layer.mask = shapeLayer


   // layer.addSublayer(shapeLayer)


    oldColor = newColor
    oldStrokeEnd = 0.01 * currentCGFloatProximity
}

当我添加到superview的图层蒙版时,我的shapeLayer得到了这个结果,它的黑色并没有改变它的颜色: enter image description here

    //layer.mask = shapeLayer

    layer.addSublayer(shapeLayer)

当我将子图层添加到superview的图层时,我得到以下结果: enter image description here

我想要的只是第一张图片中的结果,但带有彩色圆圈。希望得到帮助。抱歉我的英文。

1 个答案:

答案 0 :(得分:1)

好的,我通过添加新的形状图层来修复它,但也许有人有更好的解决方案。 现在我有了这段代码:

override func draw(_ rect: CGRect) {
    let circlePath = UIBezierPath(arcCenter: CGPoint(x: rect.midX, y: rect.midY), radius: circleRadius, startAngle: 0.0, endAngle:CGFloat(Double.pi * 2), clockwise: true)
    let strokeColorAnimation = CABasicAnimation(keyPath: "strokeColor")
    let strokeEndAnimation = CABasicAnimation(keyPath: "strokeEnd")

    circleLayer.path = circlePath.cgPath
    circleLayer.lineWidth = 0.3 * circleRadius
    circleLayer.fillColor = UIColor.clear.cgColor

    backgroundLayer.path = circlePath.cgPath
    backgroundLayer.lineWidth = 0.3 * circleRadius
    backgroundLayer.strokeColor = UIColor.black.cgColor
    backgroundLayer.fillColor = UIColor.clear.cgColor


    if oldColor == nil { oldColor = newColor }
    if oldStrokeEnd == nil { oldStrokeEnd = 0.01 * currentCGFloatProximity }

    strokeColorAnimation.fromValue = oldColor!.cgColor
    strokeColorAnimation.toValue = newColor.cgColor
    strokeColorAnimation.duration = 0.3
    strokeColorAnimation.isRemovedOnCompletion = false
    strokeColorAnimation.fillMode = kCAFillModeForwards

    strokeEndAnimation.fromValue = oldStrokeEnd
    strokeEndAnimation.toValue = 0.01 * currentCGFloatProximity
    strokeEndAnimation.duration = 0.3
    strokeEndAnimation.isRemovedOnCompletion = false
    strokeEndAnimation.fillMode = kCAFillModeForwards

    circleLayer.add(strokeColorAnimation, forKey: strokeColorAnimation.keyPath)
    circleLayer.add(strokeEndAnimation, forKey: strokeEndAnimation.keyPath)

    layer.mask = backgroundLayer

    layer.addSublayer(circleLayer)
    oldColor = newColor
    oldStrokeEnd = 0.01 * currentCGFloatProximity
}

Result