Question

我想给一个圆做动画。圆半径应从0增长到100。我使用transform.scale动画进行了尝试。但是，当然不可能缩放半径为0的圆。当我将圆的半径设置为1时，该圆是可见的，尽管它不应位于动画的开始处。最小的例子：

let circleShape = CAShapeLayer()

let circlePath = UIBezierPath(arcCenter: .zero, radius: 0, startAngle: CGFloat(0), endAngle: CGFloat(Double.pi*2), clockwise: true)

circleShape.path = circlePath.cgPath
circleShape.fillColor = UIColor.brown.cgColor
let circleAnimation = CABasicAnimation(keyPath: "transform.scale")

circleAnimation.fromValue = 0
circleAnimation.toValue = 100
circleAnimation.duration = 1.9
circleAnimation.beginTime = CACurrentMediaTime() + 1.5
circleShape.add(circleAnimation, forKey: nil)

动画结束时，半径应保持新值。

编辑：感谢@Rob mayoff

最终代码：

let circleShape = CAShapeLayer()

let circlePath = UIBezierPath(arcCenter: .zero, radius: 400, startAngle: CGFloat(0), endAngle: CGFloat(Double.pi*2), clockwise: true)

circleShape.path = circlePath.cgPath
circleShape.fillColor = UIColor.brown.cgColor
let circleAnimation = CABasicAnimation(keyPath: "transform.scale")

circleAnimation.fromValue = 0.0000001
circleAnimation.toValue = 1
circleAnimation.duration = 1.9
circleAnimation.beginTime = CACurrentMediaTime() + 1.5
circleShape.add(circleAnimation, forKey: nil)
circleAnimation.fillMode = .backwards

Answer 1

可能您想做的是将circlePath的半径设置为最终半径：

let circlePath = UIBezierPath(arcCenter: .zero, radius: 0, startAngle: CGFloat(0), endAngle: CGFloat(Double.pi*2), clockwise: true)
circlePath.clone()

然后从接近零的数字动画到1.0：

circleAnimation.fromValue = 0.0001
circleAnimation.toValue = 1.0

如果您想让动画在未来开始（通过设置beginTime），那么您可能还希望设置填充模式，以便将fromValue应用于图层直到动画开始：

circleAnimation.fillMode = .backwards

Answer 2

您应该使用大于0的半径。然后可以使用circleShape.transform = CATransform3DMakeScale（0.0，0.0，0.0）进行缩放。在添加图层之前。然后可以开始动画：

        let circleShape = CAShapeLayer()
    let center =  CGPoint(x: view.frame.width / 2, y: view.frame.height / 2)
    let circlePath = UIBezierPath(arcCenter: center, radius: 100.0, startAngle: CGFloat(0), endAngle: CGFloat(Double.pi*2), clockwise: true)
    circleShape.transform = CATransform3DMakeScale(0.0, 0.0, 0.0)

    circleShape.path = circlePath.cgPath
    circleShape.fillColor = UIColor.brown.cgColor
    let circleAnimation = CABasicAnimation(keyPath: "transform.scale")

    circleAnimation.fromValue = 0
    circleAnimation.toValue = 1
    circleAnimation.duration = 5.9
    circleAnimation.beginTime = CACurrentMediaTime() + 1.5
    circleShape.add(circleAnimation, forKey: nil)

    view.layer.addSublayer(circleShape)

使用CABasicAnimation将半径从0调整为100

2 个答案: