动画 2 个 imageViews 的位置切换

Posted 2023-03-13

【中文标题】动画 2 个 imageViews 的位置切换

【英文标题】：animate the position switching of 2 imageViews

【发布时间】：2017-06-12 23:25:21

【问题描述】：

我们正在尝试为沿 z 访问的 2 个 imageview 视图的位置切换设置动画。 2个imageViews是屏幕的2个 到目前为止，我已经尝试使用 CAAnimationGroup 进行位置和旋转，但它只显示其中一张图像，并且位置和旋转似乎已关闭。代码是这样的：

 @IBOutlet weak var meMatchImageView: UIImageView!
  @IBOutlet weak var theyMatchImageView: UIImageView!

 override func viewDidAppear(_ animated: Bool) 
    super.viewDidAppear(true)

    let groupAnimation = CAAnimationGroup()
    groupAnimation.beginTime = 0.0
    groupAnimation.duration = 1.5
    groupAnimation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut
)
    groupAnimation.delegate = self


    let rotationAnimation = CAKeyframeAnimation(keyPath: "transform.rotation")
    rotationAnimation.values = [0, 0.14, 0]
    rotationAnimation.keyTimes = [0, 0.5, 0]

    let positionZAnimation = CABasicAnimation(keyPath: "position.z")
    positionZAnimation.fromValue = -1
    positionZAnimation.toValue = 1

    let point0 = NSValue(cgPoint: CGPoint(x: 0, y: 0))
    let point1 = NSValue(cgPoint: CGPoint(x: 110, y: -20))


    let positionAnimation = CAKeyframeAnimation(keyPath: "position")
    positionAnimation.values = [point0, point1, point0]
    positionAnimation.keyTimes = [0, 0.5, 0]

    groupAnimation.animations = [rotationAnimation, positionAnimation, positionZAnimation]

    meMatchImageView.layer.add(groupAnimation, forKey: "switch")
    theyMatchImageView.layer.add(groupAnimation, forKey: "switch")
  

任何帮助将不胜感激！

【参考方案1】：

您的代码中至少存在两个问题。

首先，您在两个ImageView 上应用相同的动画（关于position、rotation 和position.z），一旦动画开始，它们就会执行完全相同的动画，因此在整个过程中，它们完全堆叠在一起。

第二次你使用了错误的keyTimes 属性，看起来你的原始设计应该是[0, 0.5, 1]。