如何在 bevy 引擎中加载部分图像

问题描述

我有一个精灵表 png 文件，其中包含一些静态精灵，如墙壁或草。如何根据它们在图像中的坐标将它们拆分为单独的精灵？

解决方法

到目前为止，您没有发布任何代码或尝试过的内容，所以我提供了一个通用的答案。

有多种选择：

• 您可以在着色器中使用 texture2DArray，如图所示的 here 或 here。
• 您可以修改网格的 UV - 坐标来完成此操作

我个人更喜欢 uv 坐标操作，使用 bevy = 0.4 的基本示例如下所示：

use bevy::prelude::*;

fn main() {
    App::build()
        .add_resource(Msaa { samples: 4 })
        .add_plugins(DefaultPlugins)
        .add_startup_system(setup.system())
        .run();
}

/// set up a simple 3D scene
fn setup(
    commands: &mut Commands,mut meshes: ResMut<Assets<Mesh>>,asset_server: Res<AssetServer>,mut materials: ResMut<Assets<StandardMaterial>>,) {

    let texture_handle = asset_server.load("textures/sprites_array.png");

    let material_handle = materials.add(StandardMaterial {
        albedo_texture: Some(texture_handle.clone()),shaded: false,..Default::default()
    });

    let mut uvs = Vec::new();
    uvs.push([0.0,1.0]);
    uvs.push([0.0,0.0]);
    uvs.push([1.0,1.0]);

    let mut mesh = Mesh::from(shape::Quad::new(Vec2::new(1.0,1.0)));
    mesh.set_attribute(Mesh::ATTRIBUTE_UV_0,uvs);

    // use only the upper left part of the texture atlas
    let mut uvs1 = Vec::new();
    uvs1.push([0.0,0.5]);
    uvs1.push([0.0,0.0]);
    uvs1.push([0.5,0.5]);

    let mut mesh1 = Mesh::from(shape::Quad::new(Vec2::new(1.0,1.0)));
    mesh1.set_attribute(Mesh::ATTRIBUTE_UV_0,uvs1);

    // use only the lower right part of the texture atlas
    let mut uvs2 = Vec::new();
    uvs2.push([0.5,1.0]);
    uvs2.push([0.5,0.5]);
    uvs2.push([1.0,1.0]);

    let mut mesh2 = Mesh::from(shape::Quad::new(Vec2::new(1.0,1.0)));
    mesh2.set_attribute(Mesh::ATTRIBUTE_UV_0,uvs2);

    // add entities to the world
    commands
        // the whole texture array
        .spawn(PbrBundle {
            mesh: meshes.add(mesh),material: material_handle.clone(),..Default::default()
        })
        // only the "first" item of the texture array
        .spawn(PbrBundle {
            mesh: meshes.add(mesh1),transform: Transform::from_translation(Vec3::new(2.0,0.0,0.0)),..Default::default()
        })
        // only the "last" item of the texture array
        .spawn(PbrBundle {
            mesh: meshes.add(mesh2),transform: Transform::from_translation(Vec3::new(-2.0,..Default::default()
        })
        // light
        .spawn(LightBundle {
            transform: Transform::from_translation(Vec3::new(4.0,8.0,4.0)),..Default::default()
        })
        // camera
        .spawn(Camera3dBundle {
            transform: Transform::from_translation(Vec3::new(0.0,5.0))
                .looking_at(Vec3::default(),Vec3::unit_y()),..Default::default()
        });
}

我使用了这个纹理数组（把它放在 assets/textures/sprites_array.png 中）：

这将导致该场景：