通过transform.scale属性对CAShapeLayer的路径进行动画处理

时间:2018-11-05 18:24:51

标签: swift cashapelayer cgpath

我正在尝试设置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

这是结果:

enter image description here

红色圆圈是我试图在其位置的中心进行缩放动画而没有任何平移的动画。此圈子设置为CGPathCAShapeLayer

问题很明显–我的CAShapeLayer具有蓝色背景的动画效果,但是路径却没有。

我错过了什么吗?这是它的工作方式吗?也许应该以不同的方式来制作动画?

1 个答案:

答案 0 :(得分: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)

希望这就是您所需要的。