[slider] refactor to break up complex ui code

egui/src/widgets/slider.rs

@@ -14,7 +14,6 @@ pub struct Slider<'a> {
     text: Option<String>,
     precision: usize,
     text_color: Option<Color>,
-    text_on_top: Option<bool>,
     id: Option<Id>,
 }
 
@@ -28,7 +27,6 @@ impl<'a> Slider<'a> {
             range,
             text: None,
             precision: 3,
-            text_on_top: None,
             text_color: None,
             id: None,
         }
@@ -105,57 +103,28 @@ impl<'a> Slider<'a> {
     }
 }
 
-impl<'a> Widget for Slider<'a> {
+fn handle_radius(rect: &Rect) -> f32 {
-    fn ui(mut self, ui: &mut Ui) -> InteractInfo {
+    rect.height() / 2.5
-        let text_style = TextStyle::Button;
-        let font = &ui.fonts()[text_style];
-
-        if let Some(text) = &self.text {
-            if self.id.is_none() {
-                self.id = Some(ui.make_unique_child_id(text));
 }
 
-            let text_on_top = self.text_on_top.unwrap_or_default();
+fn x_range(rect: &Rect) -> RangeInclusive<f32> {
-            let text_color = self.text_color.unwrap_or_else(|| ui.style().text_color);
+    let handle_radius = handle_radius(rect);
-            let value = (self.get_set_value)(None);
+    (rect.left() + handle_radius)..=(rect.right() - handle_radius)
-            let full_text = format!("{}: {:.*}", text, self.precision, value);
-
-            let slider_sans_text = Slider { text: None, ..self };
-
-            if text_on_top {
-                let galley = font.layout_single_line(full_text);
-                let pos = ui.allocate_space(galley.size).min;
-                ui.painter().galley(pos, galley, text_style, text_color);
-                slider_sans_text.ui(ui)
-            } else {
-                ui.columns(2, |columns| {
-                    // Slider on the left:
-                    let slider_response = columns[0].add(slider_sans_text);
-
-                    // Place the text in line with the slider on the left:
-                    columns[1].set_desired_height(slider_response.rect.height());
-                    columns[1].inner_layout(Layout::horizontal(Align::Center), |ui| {
-                        ui.add(Label::new(full_text).multiline(false));
-                    });
-
-                    slider_response.into()
-                })
 }
-        } else {
-            let height = font.line_spacing().max(ui.style().clickable_diameter);
-            let handle_radius = height / 2.5;
 
+impl<'a> Slider<'a> {
+    /// Just the slider, no text
+    fn allocate_slide_space(&self, ui: &mut Ui, height: f32) -> InteractInfo {
         let id = self.id.unwrap_or_else(|| ui.make_position_id());
+        let desired_size = vec2(ui.available().width(), height);
+        let rect = ui.allocate_space(desired_size);
+        ui.interact(rect, id, Sense::click_and_drag())
+    }
 
-            let size = Vec2 {
+    /// Just the slider, no text
-                x: ui.available().width(),
+    fn slider_ui(&mut self, ui: &mut Ui, interact: InteractInfo) -> InteractInfo {
-                y: height,
+        let rect = &interact.rect;
-            };
+        let x_range = x_range(rect);
-            let rect = ui.allocate_space(size);
-            let interact = ui.interact(rect, id, Sense::click_and_drag());
-
-            let left = interact.rect.left() + handle_radius;
-            let right = interact.rect.right() - handle_radius;
 
         let range = self.range.clone();
         debug_assert!(range.start() <= range.end());
@@ -164,8 +133,8 @@ impl<'a> Widget for Slider<'a> {
             if interact.active {
                 let aim_radius = ui.input().aim_radius();
                 let new_value = crate::math::smart_aim::best_in_range_f32(
-                        self.value_from_point(mouse_pos.x - aim_radius, left..=right),
+                    self.value_from_point(mouse_pos.x - aim_radius, x_range.clone()),
-                        self.value_from_point(mouse_pos.x + aim_radius, left..=right),
+                    self.value_from_point(mouse_pos.x + aim_radius, x_range.clone()),
                 );
                 self.set_value_f32(new_value);
             }
@@ -175,13 +144,12 @@ impl<'a> Widget for Slider<'a> {
         {
             let value = self.get_value_f32();
 
-                let rect = interact.rect;
+            let rail_radius = ui.painter().round_to_pixel((rect.height() / 8.0).max(2.0));
-                let rail_radius = ui.painter().round_to_pixel((height / 8.0).max(2.0));
             let rail_rect = Rect::from_min_max(
-                    pos2(interact.rect.left(), rect.center().y - rail_radius),
+                pos2(rect.left(), rect.center().y - rail_radius),
-                    pos2(interact.rect.right(), rect.center().y + rail_radius),
+                pos2(rect.right(), rect.center().y + rail_radius),
             );
-                let marker_center_x = remap_clamp(value, range, left..=right);
+            let marker_center_x = remap_clamp(value, range, x_range);
 
             ui.painter().add(PaintCmd::Rect {
                 rect: rail_rect,
@@ -192,7 +160,7 @@ impl<'a> Widget for Slider<'a> {
 
             ui.painter().add(PaintCmd::Circle {
                 center: pos2(marker_center_x, rail_rect.center().y),
-                    radius: handle_radius,
+                radius: handle_radius(rect),
                 fill: Some(ui.style().interact(&interact).fill),
                 outline: Some(LineStyle::new(
                     ui.style().interact(&interact).stroke_width,
@@ -203,5 +171,48 @@ impl<'a> Widget for Slider<'a> {
 
         interact
     }
+
+    /// Just the text label
+    fn text_ui(&mut self, ui: &mut Ui) {
+        if let Some(text) = &self.text {
+            let text_color = self.text_color.unwrap_or_else(|| ui.style().text_color);
+            let value = (self.get_set_value)(None);
+            let full_text = format!("{}: {:.*}", text, self.precision, value);
+            ui.add(
+                Label::new(full_text)
+                    .multiline(false)
+                    .text_color(text_color),
+            );
+        }
+    }
+}
+
+impl<'a> Widget for Slider<'a> {
+    fn ui(mut self, ui: &mut Ui) -> InteractInfo {
+        let text_style = TextStyle::Button;
+        let font = &ui.fonts()[text_style];
+        let height = font.line_spacing().max(ui.style().clickable_diameter);
+
+        if let Some(text) = &self.text {
+            self.id = self.id.or_else(|| Some(ui.make_unique_child_id(text)));
+
+            ui.columns(2, |columns| {
+                let slider_ui = &mut columns[0];
+                let interact = self.allocate_slide_space(slider_ui, height);
+                let slider_interact = self.slider_ui(slider_ui, interact);
+
+                // Place the text in line with the slider on the left:
+                let text_ui = &mut columns[1];
+                text_ui.set_desired_height(slider_interact.rect.height());
+                text_ui.inner_layout(Layout::horizontal(Align::Center), |ui| {
+                    self.text_ui(ui);
+                });
+
+                slider_interact
+            })
+        } else {
+            let interact = self.allocate_slide_space(ui, height);
+            self.slider_ui(ui, interact)
+        }
     }
 }