Refactor: move debug options out of Visuals

CHANGELOG.md

@@ -16,7 +16,7 @@ NOTE: `eframe`, `egui_web` and `egui_glium` has their own changelogs!
 * Add the option to restrict the dragging bounds of `Window` and `Area` to a specified area using `drag_bounds(rect)`.
 * Add support for small and raised text.
 * Add `ui.set_row_height`.
-* Add `Visuals::debug_widgets` to debug layouting by hovering widgets.
+* Add `DebugOptions::show_widgets` to debug layouting by hovering widgets.
 * Add `ComboBox` to more easily customize combo boxes.
 * Add `Slider::new` and `DragValue::new` to replace old type-specific constructors.
 
@@ -210,7 +210,7 @@ NOTE: `eframe`, `egui_web` and `egui_glium` has their own changelogs!
   * Undo edtis in a `TextEdit`.
   * You can now check if a `TextEdit` lost keyboard focus with `response.lost_focus`.
   * Added `ui.text_edit_singleline` and `ui.text_edit_multiline`.
-* You can now debug why your `Ui` is unexpectedly wide with `ui.style_mut().visuals.debug_expand_width = true;`
+* You can now debug why your `Ui` is unexpectedly wide with `ui.style_mut().debug.show_expand_width = true;`
 
 ### Changed 🔧
 * Pressing enter in a single-line `TextEdit` will now surrender keyboard focus for it.

egui/src/containers/resize.rs

