Implement disabled for druid controls

CHANGELOG.md

@@ -47,6 +47,7 @@ You can find its changes [documented below](#070---2021-01-01).
 - Flex values that are less than 0.0 will default to 0.0 and warn in release. It will panic in debug mode. ([#1691] by [@arthmis])
 - Lens implemented for tuples of Lenses of length 2-8, Tuple2 removed ([#1654] by [@Maan2003])
 - Window size and positioning code is now in display points ([#1713] by [@jneem])
+- Update look and feel of controls when disabled ([#1717] by [@xarvic])
 
 ### Deprecated
 
@@ -680,6 +681,7 @@ Last release without a changelog :(
 [#1698]: https://github.com/linebender/druid/pull/1698
 [#1702]: https://github.com/linebender/druid/pull/1702
 [#1713]: https://github.com/linebender/druid/pull/1713
+[#1717]: https://github.com/linebender/druid/pull/1717
 
 [Unreleased]: https://github.com/linebender/druid/compare/v0.7.0...master
 [0.7.0]: https://github.com/linebender/druid/compare/v0.6.0...v0.7.0

druid/src/text/input_component.rs

@@ -273,38 +273,45 @@ impl<T: TextStorage + EditableText> Widget<T> for TextComponent<T> {
     fn event(&mut self, ctx: &mut EventCtx, event: &Event, data: &mut T, env: &Env) {
         match event {
             Event::MouseDown(mouse) if self.can_write() => {
-                ctx.set_active(true);
-                // ensure data is up to date before a click
-                let needs_rebuild = self
-                    .borrow()
-                    .layout
-                    .text()
-                    .map(|old| !old.same(data))
-                    .unwrap_or(true);
-                if needs_rebuild {
-                    self.borrow_mut().layout.set_text(data.clone());
-                    self.borrow_mut().layout.rebuild_if_needed(ctx.text(), env);
+                if !ctx.is_disabled() {
+                    ctx.set_active(true);
+                    // ensure data is up to date before a click
+                    let needs_rebuild = self
+                        .borrow()
+                        .layout
+                        .text()
+                        .map(|old| !old.same(data))
+                        .unwrap_or(true);
+                    if needs_rebuild {
+                        self.borrow_mut().layout.set_text(data.clone());
+                        self.borrow_mut().layout.rebuild_if_needed(ctx.text(), env);
+                        self.borrow_mut()
+                            .update_pending_invalidation(ImeInvalidation::Reset);
+                    }
+                    self.borrow_mut()
+                        .do_mouse_down(mouse.pos, mouse.mods, mouse.count);
                     self.borrow_mut()
-                        .update_pending_invalidation(ImeInvalidation::Reset);
+                        .update_pending_invalidation(ImeInvalidation::SelectionChanged);
+                    ctx.request_update();
+                    ctx.request_paint();
                 }
-                self.borrow_mut()
-                    .do_mouse_down(mouse.pos, mouse.mods, mouse.count);
-                self.borrow_mut()
-                    .update_pending_invalidation(ImeInvalidation::SelectionChanged);
-                ctx.request_update();
-                ctx.request_paint();
             }
             Event::MouseMove(mouse) if self.can_write() => {
-                ctx.set_cursor(&Cursor::IBeam);
-                if ctx.is_active() {
-                    let pre_sel = self.borrow().selection();
-                    self.borrow_mut().do_drag(mouse.pos);
-                    if self.borrow().selection() != pre_sel {
-                        self.borrow_mut()
-                            .update_pending_invalidation(ImeInvalidation::SelectionChanged);
-                        ctx.request_update();
-                        ctx.request_paint();
+                if !ctx.is_disabled() {
+                    ctx.set_cursor(&Cursor::IBeam);
+                    if ctx.is_active() {
+                        let pre_sel = self.borrow().selection();
+                        self.borrow_mut().do_drag(mouse.pos);
+                        if self.borrow().selection() != pre_sel {
+                            self.borrow_mut()
+                                .update_pending_invalidation(ImeInvalidation::SelectionChanged);
+                            ctx.request_update();
+                            ctx.request_paint();
+                        }
                     }
+                } else {
+                    ctx.set_disabled(false);
+                    ctx.clear_cursor();
                 }
             }
             Event::MouseUp(_) => {
@@ -380,6 +387,9 @@ impl<T: TextStorage + EditableText> Widget<T> for TextComponent<T> {
                     }
                 }
             }
+            LifeCycle::DisabledChanged(_) => {
+                ctx.request_paint();
+            }
             _ => (),
         }
     }

druid/src/theme.rs

@@ -34,6 +34,10 @@ pub const BACKGROUND_LIGHT: Key<Color> = Key::new("org.linebender.druid.theme.ba
 pub const BACKGROUND_DARK: Key<Color> = Key::new("org.linebender.druid.theme.background_dark");
 pub const FOREGROUND_LIGHT: Key<Color> = Key::new("org.linebender.druid.theme.foreground_light");
 pub const FOREGROUND_DARK: Key<Color> = Key::new("org.linebender.druid.theme.foreground_dark");
+pub const DISABLED_FOREGROUND_LIGHT: Key<Color> =
+    Key::new("org.linebender.druid.theme.disabled_foreground_light");
+pub const DISABLED_FOREGROUND_DARK: Key<Color> =
+    Key::new("org.linebender.druid.theme.disabled_foreground_dark");
 pub const BUTTON_DARK: Key<Color> = Key::new("org.linebender.druid.theme.button_dark");
 pub const BUTTON_LIGHT: Key<Color> = Key::new("org.linebender.druid.theme.button_light");
 pub const BUTTON_BORDER_RADIUS: Key<f64> = Key::new("org.linebender.druid.theme.button_radius");
@@ -116,6 +120,8 @@ pub(crate) fn add_to_env(env: Env) -> Env {
         .adding(BACKGROUND_DARK, Color::rgb8(0x31, 0x31, 0x31))
         .adding(FOREGROUND_LIGHT, Color::rgb8(0xf9, 0xf9, 0xf9))
         .adding(FOREGROUND_DARK, Color::rgb8(0xbf, 0xbf, 0xbf))
+        .adding(DISABLED_FOREGROUND_LIGHT, Color::rgb8(0x49, 0x49, 0x49))
+        .adding(DISABLED_FOREGROUND_DARK, Color::rgb8(0x2f, 0x2f, 0x2f))
         .adding(BUTTON_DARK, Color::BLACK)
         .adding(BUTTON_LIGHT, Color::rgb8(0x21, 0x21, 0x21))
         .adding(BUTTON_BORDER_RADIUS, 4.)

druid/src/widget/button.rs

@@ -115,24 +115,26 @@ impl<T: Data> Widget<T> for Button<T> {
     fn event(&mut self, ctx: &mut EventCtx, event: &Event, _data: &mut T, _env: &Env) {
         match event {
             Event::MouseDown(_) => {
-                ctx.set_active(true);
-                ctx.request_paint();
-                trace!("Button {:?} pressed", ctx.widget_id());
+                if !ctx.is_disabled() {
+                    ctx.set_active(true);
+                    ctx.request_paint();
+                    trace!("Button {:?} pressed", ctx.widget_id());
+                }
             }
             Event::MouseUp(_) => {
-                if ctx.is_active() {
-                    ctx.set_active(false);
+                if ctx.is_active() && !ctx.is_disabled() {
                     ctx.request_paint();
                     trace!("Button {:?} released", ctx.widget_id());
                 }
+                ctx.set_active(false);
             }
             _ => (),
         }
     }
 
     #[instrument(name = "Button", level = "trace", skip(self, ctx, event, data, env))]
     fn lifecycle(&mut self, ctx: &mut LifeCycleCtx, event: &LifeCycle, data: &T, env: &Env) {
-        if let LifeCycle::HotChanged(_) = event {
+        if let LifeCycle::HotChanged(_) | LifeCycle::DisabledChanged(_) = event {
             ctx.request_paint();
         }
         self.label.lifecycle(ctx, event, data, env)
@@ -165,7 +167,7 @@ impl<T: Data> Widget<T> for Button<T> {
 
     #[instrument(name = "Button", level = "trace", skip(self, ctx, data, env))]
     fn paint(&mut self, ctx: &mut PaintCtx, data: &T, env: &Env) {
-        let is_active = ctx.is_active();
+        let is_active = ctx.is_active() && !ctx.is_disabled();
         let is_hot = ctx.is_hot();
         let size = ctx.size();
         let stroke_width = env.get(theme::BUTTON_BORDER_WIDTH);
@@ -175,7 +177,16 @@ impl<T: Data> Widget<T> for Button<T> {
             .inset(-stroke_width / 2.0)
             .to_rounded_rect(env.get(theme::BUTTON_BORDER_RADIUS));
 
-        let bg_gradient = if is_active {
+        let bg_gradient = if ctx.is_disabled() {
+            LinearGradient::new(
+                UnitPoint::TOP,
+                UnitPoint::BOTTOM,
+                (
+                    env.get(theme::DISABLED_FOREGROUND_LIGHT),
+                    env.get(theme::DISABLED_FOREGROUND_DARK),
+                ),
+            )
+        } else if is_active {
             LinearGradient::new(
                 UnitPoint::TOP,
                 UnitPoint::BOTTOM,
@@ -189,7 +200,7 @@ impl<T: Data> Widget<T> for Button<T> {
             )
         };
 
-        let border_color = if is_hot {
+        let border_color = if is_hot && !ctx.is_disabled() {
             env.get(theme::BORDER_LIGHT)
         } else {
             env.get(theme::BORDER_DARK)

druid/src/widget/checkbox.rs

@@ -44,13 +44,14 @@ impl Widget<bool> for Checkbox {
     fn event(&mut self, ctx: &mut EventCtx, event: &Event, data: &mut bool, _env: &Env) {
         match event {
             Event::MouseDown(_) => {
-                ctx.set_active(true);
-                ctx.request_paint();
-                trace!("Checkbox {:?} pressed", ctx.widget_id());
+                if !ctx.is_disabled() {
+                    ctx.set_active(true);
+                    ctx.request_paint();
+                    trace!("Checkbox {:?} pressed", ctx.widget_id());
+                }
             }
             Event::MouseUp(_) => {
-                if ctx.is_active() {
-                    ctx.set_active(false);
+                if ctx.is_active() && !ctx.is_disabled() {
                     if ctx.is_hot() {
                         if *data {
                             *data = false;
@@ -62,6 +63,7 @@ impl Widget<bool> for Checkbox {
                     }
                     ctx.request_paint();
                 }
+                ctx.set_active(false);
             }
             _ => (),
         }
@@ -70,7 +72,7 @@ impl Widget<bool> for Checkbox {
     #[instrument(name = "CheckBox", level = "trace", skip(self, ctx, event, data, env))]
     fn lifecycle(&mut self, ctx: &mut LifeCycleCtx, event: &LifeCycle, data: &bool, env: &Env) {
         self.child_label.lifecycle(ctx, event, data, env);
-        if let LifeCycle::HotChanged(_) = event {
+        if let LifeCycle::HotChanged(_) | LifeCycle::DisabledChanged(_) = event {
             ctx.request_paint();
         }
     }
@@ -126,7 +128,7 @@ impl Widget<bool> for Checkbox {
 
         ctx.fill(rect, &background_gradient);
 
-        let border_color = if ctx.is_hot() {
+        let border_color = if ctx.is_hot() && !ctx.is_disabled() {
             env.get(theme::BORDER_LIGHT)
         } else {
             env.get(theme::BORDER_DARK)
@@ -145,7 +147,13 @@ impl Widget<bool> for Checkbox {
                 .line_cap(LineCap::Round)
                 .line_join(LineJoin::Round);
 
-            ctx.stroke_styled(path, &env.get(theme::LABEL_COLOR), 2., &style);
+            let brush = if ctx.is_disabled() {
+                env.get(theme::DISABLED_FOREGROUND_LIGHT)
+            } else {
+                env.get(theme::LABEL_COLOR)
+            };
+
+            ctx.stroke_styled(path, &brush, 2., &style);
         }
 
         // Paint the text label

druid/src/widget/click.rs

@@ -59,7 +59,7 @@ impl<T: Data, W: Widget<T>> Controller<T, W> for Click<T> {
     fn event(&mut self, child: &mut W, ctx: &mut EventCtx, event: &Event, data: &mut T, env: &Env) {
         match event {
             Event::MouseDown(mouse_event) => {
-                if mouse_event.button == MouseButton::Left {
+                if mouse_event.button == MouseButton::Left && !ctx.is_disabled() {
                     ctx.set_active(true);
                     ctx.request_paint();
                     trace!("Widget {:?} pressed", ctx.widget_id());
@@ -68,7 +68,7 @@ impl<T: Data, W: Widget<T>> Controller<T, W> for Click<T> {
             Event::MouseUp(mouse_event) => {
                 if ctx.is_active() && mouse_event.button == MouseButton::Left {
                     ctx.set_active(false);
-                    if ctx.is_hot() {
+                    if ctx.is_hot() && !ctx.is_disabled() {
                         (self.action)(ctx, data, env);
                     }
                     ctx.request_paint();

druid/src/widget/radio.rs

@@ -66,19 +66,21 @@ impl<T: Data + PartialEq> Widget<T> for Radio<T> {
     fn event(&mut self, ctx: &mut EventCtx, event: &Event, data: &mut T, _env: &Env) {
         match event {
             Event::MouseDown(_) => {
-                ctx.set_active(true);
-                ctx.request_paint();
-                trace!("Radio button {:?} pressed", ctx.widget_id());
+                if !ctx.is_disabled() {
+                    ctx.set_active(true);
+                    ctx.request_paint();
+                    trace!("Radio button {:?} pressed", ctx.widget_id());
+                }
             }
             Event::MouseUp(_) => {
-                if ctx.is_active() {
-                    ctx.set_active(false);
+                if ctx.is_active() && !ctx.is_disabled() {
                     if ctx.is_hot() {
                         *data = self.variant.clone();
                     }
                     ctx.request_paint();
                     trace!("Radio button {:?} released", ctx.widget_id());
                 }
+                ctx.set_active(false);
             }
             _ => (),
         }
@@ -87,7 +89,7 @@ impl<T: Data + PartialEq> Widget<T> for Radio<T> {
     #[instrument(name = "Radio", level = "trace", skip(self, ctx, event, data, env))]
     fn lifecycle(&mut self, ctx: &mut LifeCycleCtx, event: &LifeCycle, data: &T, env: &Env) {
         self.child_label.lifecycle(ctx, event, data, env);
-        if let LifeCycle::HotChanged(_) = event {
+        if let LifeCycle::HotChanged(_) | LifeCycle::DisabledChanged(_) = event {
             ctx.request_paint();
         }
     }
@@ -136,7 +138,7 @@ impl<T: Data + PartialEq> Widget<T> for Radio<T> {
 
         ctx.fill(circle, &background_gradient);
 
-        let border_color = if ctx.is_hot() {
+        let border_color = if ctx.is_hot() && !ctx.is_disabled() {
             env.get(theme::BORDER_LIGHT)
         } else {
             env.get(theme::BORDER_DARK)
@@ -148,7 +150,13 @@ impl<T: Data + PartialEq> Widget<T> for Radio<T> {
         if *data == self.variant {
             let inner_circle = Circle::new((size / 2., size / 2.), INNER_CIRCLE_RADIUS);
 
-            ctx.fill(inner_circle, &env.get(theme::CURSOR_COLOR));
+            let fill = if ctx.is_disabled() {
+                env.get(theme::DISABLED_FOREGROUND_LIGHT)
+            } else {
+                env.get(theme::CURSOR_COLOR)
+            };
+
+            ctx.fill(inner_circle, &fill);
         }
 
         // Paint the text label