Easing Demo

[VectorWorlds]

I wanted to use some easing functions in my new game and converted some code from https://easings.net/#

I have included a small demo to show the easing effects of each function.  These functions can be handy for transitioning an object to another position, or transitioning from one scale to another for in a non linear way.

Code Select Expand

Call SetFrameRate(90)

currentEaseType = 1
easeNames={"ease In Sine","ease Out Sine","ease In Out Sine","ease In Quad","ease Out Quad","ease In Out Quad","ease In Cubic",_
"ease Out Cubic","ease In Out Cubic","ease In Quart","ease Out Quart","ease In Out Quart","ease In Quint","ease Out Quint",_
"ease In Out Quint","ease In Expo","ease Out Expo","ease In Out Expo","ease In Circ","ease Out Circ","ease In Out Circ",_
"ease In Back","ease Out Back","ease In Out Back","ease In Elastic","ease Out Elastic","ease In Out Elastic",_
"ease In Bounce","ease Out Bounce","ease In Out Bounce"}

call ReturnToOriginSprite()
call MoveSprite(-17,60)
title = textSprite("EASING DEMO")

call ReturnToOriginSprite()
call MoveSprite(-110,-90)
call textSprite("LEFT AND RIGHT TO CHANGE EASE TYPE")
call ReturnToOriginSprite()
call MoveSprite(-80,-105)
call textSprite("BUTTON 1 TO RESET ANIMATION")

easeRet =  ReturnToOriginSprite()
easeTextPos =  MoveSprite(0,-130)
easeText = textSprite(ToUpper(easeNames[currentEaseType]))

call RefreshEaseNameText()

buttonWait = 0 'delay for button presses
buttonWaitAmount = 5 'how long to wait between button presses

yoffset = 40
plotRet = 0
plotSprite = ReturnToOriginSprite()
dim points[0,3]
plotRet = ReturnToOriginSprite()
call plotEase()

call ReturnToOriginSprite()
octagon = RegularPolygon(8, 3, 180.0 / 8)
octaSprite = LinesSprite(octagon)
call SpriteTranslate(octaSprite,{-50,0})

octaPos = 0

while 1 do
controls = WaitForFrame(JoystickDigital, Controller1 + Controller2, JoystickX + JoystickY)
stickx = controls[1,1]

if stickx<-20 then 'Left
if buttonWait = 0 then
call PrevEaseType()
endif
buttonWait = buttonWaitAmount
endif

if stickx>20  then 'Right
if buttonWait = 0 then
call NextEaseType()
endif
buttonWait = buttonWaitAmount
endif

if controls[1,3] > 0 then
octaPos = 0
endif

if buttonWait > 0 then
buttonWait = buttonWait - 1
endif

call UpdateOcta()

endwhile

sub UpdateOcta()
scale = 60
if octaPos < 1 then
octaPos = octaPos + 0.0085
if octaPos > 1 then
octaPos = 1
endif
call SpriteTranslate(octaSprite,{-50,(-getEase(currentEaseType,octaPos) * scale) + yoffset})
endif
endsub

sub PlotEase()
scale = 3
x = 0
y = 0 + yoffset
points = nil
dim points[0,3]
if not IsNil plotSprite then
call removeSprite(plotSprite)
endif
newline = {{moveto,x,y}}
points = AppendArrays(points,newline)
for i = 0 to 1 step 0.04
y = (-getEase(currentEaseType,i) * 60) + yoffset
newline = {{drawto,x,y}}
points = AppendArrays(points,newline)
x = x + scale
next
plotSprite = linesSprite(points)
call PutSpriteAfter(plotRet,plotSprite)
endSub

