Use sprite sheet for pieces

[nelson137]

Using a sprite sheet for the captures UI assets would be convenient as that is how chess.com is implemented. Unfortunately, an ImageBundle can't use sprites because it requires a Handle<Image>. Because of this, the assets PNGs were created by loading the sprite sheet into image editing software and exporting each sprite as its own image.

If bevy ever allows sprites to be used in an ImageBundle then it should be done like that.

---

Texture Atlas

const ATLAS_SIZE: Vec2 = vec2(683.0, 611.0);

const CAPTURED_PIECE_TEXTURES: &[Rect] = &[
    // Black pawns
    // both y's increase by 50, max.x decreases by 14
    Rect { min: Vec2::new(0.0, 0.0), max: Vec2::new(124.0, 36.0) }, // 8 black pawns
    Rect { min: Vec2::new(0.0, 50.0), max: Vec2::new(110.0, 86.0) }, // 7 black pawns
    Rect { min: Vec2::new(0.0, 100.0), max: Vec2::new(96.0, 136.0) }, // 6 black pawns
    Rect { min: Vec2::new(0.0, 150.0), max: Vec2::new(82.0, 186.0) }, // 5 black pawns
    Rect { min: Vec2::new(0.0, 200.0), max: Vec2::new(68.0, 236.0) }, // 4 black pawns
    Rect { min: Vec2::new(0.0, 250.0), max: Vec2::new(54.0, 286.0) }, // 3 black pawns
    Rect { min: Vec2::new(0.0, 300.0), max: Vec2::new(40.0, 336.0) }, // 2 black pawns
    Rect { min: Vec2::new(0.0, 350.0), max: Vec2::new(26.0, 386.0) }, // 1 black pawn
    // Black bishops
    // both y's increase by 50, max.x decreases by 16
    Rect { min: Vec2::new(134.0, 0.0), max: Vec2::new(180.0, 36.0) }, // 2 black bishops
    Rect { min: Vec2::new(134.0, 50.0), max: Vec2::new(164.0, 86.0) }, // 1 black bishop
    // Black knights
    // both y's increase by 50, max.x decreases by 14
    Rect { min: Vec2::new(190.0, 0.0), max: Vec2::new(235.0, 36.0) }, // 2 black knights
    Rect { min: Vec2::new(190.0, 50.0), max: Vec2::new(221.0, 86.0) }, // 1 black knight
    // Black rooks
    // both y's increase by 50, max.x decreases by 15
    Rect { min: Vec2::new(240.0, 0.0), max: Vec2::new(286.0, 36.0) }, // 2 black rooks
    Rect { min: Vec2::new(240.0, 50.0), max: Vec2::new(271.0, 86.0) }, // 1 black rook
    // Black queen
    Rect { min: Vec2::new(291.0, 0.0), max: Vec2::new(322.0, 36.0) }, // 1 black queen
    // White pawns
    // both y's increase by 50, max.x decreases by 14
    Rect { min: Vec2::new(360.0, 0.0), max: Vec2::new(484.0, 36.0) }, // 8 white pawns
    Rect { min: Vec2::new(360.0, 50.0), max: Vec2::new(470.0, 86.0) }, // 7 white pawns
    Rect { min: Vec2::new(360.0, 100.0), max: Vec2::new(456.0, 136.0) }, // 6 white pawns
    Rect { min: Vec2::new(360.0, 150.0), max: Vec2::new(442.0, 186.0) }, // 5 white pawns
    Rect { min: Vec2::new(360.0, 200.0), max: Vec2::new(428.0, 236.0) }, // 4 white pawns
    Rect { min: Vec2::new(360.0, 250.0), max: Vec2::new(414.0, 286.0) }, // 3 white pawns
    Rect { min: Vec2::new(360.0, 300.0), max: Vec2::new(400.0, 336.0) }, // 2 white pawns
    Rect { min: Vec2::new(360.0, 350.0), max: Vec2::new(386.0, 386.0) }, // 1 white pawns
    // White bishops
    // both y's increase by 50, max.x decreases by 16
    Rect { min: Vec2::new(494.0, 0.0), max: Vec2::new(539.0, 36.0) }, // 2 white bishops
    Rect { min: Vec2::new(494.0, 50.0), max: Vec2::new(523.0, 86.0) }, // 1 white bishop
    // White knights
    // both y's increase by 50, max.x decreases by 14
    Rect { min: Vec2::new(550.0, 0.0), max: Vec2::new(594.0, 36.0) }, // 2 white knights
    Rect { min: Vec2::new(550.0, 50.0), max: Vec2::new(580.0, 86.0) }, // 1 white knight
    // White rooks
    // both y's increase by 50, max.x decreases by 15
    Rect { min: Vec2::new(600.0, 0.0), max: Vec2::new(645.0, 36.0) }, // 2 white rooks
    Rect { min: Vec2::new(600.0, 50.0), max: Vec2::new(630.0, 86.0) }, // 1 white rook
    // White queen
    Rect { min: Vec2::new(649.0, 0.0), max: Vec2::new(683.0, 36.0) }, // 1 white queen
];

Usage

pub fn spawn_captures(
    mut commands: Commands,
    asset_server: Res<AssetServer>,
    mut texture_atlases: ResMut<Assets<TextureAtlas>>,
) {
    let texture_atlas = texture_atlases.add(TextureAtlas {
        texture: asset_server.load("captured-pieces.png"),
        size: ATLAS_SIZE,
        textures: CAPTURED_PIECE_TEXTURES.into(),
        texture_handles: None,
    });

    // Spawn the first sprite
    commands.spawn(SpriteSheetBundle {
        texture_atlas,
        sprite: TextureAtlasSprite { index: 0, ..default() },
        ..default()
    });
}