@@ -299,7 +299,7 @@ impl Resize {
 
         ui.memory().resize.insert(id, state);
 
-        if ui.ctx().style().visuals.debug_resize {
+        if ui.ctx().style().debug.show_resize {
             ui.ctx().debug_painter().debug_rect(
                 Rect::from_min_size(content_ui.min_rect().left_top(), state.desired_size),
                 Color32::GREEN,

egui/src/grid.rs

@@ -149,8 +149,8 @@ impl GridLayout {
     }
 
     pub(crate) fn advance(&mut self, cursor: &mut Rect, frame_rect: Rect, widget_rect: Rect) {
-        let debug_expand_width = self.style.visuals.debug_expand_width;
+        let debug_expand_width = self.style.debug.show_expand_width;
-        let debug_expand_height = self.style.visuals.debug_expand_height;
+        let debug_expand_height = self.style.debug.show_expand_height;
         if debug_expand_width || debug_expand_height {
             let rect = widget_rect;
             let too_wide = rect.width() > self.prev_col_width(self.col);

egui/src/style.rs

@@ -28,6 +28,9 @@ pub struct Style {
 
     /// How many seconds a typical animation should last
     pub animation_time: f32,
+
+    /// Options to help debug why egui behaves strangely.
+    pub debug: DebugOptions,
 }
 
 impl Style {
@@ -178,16 +181,6 @@ pub struct Visuals {
 
     /// Allow child widgets to be just on the border and still have a stroke with some thickness
     pub clip_rect_margin: f32,
-
-    // -----------------------------------------------
-    // Debug rendering:
-    /// however over widgets to see their rectangles
-    pub debug_widgets: bool,
-    /// Show which widgets make their parent wider
-    pub debug_expand_width: bool,
-    /// Show which widgets make their parent higher
-    pub debug_expand_height: bool,
-    pub debug_resize: bool,
 }
 
 impl Visuals {
@@ -283,6 +276,19 @@ impl WidgetVisuals {
     }
 }
 
+/// Options for help debug egui by adding extra visualization
+#[derive(Clone, Copy, Debug, Default, PartialEq)]
+#[cfg_attr(feature = "persistence", derive(serde::Deserialize, serde::Serialize))]
+pub struct DebugOptions {
+    /// However over widgets to see their rectangles
+    pub show_widgets: bool,
+    /// Show which widgets make their parent wider
+    pub show_expand_width: bool,
+    /// Show which widgets make their parent higher
+    pub show_expand_height: bool,
+    pub show_resize: bool,
+}
+
 // ----------------------------------------------------------------------------
 
 impl Default for Style {
@@ -294,6 +300,7 @@ impl Default for Style {
             interaction: Interaction::default(),
             visuals: Visuals::default(),
             animation_time: 1.0 / 12.0,
+            debug: Default::default(),
         }
     }
 }
@@ -342,10 +349,6 @@ impl Visuals {
             text_cursor_width: 2.0,
             text_cursor_preview: false,
             clip_rect_margin: 3.0, // should be at least half the size of the widest frame stroke + max WidgetVisuals::expansion
-            debug_widgets: false,
-            debug_expand_width: false,
-            debug_expand_height: false,
-            debug_resize: false,
         }
     }
 
@@ -478,6 +481,7 @@ impl Style {
             interaction,
             visuals,
             animation_time,
+            debug,
         } = self;
 
         visuals.light_dark_radio_buttons(ui);
@@ -488,10 +492,16 @@ impl Style {
                 ui.radio_value(body_text_style, value, format!("{:?}", value));
             }
         });
+        ui.add(
+            Slider::new(animation_time, 0.0..=1.0)
+                .text("animation durations")
+                .suffix(" s"),
+        );
+
         ui.collapsing("📏 Spacing", |ui| spacing.ui(ui));
         ui.collapsing("☝ Interaction", |ui| interaction.ui(ui));
         ui.collapsing("🎨 Visuals", |ui| visuals.ui(ui));
-        ui.add(Slider::new(animation_time, 0.0..=1.0).text("animation_time"));
+        ui.collapsing("⁉ Debug", |ui| debug.ui(ui));
 
         ui.vertical_centered(|ui| reset_button(ui, self));
     }
@@ -655,10 +665,6 @@ impl Visuals {
             text_cursor_width,
             text_cursor_preview,
             clip_rect_margin,
-            debug_widgets,
-            debug_expand_width,
-            debug_expand_height,
-            debug_resize,
         } = self;
 
         ui.collapsing("widgets", |ui| widgets.ui(ui));
@@ -686,19 +692,29 @@ impl Visuals {
         ui.checkbox(text_cursor_preview, "text_cursor_preview");
         ui.add(Slider::new(clip_rect_margin, 0.0..=20.0).text("clip_rect_margin"));
 
-        ui.group(|ui| {
+        ui.vertical_centered(|ui| reset_button(ui, self));
-            ui.label("DEBUG:");
+    }
-            ui.checkbox(debug_widgets, "Show widget bounds on hover");
+}
-            ui.checkbox(
+
-                debug_expand_width,
+impl DebugOptions {
-                "Show which widgets make their parent wider",
+    pub fn ui(&mut self, ui: &mut crate::Ui) {
-            );
+        let Self {
-            ui.checkbox(
+            show_widgets: debug_widgets,
-                debug_expand_height,
+            show_expand_width: debug_expand_width,
-                "Show which widgets make their parent higher",
+            show_expand_height: debug_expand_height,
-            );
+            show_resize: debug_resize,
-            ui.checkbox(debug_resize, "Debug Resize");
+        } = self;
-        });
+
+        ui.checkbox(debug_widgets, "Show widget bounds on hover");
+        ui.checkbox(
+            debug_expand_width,
+            "Show which widgets make their parent wider",
+        );
+        ui.checkbox(
+            debug_expand_height,
+            "Show which widgets make their parent higher",
+        );
+        ui.checkbox(debug_resize, "Debug Resize");
 
         ui.vertical_centered(|ui| reset_button(ui, self));
     }

egui/src/ui.rs

@@ -600,14 +600,14 @@ impl Ui {
 
         let rect = self.allocate_space_impl(desired_size);
 
-        if self.visuals().debug_widgets && self.rect_contains_pointer(rect) {
+        if self.style().debug.show_widgets && self.rect_contains_pointer(rect) {
             let painter = self.ctx().debug_painter();
             painter.rect_stroke(rect, 4.0, (1.0, Color32::LIGHT_BLUE));
             self.placer.debug_paint_cursor(&painter);
         }
 
-        let debug_expand_width = self.visuals().debug_expand_width;
+        let debug_expand_width = self.style().debug.show_expand_width;
-        let debug_expand_height = self.visuals().debug_expand_height;
+        let debug_expand_height = self.style().debug.show_expand_height;
 
         if (debug_expand_width && too_wide) || (debug_expand_height && too_high) {
             self.painter
@@ -665,7 +665,7 @@ impl Ui {
         let item_spacing = self.spacing().item_spacing;
         self.placer.advance_after_rects(rect, rect, item_spacing);
 
-        if self.visuals().debug_widgets && self.rect_contains_pointer(rect) {
+        if self.style().debug.show_widgets && self.rect_contains_pointer(rect) {
             let painter = self.ctx().debug_painter();
             painter.rect_stroke(rect, 4.0, (1.0, Color32::LIGHT_BLUE));
             self.placer.debug_paint_cursor(&painter);
@@ -710,7 +710,7 @@ impl Ui {
         self.placer
             .advance_after_rects(final_frame, final_child_rect, item_spacing);
 
-        if self.visuals().debug_widgets && self.rect_contains_pointer(final_frame) {
+        if self.style().debug.show_widgets && self.rect_contains_pointer(final_frame) {
             let painter = self.ctx().debug_painter();
             painter.rect_stroke(frame_rect, 4.0, (1.0, Color32::LIGHT_BLUE));
             painter.rect_stroke(final_child_rect, 4.0, (1.0, Color32::LIGHT_BLUE));
@@ -1396,7 +1396,7 @@ impl Ui {
         let item_spacing = self.spacing().item_spacing;
         self.placer.advance_after_rects(rect, rect, item_spacing);
 
-        if self.visuals().debug_widgets && self.rect_contains_pointer(rect) {
+        if self.style().debug.show_widgets && self.rect_contains_pointer(rect) {
             let painter = self.ctx().debug_painter();
             painter.rect_stroke(rect, 4.0, (1.0, Color32::LIGHT_BLUE));
             self.placer.debug_paint_cursor(&painter);