How to drag, drop, animate a view along a curved path

I have an iPhone based application. A small image is currently displayed in the upper left corner of the screen. When the user clicks on the screen, the image is animated using CAKeyframeAnimation along the lush path to the lower right corner of the screen.

Now I want to change the application, instead of animating the tap event, the user can drag the image along the animation path. Basically, when the user pulls down to the right, the animation moves forward, when the user drags up or to the left, the animation moves backward. In a touch completion event, I want the image to continue to animate along the path in the drag direction.

I know how to read a drag event, but I don’t know how to start / stop / resume an animation or go to a specific stage of an animation. Looks like I need to start all over and use something other than CAKeyframeAnimation. If so, how do I get started?

Thank you very much!

+4
source share
2 answers

Unfortunately, there is no way to set CAAnimation to start halfway.

You will need to manually move the image along the path as the user drags it, and then create a new CAAnimation with the remaining path after the user drags.

+1
source

Sign F is correct. I had a similar problem while working on a game. I wanted to restart the animation from the point at which they were paused.

The simplest solution I could come up with was to fix the start time:

mStartTime = [layer convertTime:CACurrentMediaTime() fromLayer:nil]; 

Then, when the animation is stopped, get the stop time and calculate the offset:

  CFTimeInterval stopTime = [layer convertTime:CACurrentMediaTime() fromLayer:nil];; mTimeOffset += stopTime - mStartTime; 

Using mTimeOffset , I would calculate a different set of key times:

 - (NSArray *)keyTimesWithOffsetTime:(CFTimeInterval)offsetTime; 

Based on this, I would get a different starting frame for the animation. By "frame" I mean any segment of keyframe animation.

This is a little pain, but it works. I would be very interested to know how games using cocos2d handle pause and resume. There should be an easier way.

As for the animation along the way, it seems that everything is fine with you. If not, look at this tutorial:

Main animation: paths

0
source

All Articles