How can I use .pngs as textures and respect the alpha channel?

[Saetch]

Hello!
This is probably an easy question to answer, but I tried looking around in the docs and I didn't find the solution.

I'm trying to simply render a bunch of sprites in a 2D view and for that I basically wanted to combine the sprites and shapes2D examples together. However I ran into a problem as soon as I tried to use another .png in the sprites example's code.
The alpha channel seems to be ignored and where it should be transparent, it's just black.

What I tried looks pretty much like the sprite example still:

    let mut img: CpuTexture = three_d_asset::io::load_async(&["assets/img/MyPng.png"])
        .await
        .unwrap()
        .deserialize("")
        .unwrap();
    img.data.to_linear_srgb();
    
    let material = ColorMaterial {
        color: Srgba::WHITE,
        texture: Some(Texture2DRef::from_cpu_texture(&context, &img)),
        ..Default::default()
    }; 

I inspected the img.data TextureData and it is TextureData::RgbaU8.

when I render like this:

    frame_input
            .screen()
            .clear(ClearState::color_and_depth(0.8, 0.8, 0.8, 1.0, 1.0))
            .render(
                &camera,
                Gm {
                        geometry: &sprites,
                        material: &material,
                    }.into_iter(),
                &[&ambient],
            );

it shows the .png that I loaded, but it ignores the alpha and just makes all the transparent parts completely black.
I tried setting the is_transparent value from ColorMaterial to true, but that didn't work.
I'm guessing that it is the Texture2DRef part? But I am struggling to figure out what to do to actually make it work with the alpha channel.

Thanks for any help :)

[asny]

Hi. It's not necessarily easy, transparency in a rasterizer is always a lot of trouble unfortunately 🙂 however, I think I have an idea what is wrong. You are maybe missing setting the blend mode of the material. You can either use the ColorMaterial::new_transparent method or look at the code in that method and copy the parts you are missing. Let me know if it works 🙏

[Saetch]

@asny
Thanks for the help! It was surprisingly easy and it works now :)
My updated ColorMaterial creation looks like this in case anyone else stumbles over this:

    let mut img: CpuTexture = three_d_asset::io::load_async(&["assets/img/MyPng.png"])
        .await
        .unwrap()
        .deserialize("")
        .unwrap();
    //img.data.to_linear_srgb();   <-- this used to be here in the example but is covered in the ColorMaterial::new_transparent function and shouldn't be done twice or it will make the colors way too dark

    let cpu_material = CpuMaterial {
        albedo: Srgba::WHITE,
        albedo_texture: Some(img.clone()),
        ..Default::default()
    };
    let material = ColorMaterial::new_transparent(&context, &cpu_material);