在两个循环UIBezierPath之间进行动画时出现奇怪的行为

问题
我正在创造爆炸效果。 我正在使用多个CAShapeLayer并为每个图层创建一个UIBezierPath 。 当视图初始化时,所有图层都有一个宽度为0的路径。 当一个动作被触发时,这些环动画到一个更大的路径。

如下面的演示所示,每个图层的右侧边缘比每个圆形图层的其余部分的动画更慢。

演示
视频

绘制图层:

func draw(inView view: UIView) -> CAShapeLayer {

    let shapeLayer = CAShapeLayer()

    // size.width defaults to 0
    let circlePath = UIBezierPath(arcCenter: view.center, radius: size.width / 2, startAngle: 0, endAngle: CGFloat(360.0).toRadians(), clockwise: true)

    shapeLayer.path = circlePath.CGPath
    shapeLayer.frame = view.frame

    return shapeLayer
}

更新图层

func updateAnimated(updatedOpacity: CGFloat, updatedSize: CGSize, duration: CGFloat) {

    let updatePath = UIBezierPath(arcCenter: view.center, radius: updatedSize.width / 2,
                                  startAngle: 0, endAngle: CGFloat(360).toRadians(), clockwise: true)

    let pathAnimation = CABasicAnimation(keyPath: "path")
    pathAnimation.fromValue = layer.path // the current path (initially with width 0)
    pathAnimation.toValue = updatePath.CGPath


    let opacityAnimation = CABasicAnimation(keyPath: "opacity")
    opacityAnimation.fromValue = self.opacity
    opacityAnimation.toValue = updatedOpacity


    let animationGroup = CAAnimationGroup()
    animationGroup.animations = [pathAnimation, opacityAnimation]
    animationGroup.duration = Double(duration)
    animationGroup.fillMode = kCAFillModeForwards
    animationGroup.removedOnCompletion = false

    layer.addAnimation(animationGroup, forKey: "shape_update")

    ... update variables ...

}

避免以0的路径宽度开始。从0开始缩放非常困难,并且微小的浮点错误会放大。 非常接近零的值在浮点上不是非常连续的(嗯......我想实际上有点像真正的宇宙)。 尝试从较大的值开始,看看您可以安全地接近零。

链接地址: http://www.djcxy.com/p/35737.html

上一篇: Strange behaviour when animating between two circular UIBezierPaths

下一篇: SHA256 Hash results different across Android & iOS for Big numbers