Bevy UI Animation

A GSAP-like animation plugin for Bevy UI.

🌌 Features

• ✅ Animate NodeBundle, ImageBundle, TextBundle, ButtonBundle
• 🚧 Timeline support
• 🚧 Bevy event support

🔮 Usage

To use this plugin, the first step is to add a dependency to your Cargo.toml:

[dependencies]
bevy_ui_animation = "1.0.0"

Add the AnimationPlugin to your main.rs:

use bevy::prelude::*;
use bevy_ui_animation::*;

App::new()
    .add_plugins(DefaultPlugins)
    .add_plugin(AnimationPlugin)
    .run();

Animate a bundle:

use bevy::prelude::*;
use bevy_ui_animation::*;

fn setup(mut commands: Commands) {
    commands.spawn_bundle(UiCameraBundle::default());
    commands
        .spawn_bundle(NodeBundle {
            style: Style {
                size: Size::new(Val::Percent(100.0), Val::Percent(100.0)),
                ..Default::default()
            },
            color: UiColor(Color::BLUE),
            transform: Transform::default(),
            ..Default::default()
        })
        .insert(Animation::new(Vars {
            style: Some(Style {
                size: Size::new(Val::Percent(50.0), Val::Percent(50.0)),
                ..Default::default()
            }),
            color: Some(UiColor(Color::RED)),
            transform: Some(Transform::from_rotation(Quat::from_rotation_z(
                180_f32.to_radians(),
            ))),
            duration: 2.0,
            ease: Ease::ExpoOut,
            repeat: true,
            yoyo: true,
            ..Default::default()
        }));
}

Preview:

You can directly run this example by:

cargo run --example all --features="bevy/bevy_winit"

✳️ Vars

📜 Animatable Components

📈 Ease

❇️ Compatibility

🙏 Thanks

• @djeedai for bevy_tweening
• @mockersf for bevy_easings
• @PistonDevelopers for interpolation

🖋 Author

miZyind mizyind@gmail.com

📇 License

Licensed under the MIT License.