CODEWITHSUNDEEP
actionscript-3vectorphysicsdistance
decapyre
decapyre

Reputation: 13

Math based distance easing with specific animation change 1 second from destination point

I have a pretty specific question in which I have an Object moving along a vector that will eventually end up at a destination point and stop moving. The object in question is an asset that has a 'fly' animation sequence, a 'landing' animation sequence and an 'idle' animation sequence.

The Object must move along a straight line coming from a random point on the stage at a fixed velocity. The object will begin to ease when it is exactly 30 frames away from the end point in which it will change into the landing sequence(which takes 30 frames, or one second based on frameRate). Once the landing sequence is complete the easing should be rounding down to 0 in which the object has completed its journey and now switches to the 'idle' sequence indefinitely.

I have provided a screenshot below demonstrating my issue. Any help will be much appreciated as the math and when to play the landing sequence is giving me the most problems. I am trying to have the process of flying -> landing -> idling be very smooth and natural.

I am using ActionScript3 and the SWF is running at or close to 30fps!

Screenshot explanation here: https://i.sstatic.net/oWrEg.png

Upvotes: 1

Views: 565

Answers (1)

prototypical
prototypical

Reputation: 6751

I would suggest that you use the Tweenlite library.

Here's some psuedo code :

// determine x,y landing location
// calculate the angle between ship's x,y & landing location.
// calculate the x,y location along that angle that the landing animation should begin
// Tween from ship's x,y to the x,y where landing sequence should begin
    // set the onComplete parameter to call the function that triggers the landing sequence
// Tween from ship's current location to the landing location
    // set onComplete parameter to call function that sets ship to idle animation

If you use Tweenlite, this is an example of how you would set a tween :

Tweenlite.to(ship, duration, {x:targetX, y:targetY, onComplete:startLandingSequence});

-- duration would be how long it should take the ship to get from it's current location to the location where your landing sequence should begin.

When using tweens for something like this, you need to calculate how long it should take your ship to get to a given location based on it's speed. That value is what you will pass as a duration for your tween.

duration = distance / speedInPixelsPerSecond;

In terms of calculating the vectors as you have asked in the comments, here is a great tutorial on vectors :

http://www.tonypa.pri.ee/vectors/as3/start.html

Upvotes: 1

Related Questions