Below I will show you four quadratic easing functions (language is C#, but you can adapt these functions to whatever language you are using):
All the functions will have the same parameters:
currentTime: this is the current time of the tween
start: this is the start value of the tween
diff: this is the difference between the end and start value
length: this is the total time of the tween
Linear (the value will be changed at a constant rate):
public float Linear(float currentTime, float start, float diff, float length)
{
return diff * currentTime / length + start;
}
Ease Out (the value will change quickly at first and then slow down)
public float EaseOut(float currentTime, float start, float diff, float length)
{
currentTime /= length;
return -diff * currentTime*(currentTime-2) + start;
} Ease In (the value will change slowly at first and then speed up)
public float EaseIn(float currentTime, float start, float diff, float length)
{
currentTime /= length;
return diff*currentTime*currentTime + start;
}Ease In Ease Out(the value will change slowly at the beginning and end, and change quickly in the middle)
public float EaseInOut(float currentTime, float start, float diff, float length)
{
if ((currentTime /= length / 2) < 1)
{
return diff / 2 * currentTime * currentTime + start;
}
return -diff / 2 * ((--currentTime) * (currentTime - 2) - 1) + start;
}Example:
So let's use the example from above. We want to move a sprite along the x axis between x = 200 and x = 1000 for a duration of 1.5 seconds. We would set up the parameters like this:
currentTime: you'd need to set up a timer for the tween and update it using your game engine/framework's delta time (time between last frame and current frame)
start: in this case 200
diff: in this case 1000 - 200 = 800
length: in this case 1.5
so call this line every frame:
spriteX = Linear(timer, 200, 800, 1.5);




No comments:
Post a Comment