swift - CAShapeLayer shadowPath 动画。如何防止动画完成时的阴影填充?

标签 swift cashapelayer quartz-core caanimation

我正在创建一个随机的 UIBezierPath,将路径设置为 CAShapeLayer.path 属性,然后为 设置动画>CAShapeLayer 的描边是这样的:

    // Get a path
    let path = createBezierPath()

    // Shape layer properties
    let color = randomCGColor() // Color of path and shadow
    let lineWidth = CGFloat(arc4random_uniform(50) + 11) // Width of line and shadow radius
    shapeLayer.path = path.CGPath
    shapeLayer.lineJoin = kCALineJoinRound
    shapeLayer.lineCap = kCALineCapRound
    shapeLayer.strokeColor = color
    shapeLayer.lineWidth = lineWidth
    shapeLayer.fillColor = UIColor.clearColor().CGColor
    // Shape layer shadow properties
    shapeLayer.shadowPath = path.CGPath
    shapeLayer.shadowColor = color
    shapeLayer.shadowOffset = CGSizeZero
    shapeLayer.shadowRadius = lineWidth
    shapeLayer.shadowOpacity = 1.0

    // Add shape layer
    self.layer.addSublayer(shapeLayer)

    // Stroke path animation
    let pathAnimation: CABasicAnimation = CABasicAnimation(keyPath: "strokeEnd")
    pathAnimation.fromValue = 0.0
    pathAnimation.toValue = 1.0

    // Shadow path animation
    let shadowPathAnimation: CABasicAnimation = CABasicAnimation(keyPath: "shadowPath")
    shadowPathAnimation.fromValue = 0.0
    shadowPathAnimation.toValue = path.CGPath

    // Animation group
    let animationGroup = CAAnimationGroup()
    animationGroup.duration = 5.0
    animationGroup.animations = [pathAnimation, shadowPathAnimation]

    shapeLayer.addAnimation(animationGroup, forKey: "allMyAnimations")

问题是,一旦动画完成,阴影就会应用于整个形状。我希望阴影仅应用于 CAShapeLayer 的笔触。 如何防止动画完成后阴影应用于整个形状?

这是我所指问题的示例:

enter image description here

最佳答案

this answer 的帮助下,我能够解决问题,通过为阴影创建一个 CALayer 并将 CAShapeLayer 添加为子层:

    let path = createBezierPath() // Get a path
    let color = randomCGColor() // Color of path and shadow
    let lineWidth = CGFloat(arc4random_uniform(50) + 11) // Width of line and shadow radius

    // Shape layer properties
    shapeLayer.path = path.CGPath
    shapeLayer.lineJoin = kCALineJoinRound
    shapeLayer.lineCap = kCALineCapRound
    shapeLayer.strokeColor = color
    shapeLayer.lineWidth = lineWidth
    shapeLayer.fillColor = UIColor.clearColor().CGColor

    // Create shadow layer
    let shadowLayer = CALayer()
    shadowLayer.frame = self.bounds
    shadowLayer.shadowColor = color
    shadowLayer.shadowOffset = CGSizeZero
    shadowLayer.shadowRadius = lineWidth
    shadowLayer.shadowOpacity = 1.0
    shadowLayer.backgroundColor = UIColor.clearColor().CGColor
    shadowLayer.insertSublayer(shapeLayer, atIndex: 0)

    // Add shadow layer
    self.layer.addSublayer(shadowLayer)

    // Stroke path animation
    let pathAnimation: CABasicAnimation = CABasicAnimation(keyPath: "strokeEnd")
    pathAnimation.fromValue = 0.0
    pathAnimation.toValue = 1.0
    pathAnimation.duration = 5.0
    shapeLayer.addAnimation(pathAnimation, forKey: "strokeAnimation")

    // Shadow path animation
    let shadowPathAnimation: CABasicAnimation = CABasicAnimation(keyPath: "shadowPath")
    shadowPathAnimation.fromValue = 0.0
    shadowPathAnimation.toValue = path.CGPath
    shadowLayer.addAnimation(shadowPathAnimation, forKey: "shadowAnimation")

结果示例:

enter image description here

关于swift - CAShapeLayer shadowPath 动画。如何防止动画完成时的阴影填充?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38175253/

相关文章:

ios - 从 Swift 函数中的异步调用返回数据

ios - 在 Swift 中检测 UIImageView 触摸

ios - 如何使用解析正确地发出云代码请求?

ios - 让 XCUIElement 为自动化 UITest 执行 3D 触摸?

ios - 缩放时如何在 UIView 周围保持一致的 2px 边框?

swift - 如何从我的 UIView 中删除 CAShapeLayer 和 CABasicAnimation?

ios - 在可缩放的 UIView 中保留 CAShapeLayer 的 lineWidth

ios - 自动布局约束和 CALayer 问题

ios - 当 UIScrollView 滚动时动画对象

ios - 在 UIView 上应用渐变不起作用