[spacing] simplify and tweak spacing

egui/src/containers/collapsing_header.rs

@@ -193,7 +193,6 @@ impl CollapsingHeader {
         );
         desired_size = desired_size.at_least(ui.style().spacing.interact_size);
         let rect = ui.allocate_space(desired_size);
-        let rect = rect.expand2(ui.style().spacing.button_expand);
 
         let response = ui.interact(rect, id, Sense::click());
         let text_pos = pos2(text_pos.x, response.rect.center().y - galley.size.y / 2.0);

egui/src/menu.rs

@@ -71,7 +71,7 @@ pub fn bar<R>(ui: &mut Ui, add_contents: impl FnOnce(&mut Ui) -> R) -> (R, Rect)
             ui.set_style(style);
 
             // Take full width and fixed height:
-            let height = ui.style().spacing.menu_bar_height;
+            let height = ui.style().spacing.interact_size.y;
             ui.set_desired_height(height);
             ui.expand_to_size(vec2(ui.available().width(), height));
 

egui/src/style.rs

@@ -42,11 +42,6 @@ pub struct Spacing {
     /// Button size is text size plus this on each side
     pub button_padding: Vec2,
 
-    /// Expand buttons by this much *after* allocating them.
-    /// This is then mostly a visual change (but also makes them easier to hit with the mouse).
-    /// This allows for compact layout where buttons actually eat into item_spacing a bit
-    pub button_expand: Vec2, // TODO: remove
-
     /// Indent collapsing regions etc by this much.
     pub indent: f32,
 
@@ -59,10 +54,12 @@ pub struct Spacing {
     pub slider_width: f32, // TODO: rename big_interact_size ?
 
     /// Checkboxes, radio button and collapsing headers have an icon at the start.
-    /// The text starts after this many pixels.
+    /// This is the width/height of this icon.
     pub icon_width: f32,
 
-    pub menu_bar_height: f32,
+    /// Checkboxes, radio button and collapsing headers have an icon at the start.
+    /// This is the spacing between the icon and the text
+    pub icon_spacing: f32,
 }
 
 impl Spacing {
@@ -198,15 +195,14 @@ impl Default for Style {
 impl Default for Spacing {
     fn default() -> Self {
         Self {
-            item_spacing: vec2(8.0, 5.0),
+            item_spacing: vec2(8.0, 3.0),
             window_padding: vec2(6.0, 6.0),
-            button_padding: vec2(4.0, 1.0),
+            button_padding: vec2(3.0, 1.0),
-            button_expand: vec2(0.0, 0.0), // TODO: remove
+            indent: 25.0,
-            indent: 21.0,
+            interact_size: vec2(40.0, 20.0),
-            interact_size: vec2(40.0, 20.0), // TODO: larger interact_size.y
             slider_width: 140.0,
-            icon_width: 20.0,      // TODO: replace with interact_size.y ?
+            icon_width: 16.0,
-            menu_bar_height: 20.0, // TODO: replace with interact_size.y ?
+            icon_spacing: 1.0,
         }
     }
 }
@@ -318,24 +314,22 @@ impl Spacing {
             item_spacing,
             window_padding,
             button_padding,
-            button_expand,
             indent,
             interact_size,
             slider_width,
             icon_width,
-            menu_bar_height,
+            icon_spacing,
         } = self;
 
         ui_slider_vec2(ui, item_spacing, 0.0..=10.0, "item_spacing");
         ui_slider_vec2(ui, window_padding, 0.0..=10.0, "window_padding");
         ui_slider_vec2(ui, button_padding, 0.0..=10.0, "button_padding");
-        ui_slider_vec2(ui, button_expand, 0.0..=10.0, "button_expand");
         ui_slider_vec2(ui, interact_size, 0.0..=60.0, "interact_size")
             .tooltip_text("Minimum size of an interactive widget");
         ui.add(Slider::f32(indent, 0.0..=100.0).text("indent"));
         ui.add(Slider::f32(slider_width, 0.0..=1000.0).text("slider_width"));
         ui.add(Slider::f32(icon_width, 0.0..=60.0).text("icon_width"));
-        ui.add(Slider::f32(menu_bar_height, 0.0..=60.0).text("menu_bar_height"));
+        ui.add(Slider::f32(icon_spacing, 0.0..=10.0).text("icon_spacing"));
     }
 }
 

egui/src/widgets/color_picker.rs

@@ -57,7 +57,6 @@ fn show_srgba(ui: &mut Ui, srgba: Srgba, desired_size: Vec2) -> Response {
 fn color_button(ui: &mut Ui, color: Srgba) -> Response {
     let desired_size = ui.style().spacing.interact_size;
     let rect = ui.allocate_space(desired_size);
-    let rect = rect.expand2(ui.style().spacing.button_expand);
     let id = ui.make_position_id();
     let response = ui.interact(rect, id, Sense::click());
     let visuals = ui.style().interact(&response);

egui/src/widgets/mod.rs

@@ -293,18 +293,18 @@ impl Widget for Button {
         let mut desired_size = galley.size + 2.0 * ui.style().spacing.button_padding;
         desired_size = desired_size.at_least(ui.style().spacing.interact_size);
         let rect = ui.allocate_space(desired_size);
-        let rect = rect.expand2(ui.style().spacing.button_expand);
 
         let response = ui.interact(rect, id, sense);
+        let style = ui.style().interact(&response);
         let text_cursor = response.rect.center() - 0.5 * galley.size;
-        let fill = fill.unwrap_or(ui.style().interact(&response).bg_fill);
+        let fill = fill.unwrap_or(style.bg_fill);
         ui.painter().add(PaintCmd::Rect {
             rect: response.rect,
-            corner_radius: ui.style().interact(&response).corner_radius,
+            corner_radius: style.corner_radius,
             fill,
-            stroke: ui.style().interact(&response).bg_stroke,
+            stroke: style.bg_stroke,
         });
-        let text_color = text_color.unwrap_or_else(|| ui.style().interact(&response).text_color());
+        let text_color = text_color.unwrap_or_else(|| style.text_color());
         ui.painter()
             .galley(text_cursor, galley, text_style, text_color);
         response
@@ -352,13 +352,10 @@ impl<'a> Widget for Checkbox<'a> {
 
         let spacing = &ui.style().spacing;
         let icon_width = spacing.icon_width;
-        let horizontal_spacing = 0.0; //spacing.item_spacing.x
+        let icon_spacing = ui.style().spacing.icon_spacing;
         let button_padding = spacing.button_padding;
-        let mut desired_size = button_padding
+        let mut desired_size =
-            + vec2(icon_width, 0.0)
+            button_padding + vec2(icon_width + icon_spacing, 0.0) + galley.size + button_padding;
-            + vec2(horizontal_spacing, 0.0)
-            + galley.size
-            + button_padding;
         desired_size = desired_size.at_least(spacing.interact_size);
         let rect = ui.allocate_space(desired_size);
 
@@ -369,7 +366,7 @@ impl<'a> Widget for Checkbox<'a> {
 
         let visuals = ui.style().interact(&response);
         let text_cursor = pos2(
-            response.rect.min.x + button_padding.x + icon_width,
+            response.rect.min.x + button_padding.x + icon_width + icon_spacing,
             response.rect.center().y - 0.5 * galley.size.y,
         );
         let (small_icon_rect, big_icon_rect) = ui.style().spacing.icon_rectangles(response.rect);
@@ -438,16 +435,17 @@ impl Widget for RadioButton {
         let galley = font.layout_multiline(text, ui.available().width());
 
         let icon_width = ui.style().spacing.icon_width;
+        let icon_spacing = ui.style().spacing.icon_spacing;
         let button_padding = ui.style().spacing.button_padding;
         let mut desired_size =
-            button_padding + vec2(icon_width, 0.0) + galley.size + button_padding;
+            button_padding + vec2(icon_width + icon_spacing, 0.0) + galley.size + button_padding;
         desired_size = desired_size.at_least(ui.style().spacing.interact_size);
         let rect = ui.allocate_space(desired_size);
 
         let response = ui.interact(rect, id, Sense::click());
 
         let text_cursor = pos2(
-            response.rect.min.x + button_padding.x + icon_width,
+            response.rect.min.x + button_padding.x + icon_width + icon_spacing,
             response.rect.center().y - 0.5 * galley.size.y,
         );