migrations/egui
1
0
Fork 0
mirror of https://github.com/emilk/egui.git synced 2026-09-01 22:30:03 -04:00
Code Activity

CSS-like shadows with offset, spread, and blur (#4232)

Browse Source 
This makes `epaint::Shadow` more like CSS's box-shadow, adding `offset`
and replacing `extrusion` with `blur` and `spread`.

* Closes https://github.com/emilk/egui/pull/3047

The offsets make for nice drop-shadow effects.

Old shadows:
<img width="1447" alt="old-shadows"
src="https://github.com/emilk/egui/assets/1148717/8a30f7b9-fb9d-49ea-9a2f-9367a60c448a">

New shadows:
<img width="1447" alt="new-shadows-full"
src="https://github.com/emilk/egui/assets/1148717/28cc9c1e-b0de-4c5b-a705-22e52c556584">
This commit is contained in:
Emil Ernerfeldt
2024-03-26 10:37:12 +01:00
committed by GitHub
parent 1634554032
commit c530504a04
4 changed files with 120 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
crates/egui/src/widgets/mod.rs
View File

@@ -126,15 +126,44 @@ pub fn stroke_ui(ui: &mut crate::Ui, stroke: &mut epaint::Stroke, text: &str) {
}
pub(crate) fn shadow_ui(ui: &mut Ui, shadow: &mut epaint::Shadow, text: &str) {
let epaint::Shadow { extrusion, color } = shadow;
ui.horizontal(|ui| {
ui.label(text);
ui.add(
DragValue::new(extrusion)
.speed(1.0)
.clamp_range(0.0..=100.0),
)
.on_hover_text("Extrusion");
let epaint::Shadow {
offset,
blur,
spread,
color,
} = shadow;
ui.label(text);
ui.indent(text, |ui| {
crate::Grid::new("shadow_ui").show(ui, |ui| {
ui.add(
DragValue::new(&mut offset.x)
.speed(1.0)
.clamp_range(-100.0..=100.0)
.prefix("x: "),
);
ui.add(
DragValue::new(&mut offset.y)
.speed(1.0)
.clamp_range(-100.0..=100.0)
.prefix("y: "),
);
ui.end_row();
ui.add(
DragValue::new(blur)
.speed(1.0)
.clamp_range(0.0..=100.0)
.prefix("Blur:"),
);
ui.add(
DragValue::new(spread)
.speed(1.0)
.clamp_range(0.0..=100.0)
.prefix("Spread:"),
);
});
ui.color_edit_button_srgba(color);
});
}