anima icon indicating copy to clipboard operation
anima copied to clipboard

Access node specific properties during grid/group animations

Open johnnyneverwalked opened this issue 3 years ago • 4 comments

It would be nice to be able to access specific properties of the current iterating node while performing a group or grid animation.

For example:

anima.then({
  grid = $VBoxContainer,
  grid_size = Vector2(3, 3),
  animation_type = Anima.GRID.FROM_CENTER,
  property = "modulate",
  to = Color.red,
  duration = 0.3
})
anima.then({
  grid = $VBoxContainer,
  grid_size = Vector2(3, 3),
  animation_type = Anima.GRID.FROM_CENTER,
  property = "modulate",
  from = Color.red,
  to = "myCell:modulate",
  iteratee = "myCell"
  duration = 0.3
})

The iteratee field could contain the cell that is being animated and by using ":" you get the value of the cell's property at the time before the animation starts. In the above example every cell would animate from red to their current modulate color which could be used to create a "red wave" animation on the grid, and then returning each cell's color to its original value assuming they all have a different one.

This is just a thought I had, of course it doesn't have to be implemented that specific way if at all. :)

johnnyneverwalked avatar Sep 10 '21 08:09 johnnyneverwalked

What do you think about making the "to" parameter optional? For example:

anima.then({
  grid = $VBoxContainer,
  grid_size = Vector2(3, 3),
  animation_type = Anima.GRID.FROM_CENTER,
  property = "modulate",
  from = Color.red,
  duration = 0.3
})

each cell animated will animate from red to their colour before the animation started.

In addition I could also implement something like this:

anima.then({
  grid = $VBoxContainer,
  grid_size = Vector2(3, 3),
  animation_type = Anima.GRID.FROM_CENTER,
  property = "modulate",
  from = Color.red,
  to = ":my_custom_value",
  duration = 0.3
})

where my_custom_value is a property of the node. This would allow having a "dynamic" to (and from) value not linked to the "property" animated and will also work for animating a single node, not only grids.

ceceppa avatar Sep 16 '21 13:09 ceceppa

This would be amazing! It can add an incredible amount of versatility

johnnyneverwalked avatar Sep 16 '21 17:09 johnnyneverwalked

@johnnyneverwalked I just pushed a WIP version of the addon that address the request in this issue:

  1. Both from and to are optional, if not specified the current node value will be used instead
  2. A dynamic value can be passed to both from and to parameters, for example:
var anima: AnimaNode = Anima.begin(self)

anima.then({ node = $Node, to = ":size:x", duration = 0.3 })

:size:x is going to be replaced with the component width value.

You can also pass a formula, for example: - :size:x + :size:y * 50, or access to any property of the node.

You can also retrieve a parameter from another node, for example:

var anima: AnimaNode = Anima.begin(self)

anima.then({ node = $Node, to = "./AnotherNode:size:x", duration = 0.3 })

ceceppa avatar Dec 17 '21 15:12 ceceppa

Here the initial documentation of how "Dynamic values" work:

https://anima.ceceppa.me/docs/docs/tutorial-extras/dynamic-value/

ceceppa avatar Mar 23 '22 13:03 ceceppa