This class is used to animate all the direct child of the node specified.

Syntax 

  Anima.Grid(grid: Node, grid_size: Vector2, items_delay: float, animation_type: int = GROUP.FROM_TOP, point := 0)
paramtypeDefaultDescription
groupNodeThe node of whom children we want to animate
grid_sizeVector2The grid size
items_delayfloatThe incremental delay to apply for each child of the group
animation_typeANIMA.GRIDANIMA.GRID.FROM_TOP_RIGHTThe order to which animate the elements
pointVector2Vector2.ZEROThe starting point of the animation

Animation type

The animation type parameter is used to define how to animate the nodes inside the group or create staggered animations.

OptionDescription
FROM_TOPAnimates the group items from top to down
FROM_BOTTOMAnimates the group items from bottom to top
FROM_CENTERAnimated the items from the center of the group to the top and bottom at the same time.
TOGETHERAnimates all the items at the same time. items_delay is ignored
ODDS_ONLYAnimates the group odd items only, starting from the top
EVEN_ONLYAnimates the even items only, starting from the top
RANDOMRandomize the group starting point
FROM_INDEXThe item index to start the animation

Staggered Animation

Selecting the starting index is inside the range ]0, GROUP_LENGTH[ creates a staggering animation, where node starting delay depends by its absolute distance from that point.

Let’s consider the following group with 7 buttons:

Control node with 7 children

And animate them from the middle using, for semplicity, a delay of 1 second between each node:

  Anima.Grid($Control, 1, ANIMA.GROUP.FROM_CENTER) \
    .anima_fade_in()

The middle node of this group is: Button4 with an index of 3, then:

  • Button3 and Button5 have an absolute distance from Button4 of 1
  • Button2 and Button5 have an absolute distance from Button4 of 2
  • Button1 and Button5 have an absolute distance from Button4 of 3

So this is equivalent to:

  1. Fade in Button4
  2. Wait 1 second
  3. Fade in Button3 and Button5
  4. Wait 1 second
  5. Fade in Button2 and Button6
  6. Wait 1 second
  7. Fade in Button1 and Button7

Methods

NOTE: For commodity, all the class methods start with the anima_ prefix. This allows us to filter out all the Godot default class methods:

as_reusable

Tells Anima to keep the node in the scene after the animation completes.

Syntax 

  as_reusable()

anima_animation

Animates the Grid using the given animation name.

Syntax 

  anima_animation(animation: String, duration: float)
animation string required
The animation name
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anim.Grid(Vector2(2, 2), 0.1).anima_animation("zoomIn")

anima_animation_frames

Animates the Grid using a CSS-Style inline animation.

NOTE: For more info check the Animation Keyframes tutorial

Syntax 

  anima_animation_frames(frames: Dictionary, duration: float)
frames Dictionary required
The animation frames. SeeCreate a custom keyframes animation for more information about the syntax
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example: 

  Anim.Grid(Vector2(2, 2), 0.1).anima_animation_frames({
    from = {
        opacity = 0,
        x = 0,
        y = 0,
    },
    to = {
        opacity = 1,
        x = 100
        y = 100
    },
    easing = AnimaEasing.EASING.EASE_IN_OUT
})

anima_property

Animates the given property.

Compared to the other property specific fuctions, like anima_position_x this method allows us to specify a dynamic value

Syntax 

  anima_property(property: String, final_value: Variant, duration: float)
property string required

The property to animate it can be any node property that can be accessed, even exported variables. For example:

  • size
  • position

We can also specify the subkey of the Vector2, Vector3 or Rect2 we want to animate, for example:

  • size:x
  • position:y
  • size:width

Anima also recognised these built-in property names:

propertydescription
xThis is equivalent to position:x or rect_position:x
yThis is equivalent to position:y or rect_position:x
zThis is equivalent to position:z or rect_position:x
widthThis is equivalent to size:x or rect_size:x
heightThis is equivalent to size:y or rect_size:y
shared_paramThis will call set_shader_param
final_value Variant required
(Optional) The final value. If null, the current property value is used as final value
duration float optional
The animation duration (seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_property("size:x").anima_from(100)
Anima.Grid(Vector2(2, 2), 0.1).anima_property("x", 200)
position vs rect_position

Although Godot prefixes some of the Controls properties with rect_, we don’t need to worry about that; Anima will figure out the correct property name.

For example:

  Anima.Grid($Control).anima_property("position:x", 100 ) # Animates rect_position.x
Anima.Grid($Node2D).anima_property("position:x", 100 )  # Animates position.x

anima_as_relative

Tells anima that the final value is a relative one

Syntax 

  anima_as_relative()

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_scale_x(0.8).anima_as_relative()

anima_delay

The delay to use before starting the animation.

Syntax 

  anima_delay(delay: float)

NOTE: You can also use negative values to anticipate a sequential/parallel animation

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_scale_x(0.8).anima_delay(0.5)

# or
Anima.Grid(Vector2(2, 2), 0.1).anima_scale_x(0.8).anima_delay(-0.5)

anima_distance_formula

The formula to use to calculate the distance between the elements.

Syntax 

  .anima_distance_formula(formula: ANIMA.DISTANCE)
formula ANIMA.DISTANCE required
The formula to use to calculate the distance between the elements

Formula

  enum DISTANCE {
	EUCLIDIAN,
	MANHATTAN,
	CHEBYSHEV,
	COLUMN,
	ROW,
	DIAGONAL,
}

To visualize the effects of different easing formulas, explore these resources:

These demonstrations will provide a clear understanding of how easing points influence animation behavior.

Example 

  (
    Anima.Grid(Vector2(2, 2), 0.1)
    .anima_distance_formula(ANIMA.DISTANCE.MANHATTAN)
    .anima_fade_in()
    .play()
)

anima_easing

The easing to use to animate the node.

NOTE: List of available easings

Syntax 

  anima_easing(easing: int)

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_scale_x(0.8).anima_easing(ANIMA.EASINGS.EASE_IN_OUT)

anima_from

Set the initial value.

Syntax 

  anima_from(value: Variant)
value Variant required
The initial value

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_property("x").anima_from(-100)

anima_fade_in

Fades in the given element(s)

Syntax 

  anima_fade_in(duration: float)
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).fade_in(0.4)

anima_fade_out

Fades out the given element(s)

Syntax 

  anima_fade_out(duration: float)
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).fade_out(0.4)

