Style tweaks (#2406)

* Note the namechange of egui::color to egui::ecolor

* Use a solid triangle for collapsing headers and windows

* Add Shadow::NONE

* Add Visuals::panel_fill, window_fill and window_stroke

* Bug fix: ComboBox::width sets the outer width of the ComboBox

* egui_extras::Table: add functions to access the `Ui` for the header/body

* ComboBox: use solid triangle

* Tweak default menu margin

* Nudge panel separator lines so they stay visible

* Update changelogs

CHANGELOG.md

@@ -25,6 +25,7 @@ NOTE: [`epaint`](crates/epaint/CHANGELOG.md), [`eframe`](crates/eframe/CHANGELOG
 * Added `Area::pivot` and `Window::pivot` which controls what part of the window to position ([#2303](https://github.com/emilk/egui/pull/2303)).
 * Added support for [thin space](https://en.wikipedia.org/wiki/Thin_space).
 * Added optional integration with [AccessKit](https://accesskit.dev/) for implementing platform accessibility APIs ([#2294](https://github.com/emilk/egui/pull/2294)).
+* Added `panel_fill`, `window_fill` and `window_stroke` to `Visuals` for your theming pleasure ([#2406](https://github.com/emilk/egui/pull/2406)).
 * Plots:
   * Allow linking plot cursors ([#1722](https://github.com/emilk/egui/pull/1722)).
   * Added `Plot::auto_bounds_x/y` and `Plot::reset` ([#2029](https://github.com/emilk/egui/pull/2029)).
@@ -36,6 +37,7 @@ NOTE: [`epaint`](crates/epaint/CHANGELOG.md), [`eframe`](crates/eframe/CHANGELOG
 * Panels always have a separator line, but no stroke on other sides. Their spacing has also changed slightly ([#2261](https://github.com/emilk/egui/pull/2261)).
 * Tooltips are only shown when mouse pointer is still ([#2263](https://github.com/emilk/egui/pull/2263)).
 * Make it slightly easier to click buttons ([#2304](https://github.com/emilk/egui/pull/2304)).
+* `egui::color` has been renamed `egui::ecolor` ([#2399](https://github.com/emilk/egui/pull/2399)).
 
 ### Fixed 🐛
 * ⚠️ BREAKING: Fix text being too small ([#2069](https://github.com/emilk/egui/pull/2069)).
@@ -52,6 +54,7 @@ NOTE: [`epaint`](crates/epaint/CHANGELOG.md), [`eframe`](crates/eframe/CHANGELOG
 * Fix bug in `plot::Line::fill` ([#2275](https://github.com/emilk/egui/pull/2275)).
 * Only emit `changed` events in `radio_value` and `selectable_value` if the value actually changed ([#2343](https://github.com/emilk/egui/pull/2343)).
 * Fixed sizing bug in `Grid` ([#2384](https://github.com/emilk/egui/pull/2384)).
+* `ComboBox::width` now correctly sets the outer width ([#2406](https://github.com/emilk/egui/pull/2406)).
 
 
 ## 0.19.0 - 2022-08-20

crates/egui/src/containers/collapsing_header.rs

@@ -311,7 +311,6 @@ impl<'ui, HeaderRet> HeaderResponse<'ui, HeaderRet> {
 /// Paint the arrow icon that indicated if the region is open or not
 pub fn paint_default_icon(ui: &mut Ui, openness: f32, response: &Response) {
     let visuals = ui.style().interact(response);
-    let stroke = visuals.fg_stroke;
 
     let rect = response.rect;
 
@@ -325,7 +324,11 @@ pub fn paint_default_icon(ui: &mut Ui, openness: f32, response: &Response) {
         *p = rect.center() + rotation * (*p - rect.center());
     }
 
-    ui.painter().add(Shape::closed_line(points, stroke));
+    ui.painter().add(Shape::convex_polygon(
+        points,
+        visuals.fg_stroke.color,
+        Stroke::NONE,
+    ));
 }
 
 /// A function that paints an icon indicating if the region is open or not

crates/egui/src/containers/combo_box.rs

@@ -77,7 +77,7 @@ impl ComboBox {
         }
     }
 
-    /// Set the width of the button and menu
+    /// Set the outer width of the button and menu.
     pub fn width(mut self, width: f32) -> Self {
         self.width = Some(width);
         self
@@ -261,15 +261,20 @@ fn combo_box_dyn<'c, R>(
             AboveOrBelow::Above
         };
 
+    let margin = ui.spacing().button_padding;
     let button_response = button_frame(ui, button_id, is_popup_open, Sense::click(), |ui| {
         // We don't want to change width when user selects something new
-        let full_minimum_width = wrap_enabled
-            .then(|| ui.available_width() - ui.spacing().item_spacing.x * 2.0)
-            .unwrap_or_else(|| ui.spacing().slider_width);
+        let full_minimum_width = if wrap_enabled {
+            ui.available_width() - ui.spacing().item_spacing.x * 2.0
+        } else {
+            ui.spacing().slider_width - 2.0 * margin.x
+        };
         let icon_size = Vec2::splat(ui.spacing().icon_width);
-        let wrap_width = wrap_enabled
-            .then(|| ui.available_width() - ui.spacing().item_spacing.x - icon_size.x)
-            .unwrap_or(f32::INFINITY);
+        let wrap_width = if wrap_enabled {
+            ui.available_width() - ui.spacing().item_spacing.x - icon_size.x
+        } else {
+            f32::INFINITY
+        };
 
         let galley =
             selected_text.into_galley(ui, Some(wrap_enabled), wrap_width, TextStyle::Button);
@@ -396,16 +401,18 @@ fn paint_default_icon(
     match above_or_below {
         AboveOrBelow::Above => {
             // Upward pointing triangle
-            painter.add(Shape::closed_line(
+            painter.add(Shape::convex_polygon(
                 vec![rect.left_bottom(), rect.right_bottom(), rect.center_top()],
-                visuals.fg_stroke,
+                visuals.fg_stroke.color,
+                Stroke::NONE,
             ));
         }
         AboveOrBelow::Below => {
             // Downward pointing triangle
-            painter.add(Shape::closed_line(
+            painter.add(Shape::convex_polygon(
                 vec![rect.left_top(), rect.right_top(), rect.center_bottom()],
-                visuals.fg_stroke,
+                visuals.fg_stroke.color,
+                Stroke::NONE,
             ));
         }
     }

crates/egui/src/containers/frame.rs

@@ -45,15 +45,15 @@ impl Frame {
     pub fn side_top_panel(style: &Style) -> Self {
         Self {
             inner_margin: Margin::symmetric(8.0, 2.0),
-            fill: style.visuals.window_fill(),
+            fill: style.visuals.panel_fill,
             ..Default::default()
         }
     }
 
     pub fn central_panel(style: &Style) -> Self {
         Self {
             inner_margin: Margin::same(8.0),
-            fill: style.visuals.window_fill(),
+            fill: style.visuals.panel_fill,
             ..Default::default()
         }
     }

crates/egui/src/containers/panel.rs

@@ -306,7 +306,10 @@ impl SidePanel {
                 Stroke::NONE
             };
             // TODO(emilk): draw line on top of all panels in this ui when https://github.com/emilk/egui/issues/1516 is done
-            let resize_x = side.opposite().side_x(rect);
+            // In the meantime: nudge the line so its inside the panel, so it won't be covered by neighboring panel
+            // (hence the shrink).
+            let resize_x = side.opposite().side_x(rect.shrink(1.0));
+            let resize_x = ui.painter().round_to_pixel(resize_x);
             ui.painter().vline(resize_x, rect.y_range(), stroke);
         }
 
@@ -755,7 +758,10 @@ impl TopBottomPanel {
                 Stroke::NONE
             };
             // TODO(emilk): draw line on top of all panels in this ui when https://github.com/emilk/egui/issues/1516 is done
-            let resize_y = side.opposite().side_y(rect);
+            // In the meantime: nudge the line so its inside the panel, so it won't be covered by neighboring panel
+            // (hence the shrink).
+            let resize_y = side.opposite().side_y(rect.shrink(1.0));
+            let resize_y = ui.painter().round_to_pixel(resize_y);
             ui.painter().hline(rect.x_range(), resize_y, stroke);
         }