Skills

Bevy 2d Animation

Bevy ECS skill for 2D sprite animation.

Install

npx skills add thedivergentai/Game-Dev-Agentic-Skills --skill bevy-2d-animation -g -a claude-code -y
Category
Design
Updated
19d ago
License
LGPL-3.0
Context cost
Mediumabout 2,336 tokens
Runs scripts
No, instructions only

What it does

Bevy ECS skill for 2D sprite animation. Keywords: Bevy, sprite, animation, AnimationPlayer, AnimationClip, 2D.

Bevy 2D animation

When to use

Load this when a 2D actor needs clip playback on a sprite entity. Pair with bevy-animation for the player and clip types. Pair with bevy-animation-graph when clips must blend.

ECS shape

  • Components: Sprite (bevy::sprite) on the visible entity. AnimationPlayer and AnimationTargetId / AnimatedBy (bevy::animation) link a clip to that entity.
  • Resources: clip assets are AnimationClip handles, not a global player.
  • Systems: advance_animations and animate_targets are the engine systems named on the animation page. Gameplay code should not reimplement them.
  • Schedule: those systems are engine-owned. Gameplay that reacts to a finished clip chains after them.

Playback choices

NeedBevy idiom
Frame cellsSprite with texture_atlas: Some(TextureAtlas { .. }), or an AnimationClip curve.
Named cutout limbAnimationTargetId::from_name / from_names selects which entity a curve writes.
LoopActiveAnimation::repeat sets RepeatAnimation::Forever.

Scope

  • Frame sheets use Sprite::from_atlas_image and TextureAtlas. Clip curves use animated_field! plus AnimatableCurve.
  • A cutout limb is an entity with AnimationTargetId and AnimatedBy pointing at the entity that owns AnimationPlayer.

Examples

Atlas frame on a sprite. TextureAtlas.index is the cell.

fn spawn_sheet(
    mut commands: Commands,
    assets: Res<AssetServer>,
    mut layouts: ResMut<Assets<TextureAtlasLayout>>,
) {
    let layout = TextureAtlasLayout::from_grid(UVec2::splat(32), 4, 1, None, None);
    let layout = layouts.add(layout);
    let image = assets.load("actor.png");
    commands.spawn((
        Sprite::from_atlas_image(image, TextureAtlas { layout, index: 0 }),
        FrameClock {
            timer: Timer::from_seconds(0.12, TimerMode::Repeating),
            frames: 4,
        },
    ));
}
Read the whole SKILL.md on GitHub

More in Design