Skip to content

Commit

Permalink
Added shadows to the stacked nodes in the ui example
Browse files Browse the repository at this point in the history
  • Loading branch information
ickshonpe committed Oct 16, 2024
1 parent b109787 commit dbd8cbd
Showing 1 changed file with 76 additions and 49 deletions.
125 changes: 76 additions & 49 deletions examples/ui/ui.rs
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ fn main() {

fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
// Camera
commands.spawn((Camera2d, IsDefaultUiCamera));
commands.spawn((Camera2d, IsDefaultUiCamera, UiBoxShadowSamples(6)));

// root node
commands
Expand Down Expand Up @@ -191,6 +191,15 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
..default()
});
});

let shadow = BoxShadow {
color: Color::BLACK.with_alpha(0.5),
blur_radius: Val::Px(2.),
x_offset: Val::Px(10.),
y_offset: Val::Px(10.),
..Default::default()
};

// render order test: reddest in the back, whitest in the front (flex center)
parent
.spawn(NodeBundle {
Expand All @@ -207,66 +216,84 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
.insert(PickingBehavior::IGNORE)
.with_children(|parent| {
parent
.spawn(NodeBundle {
style: Style {
width: Val::Px(100.0),
height: Val::Px(100.0),
.spawn((
NodeBundle {
style: Style {
width: Val::Px(100.0),
height: Val::Px(100.0),
..default()
},
background_color: Color::srgb(1.0, 0.0, 0.).into(),
..default()
},
background_color: Color::srgb(1.0, 0.0, 0.).into(),
..default()
})
shadow,
))
.with_children(|parent| {
parent.spawn(NodeBundle {
style: Style {
// Take the size of the parent node.
width: Val::Percent(100.0),
height: Val::Percent(100.0),
position_type: PositionType::Absolute,
left: Val::Px(20.),
bottom: Val::Px(20.),
parent.spawn((
NodeBundle {
style: Style {
// Take the size of the parent node.
width: Val::Percent(100.0),
height: Val::Percent(100.0),
position_type: PositionType::Absolute,
left: Val::Px(20.),
bottom: Val::Px(20.),
..default()
},
background_color: Color::srgb(1.0, 0.3, 0.3).into(),
..default()
},
background_color: Color::srgb(1.0, 0.3, 0.3).into(),
..default()
});
parent.spawn(NodeBundle {
style: Style {
width: Val::Percent(100.0),
height: Val::Percent(100.0),
position_type: PositionType::Absolute,
left: Val::Px(40.),
bottom: Val::Px(40.),
shadow,
));
parent.spawn((
NodeBundle {
style: Style {
width: Val::Percent(100.0),
height: Val::Percent(100.0),
position_type: PositionType::Absolute,
left: Val::Px(40.),
bottom: Val::Px(40.),
..default()
},
background_color: Color::srgb(1.0, 0.5, 0.5).into(),
..default()
},
background_color: Color::srgb(1.0, 0.5, 0.5).into(),
..default()
});
parent.spawn(NodeBundle {
style: Style {
width: Val::Percent(100.0),
height: Val::Percent(100.0),
position_type: PositionType::Absolute,
left: Val::Px(60.),
bottom: Val::Px(60.),
shadow,
));
parent.spawn((
NodeBundle {
style: Style {
width: Val::Percent(100.0),
height: Val::Percent(100.0),
position_type: PositionType::Absolute,
left: Val::Px(60.),
bottom: Val::Px(60.),
..default()
},
background_color: Color::srgb(0.0, 0.7, 0.7).into(),
..default()
},
background_color: Color::srgb(1.0, 0.7, 0.7).into(),
..default()
});
shadow,
));
// alpha test
parent.spawn(NodeBundle {
style: Style {
width: Val::Percent(100.0),
height: Val::Percent(100.0),
position_type: PositionType::Absolute,
left: Val::Px(80.),
bottom: Val::Px(80.),
parent.spawn((
NodeBundle {
style: Style {
width: Val::Percent(100.0),
height: Val::Percent(100.0),
position_type: PositionType::Absolute,
left: Val::Px(80.),
bottom: Val::Px(80.),
..default()
},
background_color: Color::srgba(1.0, 0.9, 0.9, 0.4).into(),
..default()
},
background_color: Color::srgba(1.0, 0.9, 0.9, 0.4).into(),
..default()
});
BoxShadow {
color: Color::BLACK.with_alpha(0.3),
..shadow
},
));
});
});
// bevy logo (flex center)
Expand Down

0 comments on commit dbd8cbd

Please sign in to comment.