CheckboxStyle

crates/egui/src/style_trait.rs

@@ -36,8 +36,10 @@ pub struct CheckboxStyle {
     pub frame: Frame,
     /// Text next to it
     pub text: TextVisuals,
-    /// Size
-    pub size: Vec2,
+    /// Box size
+    pub size: f32,
+    /// Check size
+    pub check_size: f32,
     /// Frame of the checkbox itself
     pub checkbox_frame: Frame,
     /// Checkmark stroke
@@ -149,6 +151,7 @@ impl Style {
                 fill: visuals.bg_fill,
                 stroke: visuals.bg_stroke,
                 corner_radius: visuals.corner_radius,
+                inner_margin: self.spacing.button_padding.into(),
                 ..Default::default()
             },
             stroke: visuals.fg_stroke,
@@ -169,7 +172,23 @@ impl Style {
         }
     }
 
-    // pub fn checkbox_style(&self, state: WidgetState) -> CheckboxStylee {}
+    pub fn checkbox_style(&self, state: WidgetState) -> CheckboxStyle {
+        let visuals = self.visuals.widgets.state(state);
+        let ws = self.widget_style(state);
+        CheckboxStyle {
+            frame: ws.frame.fill(Color32::TRANSPARENT),
+            size: self.spacing.icon_width,
+            check_size: self.spacing.icon_width_inner,
+            checkbox_frame: Frame {
+                fill: visuals.weak_bg_fill,
+                corner_radius: visuals.corner_radius,
+                stroke: visuals.bg_stroke,
+                ..Default::default()
+            },
+            text: ws.text,
+            stroke: ws.stroke,
+        }
+    }
 
     pub fn label_style(&self, state: WidgetState) -> LabelStyle {
         let ws = self.widget_style(state);

crates/egui/src/widgets/checkbox.rs

@@ -55,10 +55,17 @@ impl Widget for Checkbox<'_> {
             indeterminate,
         } = self;
 
-        let spacing = &ui.spacing();
-        let icon_width = spacing.icon_width;
+        // Get the widget style by reading the rect from the previous pass
+        let id = ui.next_auto_id();
+        let response: Option<Response> = ui.ctx().read_response(id);
+        let state = response.map(|r| r.widget_state()).unwrap_or_default();
+        let style = ui.style().checkbox_style(state);
 
-        let mut min_size = Vec2::splat(spacing.interact_size.y);
+        let icon_width = style.size;
+
+        // interact_size or size ?
+        // let mut min_size = Vec2::splat(ui.spacing().interact_size.y);
+        let mut min_size = Vec2::splat(style.size);
         min_size.y = min_size.y.at_least(icon_width);
 
         // In order to center the checkbox based on min_size we set the icon height to at least min_size.y
@@ -72,6 +79,7 @@ impl Widget for Checkbox<'_> {
         let mut prepared = AtomLayout::new(atoms)
             .sense(Sense::click())
             .min_size(min_size)
+            .frame(style.frame)
             .allocate(ui);
 
         if prepared.response.clicked() {
@@ -97,17 +105,16 @@ impl Widget for Checkbox<'_> {
 
         if ui.is_rect_visible(prepared.response.rect) {
             // let visuals = ui.style().interact_selectable(&response, *checked); // too colorful
-            let visuals = *ui.style().interact(&prepared.response);
-            prepared.fallback_text_color = visuals.text_color();
+            prepared.fallback_text_color = style.text.color;
             let response = prepared.paint(ui);
 
             if let Some(rect) = response.rect(rect_id) {
                 let (small_icon_rect, big_icon_rect) = ui.spacing().icon_rectangles(rect);
                 ui.painter().add(epaint::RectShape::new(
-                    big_icon_rect.expand(visuals.expansion),
-                    visuals.corner_radius,
-                    visuals.bg_fill,
-                    visuals.bg_stroke,
+                    big_icon_rect,
+                    style.checkbox_frame.corner_radius,
+                    style.checkbox_frame.fill,
+                    style.checkbox_frame.stroke,
                     epaint::StrokeKind::Inside,
                 ));
 
@@ -116,7 +123,7 @@ impl Widget for Checkbox<'_> {
                     ui.painter().add(Shape::hline(
                         small_icon_rect.x_range(),
                         small_icon_rect.center().y,
-                        visuals.fg_stroke,
+                        style.stroke,
                     ));
                 } else if *checked {
                     // Check mark:
@@ -126,7 +133,7 @@ impl Widget for Checkbox<'_> {
                             pos2(small_icon_rect.center().x, small_icon_rect.bottom()),
                             pos2(small_icon_rect.right(), small_icon_rect.top()),
                         ],
-                        visuals.fg_stroke,
+                        style.stroke,
                     ));
                 }
             }