通过 transform.scale 属性为 CAShapeLayer 的路径设置动画

Question

我正在尝试为具有圆形路径（与游乐场兼容）的 CAShapeLayer 的比例设置动画：

import UIKit
import PlaygroundSupport

let view = UIView(frame: CGRect(origin: .zero, size: CGSize(width: 200, height: 200)))
view.backgroundColor = .white

let animation = CABasicAnimation(keyPath: "transform.scale")
animation.duration = 1
animation.fromValue = 0
animation.toValue = 1
animation.autoreverses = true
animation.repeatCount = .greatestFiniteMagnitude

let frame = CGRect(origin: CGPoint(x: 40, y: 40), size: CGSize(width: 30, height: 30))
let path = CGPath(ellipseIn: frame, transform: nil)

let layer = CAShapeLayer()
layer.frame = frame
layer.path = path
layer.backgroundColor = UIColor.blue.cgColor
layer.fillColor = UIColor.red.cgColor

view.layer.addSublayer(layer)
layer.add(animation, forKey: nil)

PlaygroundPage.current.liveView = view

结果如下：

红色圆圈是我试图在其位置的中心使用缩放动画制作动画的图形，并且没有任何平移。这个圈子设置为CGPath到CAShapeLayer。

问题很明显——我的CAShapeLayer 的蓝色背景颜色如预期的那样动画，但路径——不是。

我错过了什么，或者这就是它的工作方式？也许这个动画应该以不同的方式完成？

Answer 1

如果我的理解是正确的，你需要的是一个边界而不是框架。

let frame = CGRect(origin: CGPoint(x: 40, y: 40), size: CGSize(width: 30, height: 30))

应该是：

let bounds = CGRect(origin: CGPoint(x: 0, y: 0), size: CGSize(width: 30, height: 30))
let path = CGPath(ellipseIn: bounds, transform: nil)

希望这是你需要的。