git.lucas.co / cce-ui
GPU-accelerated UI toolkit (Vulkan)
git clone https://git.lucas.co/cce-ui.git

commitba5588ac1710cf4cb30b06bee0fd749c95ef3ad1
parentfe111406d1
authorLucas Galante <[email protected]>
date2026-06-29 20:08
Rearrange spinbox button layout to put minus and plus on the right

 src/widget/input/spinbox.rs | 44 +++++++++++++++++++++-----------------------
 1 file changed, 21 insertions(+), 23 deletions(-)

diff --git a/src/widget/input/spinbox.rs b/src/widget/input/spinbox.rs
index 8d783ac..625c5f1 100644
--- a/src/widget/input/spinbox.rs
+++ b/src/widget/input/spinbox.rs
@@ -148,7 +148,7 @@ impl Element for Spinbox {
             self.hover_inc = false;
             return changed || was != self.base.hovered;
         }
-        let hd = px >= self.base.x && px < self.base.x + self.base.w * 0.225;
+        let hd = px >= self.base.x + self.base.w * 0.55 && px < self.base.x + self.base.w * 0.775;
         let hi = px >= self.base.x + self.base.w * 0.775;
         let changed = hd != self.hover_dec || hi != self.hover_inc;
         self.hover_dec = hd;
@@ -167,17 +167,18 @@ impl Element for Spinbox {
         if !self.hit_test(px, py, ctx) { return false; }
         match state {
             ElementState::Pressed => {
+                let display_w = self.base.w * 0.55;
                 let btn_w = self.base.w * 0.225;
-                let split_left = self.base.x + btn_w;
-                let split_right = self.base.x + self.base.w * 0.775;
-                if px < split_left {
+                let split_dec = self.base.x + display_w;
+                let split_inc = self.base.x + display_w + btn_w;
+                if px >= split_dec && px < split_inc {
                     let old_val = self.value;
                     self.value = (self.value - self.step).max(self.min);
                     if self.value != old_val {
                         self.just_changed = true;
                     }
                     true
-                } else if px >= split_right {
+                } else if px >= split_inc {
                     let old_val = self.value;
                     self.value = (self.value + self.step).min(self.max);
                     if self.value != old_val {
@@ -193,7 +194,7 @@ impl Element for Spinbox {
                         self.edit_buffer = self.value.to_string();
                     }
                     let char_width = 8.4;
-                    let click_idx = (((px - (split_left + 4.0)) / char_width).round() as isize)
+                    let click_idx = (((px - (self.base.x + 4.0)) / char_width).round() as isize)
                         .max(0)
                         .min(self.edit_buffer.chars().count() as isize) as usize;
                     self.cursor_idx = click_idx;
@@ -324,8 +325,8 @@ impl Element for Spinbox {
         let visual_h = self.base.h - top;
         let btn_w = self.base.w * 0.225;
         let display_w = self.base.w * 0.55;
-        let split_left = self.base.x + btn_w;
-        let split_right = self.base.x + btn_w + display_w;
+        let split_dec = self.base.x + display_w;
+        let split_inc = self.base.x + display_w + btn_w;
         let inc_col = if self.hover_inc { colors::SPINBOX_BUTTON_HOVER } else { colors::SPINBOX_BUTTON };
         let dec_col = if self.hover_dec { colors::SPINBOX_BUTTON_HOVER } else { colors::SPINBOX_BUTTON };
         
@@ -335,20 +336,20 @@ impl Element for Spinbox {
             colors::SPINBOX_DISPLAY
         };
         
-        quads.push((self.base.x, self.base.y + top, btn_w, visual_h, dec_col));
-        quads.push((split_left, self.base.y + top, display_w, visual_h, display_bg));
-        quads.push((split_right, self.base.y + top, btn_w, visual_h, inc_col));
+        quads.push((self.base.x, self.base.y + top, display_w, visual_h, display_bg));
+        quads.push((split_dec, self.base.y + top, btn_w, visual_h, dec_col));
+        quads.push((split_inc, self.base.y + top, btn_w, visual_h, inc_col));
         
         if self.editing {
             let border_color = [0.20, 0.50, 0.85, 1.0];
-            quads.push((split_left, self.base.y + top, display_w, 1.0, border_color));
-            quads.push((split_left, self.base.y + top + visual_h - 1.0, display_w, 1.0, border_color));
-            quads.push((split_left, self.base.y + top, 1.0, visual_h, border_color));
-            quads.push((split_left + display_w - 1.0, self.base.y + top, 1.0, visual_h, border_color));
+            quads.push((self.base.x, self.base.y + top, display_w, 1.0, border_color));
+            quads.push((self.base.x, self.base.y + top + visual_h - 1.0, display_w, 1.0, border_color));
+            quads.push((self.base.x, self.base.y + top, 1.0, visual_h, border_color));
+            quads.push((self.base.x + display_w - 1.0, self.base.y + top, 1.0, visual_h, border_color));
 
             let char_width = 8.4;
-            let cursor_x = split_left + 4.0 + (self.cursor_idx as f32 * char_width);
-            let max_cursor_x = split_left + display_w - 4.0;
+            let cursor_x = self.base.x + 4.0 + (self.cursor_idx as f32 * char_width);
+            let max_cursor_x = self.base.x + display_w - 4.0;
             let final_cursor_x = cursor_x.min(max_cursor_x);
             let cursor_y = self.base.y + top + (visual_h - 14.0) / 2.0;
             quads.push((final_cursor_x, cursor_y, 1.5, 14.0, [0.80, 0.80, 0.85, 1.0]));
@@ -374,12 +375,9 @@ impl Element for Spinbox {
         let top = self.base.label_offset();
         let _visual_h = self.base.h - top;
         
-        let btn_w = self.base.w * 0.225;
-        let split_left = self.base.x + btn_w;
-
         labels.push(TextLabel {
             text: value_text,
-            x: split_left + 4.0,
+            x: self.base.x + 4.0,
             y: crate::layout::align_text_y(self.base.y, self.base.h, 14.0, top),
             font_size: 14.0,
             color: [0xcc, 0xcc, 0xd4],
@@ -387,7 +385,7 @@ impl Element for Spinbox {
         if let Some(ref unit) = self.unit {
             labels.push(TextLabel {
                 text: unit.clone(),
-                x: split_left + 4.0 + 36.0,
+                x: self.base.x + 4.0 + 36.0,
                 y: crate::layout::align_text_y(self.base.y, self.base.h, 11.0, top),
                 font_size: 11.0,
                 color: [0x73, 0x73, 0x7a],
@@ -396,7 +394,7 @@ impl Element for Spinbox {
 
         labels.push(TextLabel {
             text: "-".to_string(),
-            x: self.base.x + self.base.w * 0.1125 - 4.0,
+            x: self.base.x + self.base.w * 0.6625 - 4.0,
             y: crate::layout::align_text_y(self.base.y, self.base.h, 12.0, top),
             font_size: 12.0,
             color: [0xcc, 0xcc, 0xd4],