Tween Children of Containers when Child Added/Removed

[dannymate]

When a child is removed from a container such as the HBoxContainer its other children snap to their new positions.

It would be nice if there was a way we could override or augment how we want our children to be moved into their new positions. This could also be expanded to include tweening for container resizes.

Options I can think of:

• Event/Method that provides a List/Dict with the Child Control and its calculated new position. e.g. MoveChildren(Dict<Control, Vector2>). It could return a Tween or void.
• Containers would have exposed properties that reflect the different things that could be animated with some kind of TweenResource that could be plugged into it.
• A single Container type that is specifically for this purpose that uses one of the above options.

Problems:

• Container resizing such as a GridContainer. This would have to take place before/same-frame children are moved if it isn't already.
• Not all containers serve the same purpose as the Box or Grid containers. Would something like the PanelContainer benefit from this?

Interested in what others think. Currently the kind of solutions are to create your own container system or just make non-contained control nodes that use invisible container layout as a positioning refererence. The Containers are built around static children.

I had a discussion about this on the GodotForums.

[AThousandShips]

Since this is so generic I think it's best implemented by using custom functionality, as someone already pointed out:

Containers are meant and optimized for general control layouts. The thing you're asking for goes a bit beyond this and on the other hand it's not very hard to implement on your own.

My suggestion would be to simply add a Spacer custom control which can be animated in the way you wish and replace the removed object with that, and if adding first add the spacer and then replace it

[dannymate]

Oh I see then tween the spacer spacing? Clever.

[dannymate]

Also quick sidenote do you use C# with Godot?

The TweenProperty method :

PropertyTweener Tween.TweenProperty(GodotObject @object, NodePath property, Variant finalVal, double duration)

Should it not use a PropertyName instead of a NodePath?

I use PropertyName.Position.ToString() for example at the moment to set what Property I want to tween.

[Phoenixkaze]

You could use string directly like what you do in gdscript. "position", "position:x" will do the trick. Just don't use C# style names (like Position)

[dannymate]

Looking at how sorting works in a GridContainer.

A NOTIFICATION_SORT_CHILDREN notification is sent, set in the Container class.
This calls the _notification method and falls into the NOTIFICATION_SORT_CHILDREN case.
It does a bunch of calculations and at the end of the case the Containers fit_child_in_rect method.
That does more calcs and GUI stuff then sets the childs rect with the child controls set_rect method.
The set_rect calls the _compute_offsets method which finally sets the childs position.

Not sure where what I want would fit in here really. I'd want all the children and their calculated positions available to be acted upon and that's not really how the logic works. Not sure where the results I'd want are I assume at the very end in the _compute_offsets is where the results I'd want are finally calculated. As always it's more complicated than at first thought.

[Phoenixkaze]

I am facing the same problem but I have come up with a workaround.

Of course the key is sort_children signal or SortChildren event. You might have found that the position of the newly added children of a container is not calculated until the signal or event fired. So I get the actual position of the last children in the slot / event handler and tween it.

For example. I'm making a chat app like UI. I want to play a fly-in tween when new message is added to the container. Here is what I have done:

private void MessageContainer_SortChildren()
{
    if (messageContainer.GetChildren().Count == 0)
    {
        return;
    }
    var lastChildren = messageContainer.GetChildren().Last() as Control;
    var actualPosition = lastChildren.Position;
    // Only tween x here, so I keep the y
    // Actually only y matters here. Cuz the x is always 0
    lastChildren.Position = new Vector2(-100f, actualPosition.Y);
    var tween = GetTree().CreateTween();
    tween.TweenProperty(lastChildren, "position:x", 0, 0.5f);
}

Well it works just fine (at least for my purpose). But I am always looking for a more proper way to do this.