mirror of
https://github.com/bevyengine/bevy
synced 2024-11-29 16:10:19 +00:00
603cb439d9
# Objective - This PR adds support for blend modes to the PBR `StandardMaterial`. <img width="1392" alt="Screenshot 2022-11-18 at 20 00 56" src="https://user-images.githubusercontent.com/418473/202820627-0636219a-a1e5-437a-b08b-b08c6856bf9c.png"> <img width="1392" alt="Screenshot 2022-11-18 at 20 01 01" src="https://user-images.githubusercontent.com/418473/202820615-c8d43301-9a57-49c4-bd21-4ae343c3e9ec.png"> ## Solution - The existing `AlphaMode` enum is extended, adding three more modes: `AlphaMode::Premultiplied`, `AlphaMode::Add` and `AlphaMode::Multiply`; - All new modes are rendered in the existing `Transparent3d` phase; - The existing mesh flags for alpha mode are reorganized for a more compact/efficient representation, and new values are added; - `MeshPipelineKey::TRANSPARENT_MAIN_PASS` is refactored into `MeshPipelineKey::BLEND_BITS`. - `AlphaMode::Opaque` and `AlphaMode::Mask(f32)` share a single opaque pipeline key: `MeshPipelineKey::BLEND_OPAQUE`; - `Blend`, `Premultiplied` and `Add` share a single premultiplied alpha pipeline key, `MeshPipelineKey::BLEND_PREMULTIPLIED_ALPHA`. In the shader, color values are premultiplied accordingly (or not) depending on the blend mode to produce the three different results after PBR/tone mapping/dithering; - `Multiply` uses its own independent pipeline key, `MeshPipelineKey::BLEND_MULTIPLY`; - Example and documentation are provided. --- ## Changelog ### Added - Added support for additive and multiplicative blend modes in the PBR `StandardMaterial`, via `AlphaMode::Add` and `AlphaMode::Multiply`; - Added support for premultiplied alpha in the PBR `StandardMaterial`, via `AlphaMode::Premultiplied`;
378 lines
11 KiB
Rust
378 lines
11 KiB
Rust
//! This example showcases different blend modes.
|
|
//!
|
|
//! ## Controls
|
|
//!
|
|
//! | Key Binding | Action |
|
|
//! |:-------------------|:------------------------------------|
|
|
//! | `Up` / `Down` | Increase / Decrease Alpha |
|
|
//! | `Left` / `Right` | Rotate Camera |
|
|
//! | `H` | Toggle HDR |
|
|
//! | `Spacebar` | Toggle Unlit |
|
|
//! | `C` | Randomize Colors |
|
|
|
|
use bevy::prelude::*;
|
|
use rand::random;
|
|
|
|
fn main() {
|
|
let mut app = App::new();
|
|
|
|
app.add_plugins(DefaultPlugins)
|
|
.add_startup_system(setup)
|
|
.add_system(example_control_system);
|
|
|
|
// Unfortunately, MSAA and HDR are not supported simultaneously under WebGL.
|
|
// Since this example uses HDR, we must disable MSAA for WASM builds, at least
|
|
// until WebGPU is ready and no longer behind a feature flag in Web browsers.
|
|
#[cfg(target_arch = "wasm32")]
|
|
app.insert_resource(Msaa { samples: 1 }); // Default is 4 samples (MSAA on)
|
|
|
|
app.run();
|
|
}
|
|
|
|
/// set up a simple 3D scene
|
|
fn setup(
|
|
mut commands: Commands,
|
|
mut meshes: ResMut<Assets<Mesh>>,
|
|
mut materials: ResMut<Assets<StandardMaterial>>,
|
|
asset_server: Res<AssetServer>,
|
|
) {
|
|
let base_color = Color::rgba(0.9, 0.2, 0.3, 1.0);
|
|
let icosphere_mesh = meshes.add(
|
|
Mesh::try_from(shape::Icosphere {
|
|
radius: 0.9,
|
|
subdivisions: 7,
|
|
})
|
|
.unwrap(),
|
|
);
|
|
|
|
// Opaque
|
|
let opaque = commands
|
|
.spawn((
|
|
PbrBundle {
|
|
mesh: icosphere_mesh.clone(),
|
|
material: materials.add(StandardMaterial {
|
|
base_color,
|
|
alpha_mode: AlphaMode::Opaque,
|
|
..default()
|
|
}),
|
|
transform: Transform::from_xyz(-4.0, 0.0, 0.0),
|
|
..default()
|
|
},
|
|
ExampleControls {
|
|
unlit: true,
|
|
color: true,
|
|
},
|
|
))
|
|
.id();
|
|
|
|
// Blend
|
|
let blend = commands
|
|
.spawn((
|
|
PbrBundle {
|
|
mesh: icosphere_mesh.clone(),
|
|
material: materials.add(StandardMaterial {
|
|
base_color,
|
|
alpha_mode: AlphaMode::Blend,
|
|
..default()
|
|
}),
|
|
transform: Transform::from_xyz(-2.0, 0.0, 0.0),
|
|
..default()
|
|
},
|
|
ExampleControls {
|
|
unlit: true,
|
|
color: true,
|
|
},
|
|
))
|
|
.id();
|
|
|
|
// Premultiplied
|
|
let premultiplied = commands
|
|
.spawn((
|
|
PbrBundle {
|
|
mesh: icosphere_mesh.clone(),
|
|
material: materials.add(StandardMaterial {
|
|
base_color,
|
|
alpha_mode: AlphaMode::Premultiplied,
|
|
..default()
|
|
}),
|
|
transform: Transform::from_xyz(0.0, 0.0, 0.0),
|
|
..default()
|
|
},
|
|
ExampleControls {
|
|
unlit: true,
|
|
color: true,
|
|
},
|
|
))
|
|
.id();
|
|
|
|
// Add
|
|
let add = commands
|
|
.spawn((
|
|
PbrBundle {
|
|
mesh: icosphere_mesh.clone(),
|
|
material: materials.add(StandardMaterial {
|
|
base_color,
|
|
alpha_mode: AlphaMode::Add,
|
|
..default()
|
|
}),
|
|
transform: Transform::from_xyz(2.0, 0.0, 0.0),
|
|
..default()
|
|
},
|
|
ExampleControls {
|
|
unlit: true,
|
|
color: true,
|
|
},
|
|
))
|
|
.id();
|
|
|
|
// Multiply
|
|
let multiply = commands
|
|
.spawn((
|
|
PbrBundle {
|
|
mesh: icosphere_mesh,
|
|
material: materials.add(StandardMaterial {
|
|
base_color,
|
|
alpha_mode: AlphaMode::Multiply,
|
|
..default()
|
|
}),
|
|
transform: Transform::from_xyz(4.0, 0.0, 0.0),
|
|
..default()
|
|
},
|
|
ExampleControls {
|
|
unlit: true,
|
|
color: true,
|
|
},
|
|
))
|
|
.id();
|
|
|
|
// Chessboard Plane
|
|
let black_material = materials.add(Color::BLACK.into());
|
|
let white_material = materials.add(Color::WHITE.into());
|
|
let plane_mesh = meshes.add(shape::Plane { size: 2.0 }.into());
|
|
|
|
for x in -3..4 {
|
|
for z in -3..4 {
|
|
commands.spawn((
|
|
PbrBundle {
|
|
mesh: plane_mesh.clone(),
|
|
material: if (x + z) % 2 == 0 {
|
|
black_material.clone()
|
|
} else {
|
|
white_material.clone()
|
|
},
|
|
transform: Transform::from_xyz(x as f32 * 2.0, -1.0, z as f32 * 2.0),
|
|
..default()
|
|
},
|
|
ExampleControls {
|
|
unlit: false,
|
|
color: true,
|
|
},
|
|
));
|
|
}
|
|
}
|
|
|
|
// Light
|
|
commands.spawn(PointLightBundle {
|
|
transform: Transform::from_xyz(4.0, 8.0, 4.0),
|
|
..default()
|
|
});
|
|
|
|
// Camera
|
|
commands.spawn(Camera3dBundle {
|
|
transform: Transform::from_xyz(0.0, 2.5, 10.0).looking_at(Vec3::ZERO, Vec3::Y),
|
|
..default()
|
|
});
|
|
|
|
// Controls Text
|
|
let text_style = TextStyle {
|
|
font: asset_server.load("fonts/FiraMono-Medium.ttf"),
|
|
font_size: 18.0,
|
|
color: Color::BLACK,
|
|
};
|
|
|
|
let label_text_style = TextStyle {
|
|
font: asset_server.load("fonts/FiraMono-Medium.ttf"),
|
|
font_size: 25.0,
|
|
color: Color::ORANGE,
|
|
};
|
|
|
|
commands.spawn(
|
|
TextBundle::from_section(
|
|
"Up / Down — Increase / Decrease Alpha\nLeft / Right — Rotate Camera\nH - Toggle HDR\nSpacebar — Toggle Unlit\nC — Randomize Colors",
|
|
text_style.clone(),
|
|
)
|
|
.with_style(Style {
|
|
position_type: PositionType::Absolute,
|
|
position: UiRect {
|
|
top: Val::Px(10.0),
|
|
left: Val::Px(10.0),
|
|
..default()
|
|
},
|
|
..default()
|
|
}),
|
|
);
|
|
|
|
commands.spawn((
|
|
TextBundle::from_section("", text_style).with_style(Style {
|
|
position_type: PositionType::Absolute,
|
|
position: UiRect {
|
|
top: Val::Px(10.0),
|
|
right: Val::Px(10.0),
|
|
..default()
|
|
},
|
|
..default()
|
|
}),
|
|
ExampleDisplay,
|
|
));
|
|
|
|
commands.spawn((
|
|
TextBundle::from_section("┌─ Opaque\n│\n│\n│\n│", label_text_style.clone()).with_style(
|
|
Style {
|
|
position_type: PositionType::Absolute,
|
|
..default()
|
|
},
|
|
),
|
|
ExampleLabel { entity: opaque },
|
|
));
|
|
|
|
commands.spawn((
|
|
TextBundle::from_section("┌─ Blend\n│\n│\n│", label_text_style.clone()).with_style(Style {
|
|
position_type: PositionType::Absolute,
|
|
..default()
|
|
}),
|
|
ExampleLabel { entity: blend },
|
|
));
|
|
|
|
commands.spawn((
|
|
TextBundle::from_section("┌─ Premultiplied\n│\n│", label_text_style.clone()).with_style(
|
|
Style {
|
|
position_type: PositionType::Absolute,
|
|
..default()
|
|
},
|
|
),
|
|
ExampleLabel {
|
|
entity: premultiplied,
|
|
},
|
|
));
|
|
|
|
commands.spawn((
|
|
TextBundle::from_section("┌─ Add\n│", label_text_style.clone()).with_style(Style {
|
|
position_type: PositionType::Absolute,
|
|
..default()
|
|
}),
|
|
ExampleLabel { entity: add },
|
|
));
|
|
|
|
commands.spawn((
|
|
TextBundle::from_section("┌─ Multiply", label_text_style).with_style(Style {
|
|
position_type: PositionType::Absolute,
|
|
..default()
|
|
}),
|
|
ExampleLabel { entity: multiply },
|
|
));
|
|
}
|
|
|
|
#[derive(Component)]
|
|
struct ExampleControls {
|
|
unlit: bool,
|
|
color: bool,
|
|
}
|
|
|
|
#[derive(Component)]
|
|
struct ExampleLabel {
|
|
entity: Entity,
|
|
}
|
|
|
|
struct ExampleState {
|
|
alpha: f32,
|
|
unlit: bool,
|
|
}
|
|
|
|
#[derive(Component)]
|
|
struct ExampleDisplay;
|
|
|
|
impl Default for ExampleState {
|
|
fn default() -> Self {
|
|
ExampleState {
|
|
alpha: 0.9,
|
|
unlit: false,
|
|
}
|
|
}
|
|
}
|
|
|
|
#[allow(clippy::too_many_arguments)]
|
|
fn example_control_system(
|
|
mut materials: ResMut<Assets<StandardMaterial>>,
|
|
controllable: Query<(&Handle<StandardMaterial>, &ExampleControls)>,
|
|
mut camera: Query<(&mut Camera, &mut Transform, &GlobalTransform), With<Camera3d>>,
|
|
mut labels: Query<(&mut Style, &ExampleLabel)>,
|
|
mut display: Query<&mut Text, With<ExampleDisplay>>,
|
|
labelled: Query<&GlobalTransform>,
|
|
mut state: Local<ExampleState>,
|
|
time: Res<Time>,
|
|
input: Res<Input<KeyCode>>,
|
|
) {
|
|
if input.pressed(KeyCode::Up) {
|
|
state.alpha = (state.alpha + time.delta_seconds()).min(1.0);
|
|
} else if input.pressed(KeyCode::Down) {
|
|
state.alpha = (state.alpha - time.delta_seconds()).max(0.0);
|
|
}
|
|
|
|
if input.just_pressed(KeyCode::Space) {
|
|
state.unlit = !state.unlit;
|
|
}
|
|
|
|
let randomize_colors = input.just_pressed(KeyCode::C);
|
|
|
|
for (material_handle, controls) in &controllable {
|
|
let mut material = materials.get_mut(material_handle).unwrap();
|
|
material.base_color.set_a(state.alpha);
|
|
|
|
if controls.color && randomize_colors {
|
|
material.base_color.set_r(random());
|
|
material.base_color.set_g(random());
|
|
material.base_color.set_b(random());
|
|
}
|
|
if controls.unlit {
|
|
material.unlit = state.unlit;
|
|
}
|
|
}
|
|
|
|
let (mut camera, mut camera_transform, camera_global_transform) = camera.single_mut();
|
|
|
|
if input.just_pressed(KeyCode::H) {
|
|
camera.hdr = !camera.hdr;
|
|
}
|
|
|
|
let rotation = if input.pressed(KeyCode::Left) {
|
|
time.delta_seconds()
|
|
} else if input.pressed(KeyCode::Right) {
|
|
-time.delta_seconds()
|
|
} else {
|
|
0.0
|
|
};
|
|
|
|
camera_transform.rotate_around(
|
|
Vec3::ZERO,
|
|
Quat::from_euler(EulerRot::XYZ, 0.0, rotation, 0.0),
|
|
);
|
|
|
|
for (mut style, label) in &mut labels {
|
|
let world_position =
|
|
labelled.get(label.entity).unwrap().translation() + Vec3::new(0.0, 1.0, 0.0);
|
|
|
|
let viewport_position = camera
|
|
.world_to_viewport(camera_global_transform, world_position)
|
|
.unwrap();
|
|
|
|
style.position.bottom = Val::Px(viewport_position.y);
|
|
style.position.left = Val::Px(viewport_position.x);
|
|
}
|
|
|
|
let mut display = display.single_mut();
|
|
display.sections[0].value = format!(
|
|
" HDR: {}\nAlpha: {:.2}",
|
|
if camera.hdr { "ON " } else { "OFF" },
|
|
state.alpha
|
|
);
|
|
}
|