From 6ca11aff8cd08fc1b60f16014b4d502012c977f5 Mon Sep 17 00:00:00 2001 From: Emil Ernerfeldt Date: Sat, 5 Sep 2020 13:30:04 +0200 Subject: [PATCH] [refactor] use "fg_" prefix in WidgetStyle --- egui/src/containers/collapsing_header.rs | 4 +-- egui/src/containers/resize.rs | 2 +- egui/src/containers/scroll_area.rs | 2 +- egui/src/containers/window.rs | 2 +- egui/src/demos/toggle_switch.rs | 8 +++--- egui/src/menu.rs | 2 +- egui/src/style.rs | 35 ++++++++++++++---------- egui/src/widgets.rs | 29 ++++++++++---------- egui/src/widgets/slider.rs | 4 +-- egui/src/widgets/text_edit.rs | 2 +- 10 files changed, 48 insertions(+), 42 deletions(-) diff --git a/egui/src/containers/collapsing_header.rs b/egui/src/containers/collapsing_header.rs index 9caede297..cf043a33d 100644 --- a/egui/src/containers/collapsing_header.rs +++ b/egui/src/containers/collapsing_header.rs @@ -105,7 +105,7 @@ impl State { /// Paint the arrow icon that indicated if the region is open or not pub fn paint_icon(ui: &mut Ui, openness: f32, response: &Response) { - let stroke = ui.style().interact(response).stroke; + let stroke = ui.style().interact(response).fg_stroke; let rect = response.rect; @@ -224,7 +224,7 @@ impl CollapsingHeader { text_pos, galley, label.text_style_or_default(ui.style()), - ui.style().interact(&response).stroke.color, + ui.style().interact(&response).text_color(), ); painter.set( diff --git a/egui/src/containers/resize.rs b/egui/src/containers/resize.rs index c4999f21c..de9a247f5 100644 --- a/egui/src/containers/resize.rs +++ b/egui/src/containers/resize.rs @@ -270,7 +270,7 @@ impl Resize { use crate::paint::Stroke; pub fn paint_resize_corner(ui: &mut Ui, response: &Response) { - let stroke = ui.style().interact(response).stroke; + let stroke = ui.style().interact(response).fg_stroke; paint_resize_corner_with_style(ui, &response.rect, stroke); } diff --git a/egui/src/containers/scroll_area.rs b/egui/src/containers/scroll_area.rs index aa520efb8..105240e4b 100644 --- a/egui/src/containers/scroll_area.rs +++ b/egui/src/containers/scroll_area.rs @@ -237,7 +237,7 @@ impl Prepared { } let style = ui.style(); - let handle_fill = style.interact(&response).main_fill; + let handle_fill = style.interact(&response).fg_fill; let handle_stroke = style.interact(&response).bg_stroke; ui.painter().add(paint::PaintCmd::Rect { diff --git a/egui/src/containers/window.rs b/egui/src/containers/window.rs index cffbb5c6d..3189b553d 100644 --- a/egui/src/containers/window.rs +++ b/egui/src/containers/window.rs @@ -711,7 +711,7 @@ fn close_button(ui: &mut Ui, rect: Rect) -> Response { let response = ui.interact(rect, close_id, Sense::click()); ui.expand_to_include_child(response.rect); - let stroke = ui.style().interact(&response).stroke; + let stroke = ui.style().interact(&response).fg_stroke; ui.painter() .line_segment([rect.left_top(), rect.right_bottom()], stroke); ui.painter() diff --git a/egui/src/demos/toggle_switch.rs b/egui/src/demos/toggle_switch.rs index 12c4cede8..c5893390b 100644 --- a/egui/src/demos/toggle_switch.rs +++ b/egui/src/demos/toggle_switch.rs @@ -27,7 +27,7 @@ pub fn toggle(ui: &mut Ui, on: &mut bool) -> Response { // We can follow the standard style theme by asking // "how should something that is being interacted with be painted?". // This gives us visual style change when the user hovers and clicks on the widget. - let style = ui.style().interact(&response); + let visuals = ui.style().interact(&response); let off_color = Rgba::new(0.0, 0.0, 0.0, 0.0); let on_color = Rgba::new(0.0, 0.5, 0.0, 0.5); // All coordinates are in screen coordinates (not relative) @@ -37,15 +37,15 @@ pub fn toggle(ui: &mut Ui, on: &mut bool) -> Response { rect, corner_radius: radius, fill: lerp(off_color..=on_color, how_on).into(), - stroke: style.bg_stroke, + stroke: visuals.bg_stroke, }); // Animate the circle from left to right: let circle_x = lerp((rect.left() + radius)..=(rect.right() - radius), how_on); ui.painter().add(PaintCmd::Circle { center: pos2(circle_x, rect.center().y), radius: 0.75 * radius, - fill: style.main_fill, - stroke: style.stroke, + fill: visuals.fg_fill, + stroke: visuals.fg_stroke, }); // All done! Return the response so the user can check what happened diff --git a/egui/src/menu.rs b/egui/src/menu.rs index d96938b61..55cd9d9c3 100644 --- a/egui/src/menu.rs +++ b/egui/src/menu.rs @@ -108,7 +108,7 @@ fn menu_impl<'c>( let mut button = Button::new(title); if bar_state.open_menu == Some(menu_id) { - button = button.fill(Some(ui.style().visuals.interacted.active.main_fill)); + button = button.fill(Some(ui.style().visuals.interacted.active.fg_fill)); } let button_response = ui.add(button); diff --git a/egui/src/style.rs b/egui/src/style.rs index 78a102b92..9e38d2542 100644 --- a/egui/src/style.rs +++ b/egui/src/style.rs @@ -148,6 +148,7 @@ impl Interacted { } } +/// bg = background, fg = foreground. #[derive(Clone, Copy, Debug)] #[cfg_attr(feature = "serde", derive(serde::Deserialize, serde::Serialize))] pub struct WidgetVisuals { @@ -163,10 +164,16 @@ pub struct WidgetVisuals { /// Fill color of the interactive part of a component (slider grab, checkbox, ...) /// When you need a fill. - pub main_fill: Srgba, // TODO: just fill? + pub fg_fill: Srgba, /// Stroke and text color of the interactive part of a component (button text, slider grab, check-mark, ...) - pub stroke: Stroke, + pub fg_stroke: Stroke, +} + +impl WidgetVisuals { + pub fn text_color(&self) -> Srgba { + self.fg_stroke.color + } } // ---------------------------------------------------------------------------- @@ -235,29 +242,29 @@ impl Default for Interacted { bg_fill: Srgba::black_alpha(128), bg_stroke: Stroke::new(2.0, WHITE), corner_radius: 4.0, - main_fill: srgba(120, 120, 200, 255), - stroke: Stroke::new(2.0, WHITE), + fg_fill: srgba(120, 120, 200, 255), + fg_stroke: Stroke::new(2.0, WHITE), }, hovered: WidgetVisuals { bg_fill: Rgba::luminance_alpha(0.06, 0.5).into(), bg_stroke: Stroke::new(1.0, Rgba::white_alpha(0.5)), corner_radius: 4.0, - main_fill: srgba(100, 100, 150, 255), - stroke: Stroke::new(1.5, Srgba::gray(240)), + fg_fill: srgba(100, 100, 150, 255), + fg_stroke: Stroke::new(1.5, Srgba::gray(240)), }, inactive: WidgetVisuals { bg_fill: Rgba::luminance_alpha(0.04, 0.5).into(), bg_stroke: Stroke::new(1.0, Rgba::white_alpha(0.04)), corner_radius: 4.0, - main_fill: srgba(60, 60, 80, 255), - stroke: Stroke::new(0.5, Srgba::gray(200)), // Should NOT look grayed out! + fg_fill: srgba(60, 60, 80, 255), + fg_stroke: Stroke::new(0.5, Srgba::gray(200)), // Should NOT look grayed out! }, disabled: WidgetVisuals { bg_fill: TRANSPARENT, bg_stroke: Stroke::new(0.5, Srgba::gray(70)), corner_radius: 4.0, - main_fill: srgba(50, 50, 50, 255), - stroke: Stroke::new(0.5, Srgba::gray(128)), // Should look grayed out + fg_fill: srgba(50, 50, 50, 255), + fg_stroke: Stroke::new(0.5, Srgba::gray(128)), // Should look grayed out }, } } @@ -367,15 +374,15 @@ impl WidgetVisuals { bg_fill, bg_stroke, corner_radius, - main_fill, - stroke, + fg_fill, + fg_stroke, } = self; ui_color(ui, bg_fill, "bg_fill"); bg_stroke.ui(ui, "bg_stroke"); ui.add(Slider::f32(corner_radius, 0.0..=10.0).text("corner_radius")); - ui_color(ui, main_fill, "main_fill"); - stroke.ui(ui, "stroke"); + ui_color(ui, fg_fill, "fg_fill"); + fg_stroke.ui(ui, "fg_stroke"); } } diff --git a/egui/src/widgets.rs b/egui/src/widgets.rs index b48bdcb3e..9c64fdb82 100644 --- a/egui/src/widgets.rs +++ b/egui/src/widgets.rs @@ -305,8 +305,7 @@ impl Widget for Button { fill, stroke: ui.style().interact(&response).bg_stroke, }); - let stroke_color = ui.style().interact(&response).stroke.color; - let text_color = text_color.unwrap_or(stroke_color); + let text_color = text_color.unwrap_or_else(|| ui.style().interact(&response).text_color()); ui.painter() .galley(text_cursor, galley, text_style, text_color); response @@ -364,6 +363,7 @@ impl<'a> Widget for Checkbox<'a> { *checked = !*checked; } + let visuals = ui.style().interact(&response); let text_cursor = pos2( response.rect.min.x + button_padding.x + icon_width, response.rect.center().y - 0.5 * galley.size.y, @@ -371,13 +371,11 @@ impl<'a> Widget for Checkbox<'a> { let (small_icon_rect, big_icon_rect) = ui.style().spacing.icon_rectangles(response.rect); ui.painter().add(PaintCmd::Rect { rect: big_icon_rect, - corner_radius: ui.style().interact(&response).corner_radius, - fill: ui.style().interact(&response).bg_fill, - stroke: ui.style().interact(&response).bg_stroke, + corner_radius: visuals.corner_radius, + fill: visuals.bg_fill, + stroke: visuals.bg_stroke, }); - let stroke = ui.style().interact(&response).stroke; - if *checked { ui.painter().add(PaintCmd::Path { points: vec![ @@ -386,12 +384,12 @@ impl<'a> Widget for Checkbox<'a> { pos2(small_icon_rect.right(), small_icon_rect.top()), ], closed: false, - stroke, fill: Default::default(), + stroke: visuals.fg_stroke, }); } - let text_color = text_color.unwrap_or(stroke.color); + let text_color = text_color.unwrap_or(visuals.text_color()); ui.painter() .galley(text_cursor, galley, text_style, text_color); response @@ -449,8 +447,7 @@ impl Widget for RadioButton { response.rect.center().y - 0.5 * galley.size.y, ); - let bg_fill = ui.style().interact(&response).bg_fill; - let stroke_color = ui.style().interact(&response).stroke.color; + let visuals = ui.style().interact(&response); let (small_icon_rect, big_icon_rect) = ui.style().spacing.icon_rectangles(response.rect); @@ -459,20 +456,22 @@ impl Widget for RadioButton { painter.add(PaintCmd::Circle { center: big_icon_rect.center(), radius: big_icon_rect.width() / 2.0, - fill: bg_fill, - stroke: ui.style().interact(&response).bg_stroke, + fill: visuals.bg_fill, + stroke: visuals.bg_stroke, }); if checked { painter.add(PaintCmd::Circle { center: small_icon_rect.center(), radius: small_icon_rect.width() / 3.0, - fill: stroke_color, + fill: visuals.fg_stroke.color, // Intentional to use stroke and not fill stroke: Default::default(), + // fill: visuals.fg_fill, + // stroke: visuals.fg_stroke, }); } - let text_color = text_color.unwrap_or(stroke_color); + let text_color = text_color.unwrap_or_else(|| visuals.text_color()); painter.galley(text_cursor, galley, text_style, text_color); response } diff --git a/egui/src/widgets/slider.rs b/egui/src/widgets/slider.rs index 4b99ad067..b3480b695 100644 --- a/egui/src/widgets/slider.rs +++ b/egui/src/widgets/slider.rs @@ -185,8 +185,8 @@ impl<'a> Slider<'a> { ui.painter().add(PaintCmd::Circle { center: pos2(marker_center_x, rail_rect.center().y), radius: handle_radius(rect), - fill: ui.style().interact(response).main_fill, - stroke: ui.style().interact(response).stroke, + fill: ui.style().interact(response).fg_fill, + stroke: ui.style().interact(response).fg_stroke, }); } } diff --git a/egui/src/widgets/text_edit.rs b/egui/src/widgets/text_edit.rs index e34cb63a8..b88ac072a 100644 --- a/egui/src/widgets/text_edit.rs +++ b/egui/src/widgets/text_edit.rs @@ -209,7 +209,7 @@ impl<'t> Widget for TextEdit<'t> { } } - let text_color = text_color.unwrap_or_else(|| ui.style().interact(&response).stroke.color); + let text_color = text_color.unwrap_or_else(|| ui.style().interact(&response).text_color()); painter.galley(response.rect.min, galley, text_style, text_color); ui.memory().text_edit.insert(id, state); response