这几天我一直在尝试制作这个动画。我正在尝试为蒙版的大小设置动画,基本上是取一个大圆圈(蒙版)并缩小它。
@IBOutlet weak var myView: UIView!
override func viewDidLoad() {
super.viewDidLoad()
}
override func viewDidAppear(_ animated: Bool) {
super.viewDidAppear(animated)
animateMask()
}
func presentMaskScreenWithAnimation () {
//Setup Mask Layer
let bounds = myView.bounds
let maskLayer = CAShapeLayer()
maskLayer.frame = bounds
maskLayer.fillColor = UIColor.brown.cgColor
//CropCircle Out of mask Layer
let initialCircle = CGRect(x: 10, y: 10, width: 300, height: 300)
let path = UIBezierPath(roundedRect: initialCircle, cornerRadius: initialCircle.size.width/2)
path.append(UIBezierPath(rect: bounds))
maskLayer.path = path.cgPath
maskLayer.fillRule = kCAFillRuleEvenOdd
myView.layer.mask = maskLayer
//Define new circle path
let circlePath2 = CGRect(x: 50, y: 50, width: 100, height: 100)
let path2 = UIBezierPath(roundedRect: circlePath2, cornerRadius: circlePath2.size.width/2)
//Create animation
let anim = CABasicAnimation(keyPath: "path")
anim.fromValue = path.cgPath
anim.toValue = path2.cgPath
anim.duration = 3.0
anim.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
maskLayer.add(anim, forKey: nil)
}
这段代码设置了 mask 并开始对其进行动画处理,但是它反转了整个 maskLayer,我试图只对圆的路径进行动画处理,Large -> Small
最佳答案
在 let path2 = UIBezierPath(roundedRect: circlePath2, cornerRadius: circlePath2.size.width/2)
之后添加 path2.append(UIBezierPath(rect: bounds))
。另外不要忘记在最后执行 maskLayer.path = path2.cgPath
,如果您希望收缩蒙版在动画后保留。
关于ios - CALayer 圆形蒙版动画不正确的行为 + Swift,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40796849/