UIBezierPath圈动画失真

时间:2018-05-16 23:48:32

标签: swift animation swift4 geometry uibezierpath

所以,我对动画和BezierPaths都很陌生。这是我的代码。你能帮我弄清楚导致失真的原因吗?

    let circleLayer = CAShapeLayer()
    let radius: CGFloat = 100.0
    let beginPath = UIBezierPath(arcCenter: view.center, radius: 0, startAngle: CGFloat(0), endAngle:CGFloat(Double.pi * 2), clockwise: true)
    let endPath = UIBezierPath(arcCenter: view.center, radius: radius, startAngle: CGFloat(0), endAngle:CGFloat(Double.pi * 2), clockwise: true)

    circleLayer.fillColor = UIColor.red.cgColor
    circleLayer.path = beginPath.cgPath

    circleLayer.removeAllAnimations()

    let scaleAnimation = CABasicAnimation(keyPath: "path")
    scaleAnimation.fromValue = beginPath.cgPath
    scaleAnimation.toValue = endPath.cgPath

    let alphaAnimation = CABasicAnimation(keyPath: "opacity")
    alphaAnimation.fromValue = 1
    alphaAnimation.toValue = 0

    let animations = CAAnimationGroup()
    animations.duration = 2
    animations.repeatCount = .greatestFiniteMagnitude
    animations.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseOut)
    animations.animations = [scaleAnimation, alphaAnimation]

    circleLayer.add(animations, forKey: "animations")

    self.view.layer.addSublayer(circleLayer)

enter image description here

enter image description here

enter image description here

1 个答案:

答案 0 :(得分:2)

你的目标是让圈子从中心点成长?

使用弧动画时遇到的问题是起始路径和结束路径必须具有相同的点数。我的猜测是,如果半径为0,系统会将您的起始路径简化为单个点,甚至是空路径。

您可能希望使用起始半径0.01。

另一种选择是将图层的比例从0设置为1,并将图像的大小设置为所需的最终尺寸。