anima_on_started

Callback to be triggered when the Grid animation starts.

Syntax 

  anima_on_started(callback: Funcref | Callable, on_started_value, on_backwards_completed_value = null)
callback Callable required
The callback to call when the animation is starts
on_started_value Variant required
The parameter to pass at the callback when the animation is played forward
on_backwards_completed_value Variant optional
The parameter to pass at the callback when the animation is played backwards
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_on_started(funcref(self, "do_something"), true, false)

func do_something(is_forward) -> void:
    print(is_forward)

anima_on_completed

Callback to be triggered when the Grid animation completes.

Syntax 

  anima_on_completed(on_completed: Callable, on_completed_value, on_backwards_started_value = null)
on_completed Callable required
The callback to call when the animation is completed
on_completed_value Variant required
The parameter to pass at the callback when the animation is played forward
on_backwards_started_value Variant optional
The parameter to pass at the callback when the animation is played backwards
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_on_started(funcref(self, "do_something"), true, false)

func do_something(is_forward) -> void:
    print(is_forward)

anima_pivot

The pivot point to use to animate the node.

NOTE: List of available pivot points

Syntax 

  anima_pivot(easing: int)

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_scale_x(0.8).anima_pivot(ANIMA.PIVOT.CENTER)

anima_position

Animates the x and y position of the given element(s)

Syntax 

  anima_position(position: Vector2, duration: float)
position Vector2 required
The final 2D position
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_position(Vector2(100, 100))
Anima.Grid(Vector2(2, 2), 0.1).anima_position(Vector2(100, 100), 0.3) # duration - 0.3s

anima_position3D

Animates the x, y and z position of the given element(s)

Syntax 

  anima_position3D(position: Vector3, duration: float)
position Vector3 required
The final 3D position
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_position3D(Vector3(100, 100, 0))

anima_position_x

Animates the global x position of the given element(s)

Syntax 

  anima_position_x(x: float, duration: float)
x float required
The global final x position
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_position_x(100)

anima_position_y

Animates the global y position of the given element(s)

Syntax 

  anima_position_y(y: float, duration: float)
y float required
The global final y position
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_position_y(100)

anima_position_z

Animates the global z position of the given element(s)

Syntax 

  anima_position_z(z: float, duration: float)
z float required
The global final z position
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_position_z(-1)

anima_relative_position

Animates the relative x and y position of the given element(s)

Syntax 

  anima_relative_position(position: Vector2, duration: float)
position Vector2 required
The relative 2D position
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_relative_position(Vector2(100, 100))

anima_relative_position3D

Animates the relative x, y and z position of the given element(s)

Syntax 

  anima_relative_position3D(position: Vector3, duration: float)
position Vector3 required
The relative 3D position
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_relative_position3D(Vector3(100, 100, 0))

anima_relative_position_x

Animates the relative x position of the given element(s)

Syntax 

  anima_relative_position_x(x: float, duration: float)
x float required
The relative x position
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_relative_position_x(100)

anima_relative_position_y

Animates the relative y position of the given element(s)

Syntax 

  anima_relative_position_y(y: float, duration: float)
y float required
The relative y position
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_relative_position_y(100)

anima_relative_position_z

Animates the relative z position of the given element(s)

Syntax 

  anima_relative_position_z(z: float, duration: float)
z float required
The relative z position
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_relative_position_z(-1)

anima_rotate

