Note: This addon should work on any 4.x version of Godot as it does not rely on the offset_transform property introduced in 4.7

Check out the documentation for a detailled step by step guide.

Minimal example

This tool works with your existing scenes. Simply add a ProtonControlAnimation node under the control you want to animate.

In this example, we will animate the PanelContainer

The ProtonControlAnimation nodes

• This node handles when an animation should play.
  • Check out the full documentation for more information.
• Target is the control node to animate (in this case, the PanelContainer).
• Animation is the animation that will play.

The animation resources

• The animation resource is what actually animates the controls.
• Add a Scale animation one to the ProtonControlAnimation node
• Each animation has its own set of parameters, check out the documentation.

Playing an animation

The easiest way to play an animation is by using the Triggers properties, on the ProtonControlAnimation node:

• Trigger Source is the control we're listening for events
  • The triggers below are the most commonly used signals.
• In this example, On Hover Start is enabled. The animation will play when the player hovers PanelContainer with the mouse.
• You can also ignore that panel and either:
  • Directly call the start() function
  • Connect any signal to the start() method

You can find more information in the example scene: 05_triggers.tscn

That's it!

This setup scales the panel up when hovering it with the mouse. You can add another animation node to scale it down when the mouse stops hovering. Check out the complete scene in addons\proton_control_animation\examples\01_getting_started.tscn

Going further

You can extend the ProtonControlAnimationResource class to create your own animations. Check out the animations/fade.gd script for a minimal example.