如何计算 animateKeyframes 中的 relativeDuration

Question

我正在尝试了解如何使用 UIView.animateKeyframes，但我终其一生都无法理解如何计算时间/持续时间。

我正在努力实现以下目标：我希望整个动画持续 10 秒，由...

first addKeyframe runs at 01 seconds and takes 1 second

second addKeyframe runs at 02 seconds and takes 1 second

third addKeyframe runs at 05 seconds and takes 2 seconds

fourth addKeyframe runs at 07 seconds and takes 1 second

fourth addKeyframe runs at 09 seconds and takes 1 second

  fileprivate func animateWelcomeText() -> Void {

        let duration: TimeInterval = 10

        UIView.animateKeyframes(withDuration: duration, delay: 0, options: .calculationModeLinear, animations: {
            UIView.addKeyframe(withRelativeStartTime: 1.0, relativeDuration: 1.0, animations: {
                self.introTextLabel.alpha = 1
            })

            UIView.addKeyframe(withRelativeStartTime: 2.0, relativeDuration: 1.0, animations: {
                self.introTextLabelTwo.alpha = 1
            })

            UIView.addKeyframe(withRelativeStartTime: 5.0, relativeDuration: 2.0, animations: {
                self.introTextLabel.alpha = 0
                self.introTextLabelTwo.alpha = 0
            })

            UIView.addKeyframe(withRelativeStartTime: 7.0, relativeDuration: 1.0, animations: {
                self.introTextLabelThree.alpha = 1
            })

            UIView.addKeyframe(withRelativeStartTime: 9.0, relativeDuration: 1.0, animations: {
                self.introTextLabelFour.alpha = 1
            })

        }) { (_) in
            print("Complete")
        }
    }

没有任何反应，然后动画完成，最后 2 个项目突然出现。

Answer 1

这只是数学。只需将所有值除以持续时间即可得到相对值。

fileprivate func animateWelcomeText() -> Void {

    let duration: TimeInterval = 10

    UIView.animateKeyframes(withDuration: duration, delay: 0, options: .calculationModeLinear, animations: {
        UIView.addKeyframe(withRelativeStartTime: 1/duration, relativeDuration: 1/duration, animations: {
            self.introTextLabel.alpha = 1
        })
        UIView.addKeyframe(withRelativeStartTime: 2/duration, relativeDuration: 1/duration, animations: {
            self.introTextLabelTwo.alpha = 1
        })
        UIView.addKeyframe(withRelativeStartTime: 5/duration, relativeDuration: 2/duration, animations: {
            self.introTextLabel.alpha = 0
            self.introTextLabelTwo.alpha = 0
        })

        UIView.addKeyframe(withRelativeStartTime: 7/duration, relativeDuration: 1/duration, animations: {
            self.introTextLabelThree.alpha = 1
        })

        UIView.addKeyframe(withRelativeStartTime: 9/duration, relativeDuration: 1/duration, animations: {
            self.introTextLabelFour.alpha = 1
        })

    }) { (_) in
        print("Complete")
    }
}

您的值超出了 x (10)。该方法需要 1.

如何计算 animateKeyframes 中的 relativeDuration

How to calculate relativeDuration in animateKeyframes

swift

uiview

uiviewanimation