Question

我正在尝试实现此动画，其中UIButton在用户保存文件时淡出。当按钮淡出时，UIImageView复选标记图像会在按钮位置消失。一旦图像视图完全淡入，它就会淡出，按钮会淡入。

    UIView.animateWithDuration(0.60, delay: 0.0, options: UIViewAnimationOptions.CurveEaseOut, animations: {
        self.recButton.alpha = 0.0
        }, completion: {
            (value: Bool) in
            UIView.animateWithDuration(0.60, delay: 0.0, options: UIViewAnimationOptions.CurveEaseIn, animations: {
                self.checkView.alpha = 1.0
                }, completion: {
                    (value: Bool) in
                    UIView.animateWithDuration(0.60, delay: 0.0, options: UIViewAnimationOptions.CurveEaseOut, animations: {
                        self.checkView.alpha = 0.0
                        }, completion: {
                            (value: Bool) in
                            UIView.animateWithDuration(0.60, delay: 0.0, options: UIViewAnimationOptions.CurveEaseIn, animations: {
                                self.recButton.alpha = 1.0
                                self.recButton.enabled = true
                                }, completion: nil)
                    })
            })
    })

虽然上面的方法确实有效，但它并不像我想的那样顺畅。有没有更好的方法来解决这个问题？

Answer 1

你想要的动画需要四个关键帧：按钮淡出，图像淡入，图像淡出，按钮淡入。

let button: UIButton
let checkmarkImage: UIImageView

button.alpha = 1.0
checkmarkImage = 0.0

UIView.animateKeyframesWithDuration(2.4, delay: 0, options: .CalculationModeLinear, animations: {
  UIView.addKeyframeWithRelativeStartTime(0.0, relativeDuration: 0.25, animations: { 
    button.alpha = 0.0
  })
  UIView.addKeyframeWithRelativeStartTime(0.25, relativeDuration: 0.25, animations: {
    checkmarkImage.alpha = 1.0
  })
  UIView.addKeyframeWithRelativeStartTime(0.5, relativeDuration: 0.25, animations: {
    checkmarkImage.alpha = 0.0
  })
  UIView.addKeyframeWithRelativeStartTime(0.75, relativeDuration: 0.25, animations: {
    button.alpha = 1.0
  })
}, completion: nil)

这个问题引起了我的好奇心 - 这个关键帧的东西非常酷。

淡出动画的连续淡入淡出

1 个答案: