Animated Container
Reveal a group of UI objects with staggered scale and fade animations
Overview
Animated Container reveals a group of objects one after another using Evo Tween. Each object scales and fades back to its original appearance, making it useful for menus, cards, and lists.
Usage
Add Animated Container to the parent of the objects you want to reveal.
Leave Get Child Objects enabled to include direct children. Turn it off to use only the Container Objects list.
Adjust Start Scale, scale and fade durations, and Item Cooldown to set the pace.
Enable Play On Enable for automatic playback, or trigger Animate from a UI event.
Customization
Timing and Interaction
Animation Delay pauses before the first item starts. Item Cooldown spaces out the active items; their animations can overlap. Fade After Scale is a threshold on the eased scale progress, so 0 starts fading immediately and 0.5 waits until the scale curve reaches halfway.
Objects cannot receive input while waiting to fade. Their original CanvasGroup interaction settings return when fading begins. Enable Use Unscaled Time for menus that should animate while the game is paused.
Choosing Objects
Explicit Container Objects come first, followed by direct children when Get Child Objects is enabled. Duplicate entries are ignored, and inactive objects are skipped during playback. The list is cached during initialization; adding children afterward does not automatically include them. A CanvasGroup is added to each cached object if needed.
Playback
Start Scale is a uniform local scale, not a multiplier of each object's original scale. Playback restores the original scale and alpha. Disabling the component also restores any objects still animating. Play Once prevents another run after a sequence has started, including after disabling and re-enabling the component.
Public API
Use AnimatedContainer in the Evo.UI namespace. Configure the object list before initialization and disable Play On Enable in the Inspector when a script should control the first run.
Properties
| Name | Type | Description |
|---|---|---|
PlayedOnce | bool | Read-only; whether a sequence with active objects has started. |
IsAnimating | bool | Read-only; whether the animation tween is active. |
Fields
| Name | Type | Description |
|---|---|---|
containerObjects | List<Transform> | Objects to cache during initialization. |
animationCurve | AnimationCurve | Easing for scale progression. |
animationDelay | float | Delay before the first item, in seconds. |
startScale | float | Initial uniform local scale, clamped to 0–1 during playback. |
scaleDuration | float | Scale animation duration per item, in seconds. |
fadeAfterScale | float | Eased scale progress that starts the fade, from 0 to 1. |
fadeDuration | float | Fade duration per item, in seconds. |
itemCooldown | float | Delay between active items, in seconds. |
useUnscaledTime | bool | Ignores Time.timeScale. |
playOnEnable | bool | Starts playback whenever the component is enabled. |
playOnce | bool | Prevents playback after the first run has started. |
Methods
| Name | Parameters | Description |
|---|---|---|
Animate() | None | Starts or restarts playback. Requires an active, enabled component and respects playOnce. |
Example
using UnityEngine;
using Evo.UI;
public class AnimatedContainerExample : MonoBehaviour
{
// Disable Play On Enable in the Inspector for manual playback.
[SerializeField] private AnimatedContainer target;
private void Start()
{
target.animationDelay = 0.2f;
target.itemCooldown = 0.08f;
target.startScale = 0.7f;
target.scaleDuration = 0.25f;
target.fadeAfterScale = 0.3f;
target.fadeDuration = 0.2f;
target.useUnscaledTime = true;
target.Animate();
}
// Bind to a UI event to replay once the current animation has finished.
public void Reveal()
{
if (!target.IsAnimating)
target.Animate();
}
}