Animates the 2D rotate property of the given element(s)

Syntax 

  anima_rotate(rotate: Vector2, duration: float)
rotate Vector2 required
The final rotate value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_rotate(Vector2.ZERO)

anima_rotate3D

Animates the 3D rotate property of the given element(s)

Syntax 

  anima_rotate3D(rotate: Vector3, duration: float)
rotate Vector3 required
The final rotate value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_rotate3D(Vector3(10, 0, -0.5))

anima_rotate_x

Animates the x rotate property of the given element(s)

Syntax 

  anima_rotate_x(rotate_x: float, duration: float)
rotate_x float required
The final rotate x value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_rotate_x(0.8)

anima_rotate_y

Animates the y rotate property of the given element(s)

Syntax 

  anima_rotate_y(rotate_y: float, duration: float)
rotate_y float required
The final rotate y value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_rotate_y(0.8)

anima_rotate_z

Animates the z rotate property of the given element(s)

Syntax 

  anima_rotate_z(rotate_z: float, duration: float)
rotate_z float required
The final rotate z value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_rotate_z(0.8)

anima_scale

Animates the 2D scale property of the given element(s)

Syntax 

  anima_scale(scale: Vector2, duration: float)
scale Vector2 required
The final scale value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_scale(Vector2.ZERO)

anima_scale3D

Animates the 3D scale property of the given element(s)

Syntax 

  anima_scale3D(scale: Vector3, duration: float)
scale Vector3 required
The final scale value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_scale3D(Vector3(10, 0, -0.5))

anima_scale_x

Animates the x scale property of the given element(s)

Syntax 

  anima_scale_x(scale_x: float, duration: float)
scale_x float required
The final scale x value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_scale_x(0.8)

anima_scale_y

Animates the y scale property of the given element(s)

Syntax 

  anima_scale_y(scale_y: float, duration: float)
scale_y float required
The final scale y value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_scale_y(0.8)

anima_scale_z

Animates the z scale property of the given element(s)

Syntax 

  anima_scale_z(scale_z: float, duration: float)
scale_z float required
The final scale z value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_scale_z(0.8)

anima_size

Animates the 2D size property of the given element(s)

Syntax 

  anima_size(size: Vector2, duration: float)
size Vector2 required
The final size value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_size(Vector2.ZERO)

anima_size3D

Animates the 3D size property of the given element(s)

Syntax 

  anima_size3D(size: Vector3, duration: float)
size Vector3 required
The final size value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_size3D(Vector3(10, 0, -0.5))

anima_size_x

Animates the x size property of the given element(s)

Syntax 

  anima_size_x(size_x: float, duration: float)
size_x float required
The final size x value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_size_x(0.8)

anima_size_y

Animates the y size property of the given element(s)

Syntax 

  anima_size_y(size_y: float, duration: float)
size_y float required
The final size y value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_size_y(0.8)

anima_size_z

Animates the z size property of the given element(s)

Syntax 

  anima_size_z(size_z: float, duration: float)
size_z float required
The final size z value
duration float optional
The animation duration (in seconds). If null, the default duration is used
Default: null

Example 

  Anima.Grid(Vector2(2, 2), 0.1).anima_size_z(0.8)

Chaining

Anima uses the anima_with and anima_then methods to chain multiple animations.

anima_with

Executes the next animation in parallel with the current one.

Syntax 

  .anima_with(new_class: AnimaDeclaration, delay = 0)
new_class AnimaDeclaration required
The new AnimaDeclaration class to chain with the current one
delay float optional
The delay to apply before starting the new animation. If negative, it anticipates the animation
Default: 0

Example 

  (
    Anima.Grid(Vector2(2, 2), 0.1)
    .anima_scale_x(0.8)
    .anima_with()
    .anima_fade_in()
    .play()
)

This will animate the node scaling it while fading it in.

  (
    Anima.Grid(Vector2(2, 2), 0.1)
    .anima_scale_x(0.8)
    .anima_with(Anima.Grid($another_node))
    .anima_fade_in()
    .play()
)

This will animate the node scaling it and fade in $another_node at the same time.

anima_then

Executes the next animation after the current one has completed.

Syntax 

  .anima_then(new_class: AnimaDeclaration, delay = 0)
new_class AnimaDeclaration required
The new AnimaDeclaration class to chain with the current one
delay float optional
The delay to apply before starting the new animation. If negative, it anticipates the animation
Default: 0

Example 

  (
    Anima.Grid(Vector2(2, 2), 0.1)
    .anima_fade_in()
    .anima_then()
    .anima_scale_x(0.8)
    .play()
)

This will animate the node fading it in and then scaling it

  (
    Anima.Grid(Vector2(2, 2), 0.1)
    .anima_scale_x(0.8)
    .anima_then(Anima.Grid($another_node))
    .anima_fade_in()
    .play()
)

This will animate the node scaling it and then fade in $another_node.