如何使用curveEaseInOut或Keyframes控制Swift中的动画速度?

时间:2017-02-26 21:23:30

标签: ios animation swift3

使用Swift 3,我正在动画几个UILabels'滑动'他们从右到左。 标签的长度各不相同。

我试图让他们的速度无论长度如何都显得相同。

我使用此代码,但实际上并没有给我带来我需要的视觉效果,因为我只能根据曲线的长度和性质来改变每个标签的持续时间并不能真正解决这个问题。 :

        UIView.animate(withDuration: 5.0, delay: 5.0, usingSpringWithDamping: 0.9, initialSpringVelocity: 0.0, options: [.curveEaseInOut,.repeat], animations: {
            self.Label_1.frame.origin.x = -self.Label_1.frame.width
        }, completion: nil)

        UIView.animate(withDuration: 10.0, delay: 5.0, usingSpringWithDamping: 0.9, initialSpringVelocity: 0.0, options: [.curveEaseInOut,.repeat], animations: {
            self.Label_2.frame.origin.x = -self.Label_2.frame.width
        }, completion: nil)

动画会加速,直到中点然后变慢。在我看来,curveEaseInOut运动曲线没有考虑到“缓和”之间的恒定速度时期。我画的这张可怕的图片应该有所帮助:

enter image description here

1)显示了曲线的明显视觉特性 - 其中的缓入和缓出过渡没有任何恒定的速度,而 2)显示了我想要实现的目标。

2)我可以指定缓入,缓出和恒定速度之间的时间长度。

我怎样才能达到我之后的效果?

1 个答案:

答案 0 :(得分:0)

这是一个简单但易于实现的动画。你真正想要做的是为这个动画创建一个图层。像这样的东西,它对你正在做的事情不起作用,因为它有不同的变量,但它对我有用。

  let labelSpringAnimationIn = CASpringAnimation(keyPath: "position.x")
    labelSpringAnimationIn.fromValue = -100.0
    labelSpringAnimationIn.toValue = 200.0
    labelSpringAnimationIn.duration = 2.0

    //this duration can be whatever you want, if you want the cons
    //you can find what these mean by searching in the documentation
    labelSpringAnimationIn.initialVelocity = 3.0
    labelSpringAnimationIn.damping = 9.8

    let labelSpringAnimationOut = CASpringAnimation(keyPath: "position.x")
    labelSpringAnimationOut.fromValue = 200.0
    labelSpringAnimationOut.toValue = -100.0
    labelSpringAnimationOut.duration = 2.0

    //this duration can be whatever you want, if you want the cons
    //you can find what these mean by searching in the documentation
    labelSpringAnimationOut.initialVelocity = 3.0
    labelSpringAnimationOut.damping = 9.8


    UIView.animate(withDuration: 2.0, delay: 0.0, options: [], animations: {
        self.label.layer.add(labelSpringAnimationIn, forKey: nil)
    }, completion: {
        _ in UIView.animate(withDuration: 2.0, delay: 0.0, options: [], animations: {
            self.label.layer.add(labelSpringAnimationOut, forKey: nil)

        }, completion: {
            _ in
            self.label.layer.removeAllAnimations()
            sleep(UInt32(3.0))
            self.labelAnimation()


        })
    })