Coder1000 Coder1000 - 6 months ago 72
Swift Question

How to chain Facebook pop Animations in a continuous repeatForever?

SITUTATION:

I have created a pulsating animation and it works.

Using the

repeatForever
property, I was able to make it continuous as I wanted.

But one issue remains that I wasn't able to fix after doing A LOT of research.




EXPLANATION:

The only problem is that I don't know how to add one more animation that makes the Image go back to it's original size before pulsating again.

The challenge for me resides in the fact that if I declare it after the other one, it will not be called as it will not be included in the
repeatForever
loop.

Therefore, the animation I have right now is not smooth as once it completes, the image instantly goes back to it's original size before repeating itself.




WHAT HAPPENS:

1) Image pulsates to 1.2 of current size thx to animation.


THIS IS NOT SMOOTH:

2) Animation finishes at 1.2 and Image instantly "warps" back to 1.0


3) Animation repeats itself. Image pulsates to 1.2 again.




PROBLEM: How can I change my pulsatingAnimation so that my image goes back to it's original size in a smooth way before pulsating again ?




CODE:

import Foundation
import pop

class AnimationEngine {

func pulsate(object: UIImageView) {
let pulsateAnim = POPSpringAnimation(propertyNamed: kPOPLayerScaleXY)
pulsateAnim.velocity = NSValue(CGSize: CGSizeMake(0.1, 0.1))
pulsateAnim.toValue = NSValue(CGSize: CGSizeMake(1.2, 1.2))
pulsateAnim.springBounciness = 18
pulsateAnim.dynamicsFriction = 20
pulsateAnim.springSpeed = 1.0
pulsateAnim.repeatForever = true
// pulsateAnim.autoreverses = true
object.layer.pop_addAnimation(pulsateAnim, forKey: "layerScaleSpringAnimation")
}
}

Answer

I found the Solution.

SOLUTION:

func pulsate(object: UIImageView) {
    let pulsateAnim = POPSpringAnimation(propertyNamed: kPOPLayerScaleXY)
    let returnToSizeAnim = POPBasicAnimation(propertyNamed: kPOPLayerScaleXY)

    object.layer.pop_addAnimation(pulsateAnim, forKey: "layerScaleSpringAnimation")
    pulsateAnim.velocity = NSValue(CGSize: CGSizeMake(0.1, 0.1))
    pulsateAnim.toValue = NSValue(CGSize: CGSizeMake(1.2, 1.2))
    pulsateAnim.springBounciness = 30
    pulsateAnim.dynamicsFriction = 20
    pulsateAnim.springSpeed = 1.0
    pulsateAnim.completionBlock = {(animation, finished) in
        object.layer.pop_addAnimation(returnToSizeAnim, forKey: "layerScaleSpringAnimation")
    }
    returnToSizeAnim.toValue = NSValue(CGSize: CGSizeMake(1.0, 1.0))
    returnToSizeAnim.duration = 0.5
    returnToSizeAnim.completionBlock = {(animation, finished) in
        object.layer.pop_addAnimation(pulsateAnim, forKey: "layerScaleSpringAnimation")
    }
}

func pulsate2(object: UIImageView) {
    let pulsateAnim = POPSpringAnimation(propertyNamed: kPOPLayerScaleXY)
    let returnToSizeAnim = POPBasicAnimation(propertyNamed: kPOPLayerScaleXY)

    object.layer.pop_addAnimation(pulsateAnim, forKey: "layerScaleSpringAnimation")
    pulsateAnim.velocity = NSValue(CGSize: CGSizeMake(0.1, 0.1))
    pulsateAnim.toValue = NSValue(CGSize: CGSizeMake(1.2, 1.2))
    pulsateAnim.springBounciness = 30
    pulsateAnim.dynamicsFriction = 20
    pulsateAnim.springSpeed = 1.0
    pulsateAnim.completionBlock = {(animation, finished) in
        object.layer.pop_addAnimation(returnToSizeAnim, forKey: "layerScaleSpringAnimation")
    }
    returnToSizeAnim.toValue = NSValue(CGSize: CGSizeMake(1.0, 1.0))
    returnToSizeAnim.duration = 0.5
    returnToSizeAnim.completionBlock = {(animation, finished) in
        object.layer.pop_addAnimation(pulsateAnim, forKey: "layerScaleSpringAnimation")
    }
}

N.B.:

I need to declare one pulsate function for each object I want to use it on. If I don't do that, the second time I call the function, it won't work properly because an instance of the animations is already running.

Comments