function getEase(index,amt)
if index = 1 then
return easeInSine(amt)
endif
if index = 2 then
return easeOutSine(amt)
endif
if index = 3 then
return easeInOutSine(amt)
endif
if index = 4 then
return easeInQuad(amt)
endif
if index = 5 then
return easeOutQuad(amt)
endif
if index = 6 then
return easeInOutQuad(amt)
endif
if index = 7 then
return easeInCubic(amt)
endif
if index = 8 then
return easeOutCubic(amt)
endif
if index = 9 then
return easeInOutCubic(amt)
endif
if index = 10 then
return easeInQuart(amt)
endif
if index = 11 then
return easeOutQuart(amt)
endif
if index = 12 then
return easeInOutQuart(amt)
endif
if index = 13 then
return easeInQuint(amt)
endif
if index = 14 then
return easeOutQuint(amt)
endif
if index = 15 then
return easeInOutQuint(amt)
endif
if index = 16 then
return easeInExpo(amt)
endif
if index = 17 then
return easeOutExpo(amt)
endif
if index = 18 then
return easeInOutExpo(amt)
endif
if index = 19 then
return easeInCirc(amt)
endif
if index = 20 then
return easeOutCirc(amt)
endif
if index = 21 then
return easeInOutCirc(amt)
endif
if index = 22 then
return easeInBack(amt)
endif
if index = 23 then
return easeOutBack(amt)
endif
if index = 24 then
return easeInOutBack(amt)
endif
if index = 25 then
return easeInElastic(amt)
endif
if index = 26 then
return easeOutElastic(amt)
endif
if index = 27 then
return easeInOutElastic(amt)
endif
if index = 28 then
return easeInBounce(amt)
endif
if index = 29 then
return easeOutBounce(amt)
endif
if index = 30 then
return easeInOutBounce(amt)
endif
endFunction

sub NextEaseType()
currentEaseType = currentEaseType + 1
if currentEaseType > ubound(easeNames) then
currentEaseType = 1
endif
octaPos = 0
call RefreshEaseNameText()
call PlotEase()
endSub

sub PrevEaseType()
currentEaseType = currentEaseType - 1
if currentEaseType = 0 then
currentEaseType = ubound(easeNames)
endif
octaPos = 0
call RefreshEaseNameText()
call PlotEase()
endSub

sub RefreshEaseNameText()
call RemoveSprite(easeText)
easeText = textSprite(ToUpper(easeNames[currentEaseType]))
call PutSpriteAfter(easeTextPos,easeText)

call RemoveSprite(easeTextPos)
easeTextPos = MoveSprite(-Len(easeNames[currentEaseType])*3,100)
call PutSpriteBefore(easeText,easeTextPos)
endSub

'// TWEENING FUNCTIONS
'// https://easings.net/

function easeInSine(n)
  return 1 - cos((n * PI) / 2)
endFunction

function easeOutSine(n)
  return sin((n * PI) / 2)
endFunction

function easeInOutSine(n)
return -(cos(PI * n) - 1) / 2
endFunction

function easeInQuad(n)
return n * n
endFunction

function easeOutQuad(n)
return 1 - (1 - n) * (1 - n)
endFunction

function easeInOutQuad(n)
if n < 0.5 then
return 2 * n * n
else
return 1 - pow(-2 * n + 2, 2) / 2
endif
endfunction

function easeInCubic(n)
return n * n * n
EndFunction

function easeOutCubic(n)
return 1 - pow(1 - n, 3)
endFunction

function easeInOutCubic(n)
if n < 0.5 then
return 4 * n * n * n
else
return 1 - pow(-2 * n + 2, 3) / 2
endif
endFunction

function easeInQuart(n)
return n * n * n * n
endFunction

function easeOutQuart(n)
return 1 - pow(1 - n, 4)
endFunction

function easeInOutQuart(n)
if n < 0.5 then
return 8 * n * n * n * n
else
return 1 - pow(-2 * n + 2, 4) / 2
endif
endFunction

function easeInQuint(n)
return n * n * n * n * n
endFunction

function easeOutQuint(n)
return 1 - pow(1 - n, 5)
endFunction

