Transition_EaseOutElastic2 - ProGUI Reference Manual

Syntax

Value.d = Transition_EaseOutElastic2(t.d, b.d, c.d, d.d, easeInRatio.d=0.2, amplitude.d=10, wobbleAmount.d=3)

Description

Calculates an intermediate value using a custom elastic effect that combines an initial ease-out phase followed by a decaying wobble or bounce phase. This is similar to Transition_EaseInElastic2() but starts with deceleration.

Parameters

t.d
The current elapsed time of the animation in milliseconds.

b.d
The starting value of the property being animated.

c.d
The total change in value (target value - starting value).

d.d
The total duration of the animation in milliseconds.

easeInRatio.d (optional)
The proportion (0.0 to 1.0) of the total duration `d` dedicated to the initial ease-out phase (note: the parameter name is slightly misleading here, it controls the first phase duration). Default is 0.2 (20%).

amplitude.d (optional)
Controls the initial intensity or height of the wobble phase. Default is 10.

wobbleAmount.d (optional)
Controls the frequency or number of wobbles during the second phase. Higher values mean more wobbles. Default is 3.

Return Value

Returns the interpolated value (Double) at the current time `t` according to this custom ease-out/wobble curve.

Remarks

This function offers more control over the elastic effect by separating the initial phase from the wobble part, starting with deceleration.

Example

IncludeFile "ProGUI_PB.pbi"

Structure MyAnimData
  TargetValue.d
  StartValue.d
  x.d
EndStructure

Procedure DrawHandler(Window, EventType, *EventData.PG_EventDraw, *UserData.MyAnimData)
  
    DrawClear(RGB(200, 200, 200), 1) ; Grey background

    ; Draw a box whose X position is animated
    DrawBox(*UserData\x, (*EventData\height / 2) - 25, 50, 50, RGB(0, 0, 255))
    
EndProcedure

Procedure AnimateHandler(Window, EventType, *EventData.PG_EventAnimate, *UserData.MyAnimData)
  
  Select *EventData\state
  
    Case #PG_Event_Animate_Start
      Debug "Animation started."
      
    Case #PG_Event_Animate_Update
      ; Calculate intermediate value using the ease-out-elastic2 transition
      *UserData\x = Transition_EaseOutElastic2(*EventData\currentTime, *UserData\StartValue, *UserData\TargetValue - *UserData\StartValue, *EventData\duration)
      ; Optional: *UserData\x = Transition_EaseOutElastic2(..., ..., ..., ..., 0.5, 8, 2) ; Longer initial phase, lower amplitude, fewer wobbles
      WindowRedraw(Window)
      
    Case #PG_Event_Animate_End
      Debug "Animation ended"
      ; Ensure final value is set exactly
      *UserData\x = *UserData\TargetValue
      WindowRedraw(Window)
  EndSelect
EndProcedure

StartProGUI()

MyWindow = CreateWindow(0, 0, 300, 200, "Transition_EaseOutElastic2 Example")

If MyWindow
    
  ; Setup data for animation
  *AnimData.MyAnimData = AllocateStructure(MyAnimData)
  *AnimData\StartValue = 10 
  *AnimData\TargetValue = 200
    
  AddEventHandler(MyWindow, #PG_Event_Draw, @DrawHandler(), *AnimData)
  AddEventHandler(MyWindow, #PG_Event_Animate, @AnimateHandler(), *AnimData) 

  ; Start a 2-second animation
  AnimID = StartAnimation(MyWindow, #PG_Any, 2000)

  WindowShow(MyWindow, #True, #PG_WindowShow_ScreenCentered)
  Repeat : Event = WaitWindowEvent() : Until Event = #PB_Event_CloseWindow
  
  StopAnimation(MyWindow, AnimID) 
  FreeStructure(*AnimData)
  
EndIf 

StopProGUI()

Supported OS

Windows, Linux