Allow `Checkbox` style to change based on its state

3 files changed, 20 insertions, 13 deletions

diff --git a/examples/styling.rs b/examples/styling.rs
index f0edfd82..59c9c734 100644
--- a/examples/styling.rs
+++ b/examples/styling.rs
@@ -493,20 +493,27 @@ mod style {
         pub struct Checkbox;
 
         impl checkbox::StyleSheet for Checkbox {
-            fn active(&self) -> checkbox::Style {
+            fn active(&self, is_checked: bool) -> checkbox::Style {
                 checkbox::Style {
-                    background: Background::Color(SURFACE),
-                    checkmark_color: ACTIVE,
+                    background: Background::Color(if is_checked {
+                        ACTIVE
+                    } else {
+                        SURFACE
+                    }),
+                    checkmark_color: Color::WHITE,
                     border_radius: 2,
                     border_width: 1,
                     border_color: ACTIVE,
                 }
             }
 
-            fn hovered(&self) -> checkbox::Style {
+            fn hovered(&self, is_checked: bool) -> checkbox::Style {
                 checkbox::Style {
-                    background: Background::Color(Color { a: 0.5, ..SURFACE }),
-                    ..self.active()
+                    background: Background::Color(Color {
+                        a: 0.8,
+                        ..if is_checked { ACTIVE } else { SURFACE }
+                    }),
+                    ..self.active(is_checked)
                 }
             }
         }
diff --git a/style/src/checkbox.rs b/style/src/checkbox.rs
index e84dfd18..3c645f15 100644
--- a/style/src/checkbox.rs
+++ b/style/src/checkbox.rs
@@ -13,15 +13,15 @@ pub struct Style {
 
 /// A set of rules that dictate the style of a checkbox.
 pub trait StyleSheet {
-    fn active(&self) -> Style;
+    fn active(&self, is_checked: bool) -> Style;
 
-    fn hovered(&self) -> Style;
+    fn hovered(&self, is_checked: bool) -> Style;
 }
 
 struct Default;
 
 impl StyleSheet for Default {
-    fn active(&self) -> Style {
+    fn active(&self, _is_checked: bool) -> Style {
         Style {
             background: Background::Color(Color::from_rgb(0.95, 0.95, 0.95)),
             checkmark_color: Color::from_rgb(0.3, 0.3, 0.3),
@@ -31,10 +31,10 @@ impl StyleSheet for Default {
         }
     }
 
-    fn hovered(&self) -> Style {
+    fn hovered(&self, is_checked: bool) -> Style {
         Style {
             background: Background::Color(Color::from_rgb(0.90, 0.90, 0.90)),
-            ..self.active()
+            ..self.active(is_checked)
         }
     }
 }
diff --git a/wgpu/src/renderer/widget/checkbox.rs b/wgpu/src/renderer/widget/checkbox.rs
index cd90be5e..17121eea 100644
--- a/wgpu/src/renderer/widget/checkbox.rs
+++ b/wgpu/src/renderer/widget/checkbox.rs
@@ -21,9 +21,9 @@ impl checkbox::Renderer for Renderer {
         style_sheet: &Self::Style,
     ) -> Self::Output {
         let style = if is_mouse_over {
-            style_sheet.hovered()
+            style_sheet.hovered(is_checked)
         } else {
-            style_sheet.active()
+            style_sheet.active(is_checked)
         };
 
         let checkbox = Primitive::Quad {