function easeInOutQuint(n)
if n < 0.5 then
return 16 * n * n * n * n * n
else
return 1 - pow(-2 * n + 2, 5) / 2
endif
endFunction

function easeInExpo(n)
if n = 0 then
return 0
else
return pow(2, 10 * n - 10)
endif
endFunction

function easeOutExpo(n)
if n = 1 then
return 1
else
return 1 - pow(2, -10 * n)
endif
endFunction

function easeInOutExpo(n)
if n = 0 then
return 0
else
if n = 1 then
return 1
else
if n < 0.5 then
return pow(2, 20 * n - 10) / 2
else
return (2 - pow(2, -20 * n + 10)) / 2
endif
endif
endif
endFunction

function easeInCirc(n)
return 1 - sqrt(1 - pow(n, 2))
endfunction

function easeOutCirc(n)
return sqrt(1 - pow(n - 1, 2))
endFunction

function easeInOutCirc(n)
if n < 0.5 then
return (1 - sqrt(1 - pow(2 * n, 2))) / 2
else
return (sqrt(1 - pow(-2 * n + 2, 2)) + 1) / 2
endif
endFunction

function easeInBack(n)
c1 = 1.70158
c3 = c1 + 1

return c3 * n * n * n - c1 * n * n
endFunction

function easeOutBack(n)
c1 = 1.70158
c3 = c1 + 1
return 1 + c3 * pow(n - 1, 3) + c1 * pow(n - 1, 2)
endFunction

function easeInOutBack(n)
c1 = 1.70158
c2 = c1 * 1.525

if n < 0.5 then
return (pow(2 * n, 2) * ((c2 + 1) * 2 * n - c2)) / 2
else
return (pow(2 * n - 2, 2) * ((c2 + 1) * (n * 2 - 2) + c2) + 2) / 2
endif
endFunction

function easeInElastic(n)
c4 = (2 * PI) / 3
if n = 0 then
return 0
else
if n = 1 then
return 1
else
return -pow(2, 10 * n - 10) * Sin((n * 10 - 10.75) * c4)
endif
endif
endFunction

function easeOutElastic(n)
c4 = (2 * PI) / 3
if n = 0 then
return 0
else
if n = 1 then
return 1
else
return pow(2, -10 * n) * Sin((n * 10 - 0.75) * c4) + 1
endif
endif
endFunction

function easeInOutElastic(n)
c5 = (2 * PI) / 4.5
if n = 0 then
return 0
else
if n = 1 then
return 1
else
if n < 0.5 then
return -(pow(2, 20 * n - 10) * Sin((20 * n - 11.125) * c5)) / 2
else
return (pow(2, -20 * n + 10) * Sin((20 * n - 11.125) * c5)) / 2 + 1
endif
endif
endif
endFunction

function easeInBounce(n)
return 1 - easeOutBounce(1 - n)
endFunction

function easeOutBounce(n)
n1 = 7.5625
d1 = 2.75

if (n < 1 / d1) then
return n1 * n * n
else
if (n < 2 / d1) then
n = n - (1.5 / d1)
return n1 * n * n + 0.75
'return n1 * (n -= 1.5 / d1) * n + 0.75
else
if (n < 2.5 / d1) then
n = n - (2.25 / d1)
return n1 * n * n + 0.9375
'return n1 * (n -= 2.25 / d1) * n + 0.9375
else
n = n - (2.625 / d1)
return n1 * n * n + 0.984375
'return n1 * (n -= 2.625 / d1) * n + 0.984375
endif
endif
endif
endFunction

function easeInOutBounce(n)
if n < 0.5 then
return (1 - easeOutBounce(1 - 2 * n)) / 2
else
return (1 + easeOutBounce(2 * n - 1)) / 2
endif
endFunction


Cheers,


Andrew

[jaymzjulian]

Oh hey, cool - i hadn't seen that site before, either, quite useful