Write a map coordinate bounce animation in Swift language

Imitate the "one car" to write a coordinate icon bounce animation, the implementation of the effect is as follows: (Record a little flash careful dog eye)

Analyze this animation as follows:
1.easeIn or linear is raised approx. 30 megapixels
2. Be flexible and put down

Then began the Swift animation journey of dog Blood.

Note: Because I just started to learn IOS development, the animation is just contact, the following way is only to complete the requirements, the following article does not explain the details of the implementation of the animation, nor is it likely to be the best way to achieve this requirement, just "realized" just as a reference. I will also continue to explore the details inside, later in the blog update.

The first step is to achieve

Let go of the physical effects of the egg pain first, lift it up, then put it down ... (Slag Blog Park unexpectedly no Swift syntax highlighting)

" POSITION.Y "  true//  run up and get back to me 0.2=-" Bounce ")

The effect is as follows:

Congratulations I have completed the "beep a taxi" effect simulation, long March the first step.

Step two, beautify

Round bow meaning although it is, but it feels wrong, I first very amused to add such a line of code:

Animation.timingfunction = Camediatimingfunction (name:kcamediatimingfunctioneaseout)

This is obviously. There is no egg to use. Typical Luck Programming:

So I began to devote myself to the cultivation ...

In fact, we have just been very calm analysis, a linear animation, a flexible down, linear nature is good to achieve, the key problem lies in the back.

A Google without fruit, began to seriously learn cabasicanimation, found that there is an open source class library called Rbbanimation.

Like the Sun monkey found a big peach, hurriedly through the CocoaPods into the project. After the pod install is complete, the Xx-bridging-header.h file is created with the following content:

#include <RBBAnimation/RBBAnimation.h>

It is then introduced in the. Swift file:

Import Rbbanimation

And then write the bouncing animation.

" POSITION.Y "  = 0.7"Bouncedown" )

The effect is as follows:

Please do not care about the last second small mark and roll back to the original position, is the normal performance of cabasicanimation.

The third step is to integrate and improve

Now put the two animations together and add the displacement code

catransaction.begin () let Animationup= Cabasicanimation (keypath:"POSITION.Y") Animationup.duration=0.2Animationup.fromvalue=LocateImage.layer.position.yanimationUp.toValue= LOCATEIMAGE.LAYER.POSITION.Y- -Catransaction.setcompletionblock ({let Animationdown= Rbbtweenanimation (keypath:"POSITION.Y") Animationdown.fromvalue=SELF.LOCATEIMAGE.LAYER.POSITION.Y Animationdown.tovalue= Self.locateimage.layer.position.y + -animationdown.easing=rbbeasingfunctioneaseoutbounce; Animationdown.duration=0.7self.locateImage.layer.addAnimation (Animationdown, Forkey:"Bouncedown") SELF.LOCATEIMAGE.LAYER.POSITION.Y+= -}) locateImage.layer.addAnimation (Animationup, Forkey:"Bounceup") LOCATEIMAGE.LAYER.POSITION.Y-= -Catransaction.commit ()

The effect is as follows:

Reference:

Animation Explanation:
http://objccn.io/issue-12-1/

Rbbanimation:
Https://github.com/robb/RBBAnimation

Animation End Callback for Calayer?
Http://stackoverflow.com/questions/296967/animation-end-callback-for-calayer

Write a map coordinate bounce animation in Swift language