diff --git a/examples/tour/src/main.rs b/examples/tour/src/main.rs index 1215f83d..626d2b52 100644 --- a/examples/tour/src/main.rs +++ b/examples/tour/src/main.rs @@ -70,13 +70,15 @@ impl Sandbox for Tour { controls = controls.push(Space::with_width(Length::Fill)); - if steps.can_continue() { - controls = controls.push( - button(next_button, "Next") - .on_press(Message::NextPressed) - .style(style::Button::Primary), - ); - } + let mut button = button(next_button, "Next"); + button = if steps.can_continue() { + button + .style(style::Button::Primary) + .on_press(Message::NextPressed) + } else { + button.style(style::Button::Disabled) + }; + controls = controls.push(button); let content: Element<_> = Column::new() .max_width(540) @@ -790,6 +792,7 @@ mod style { pub enum Button { Primary, Secondary, + Disabled, } impl button::StyleSheet for Button { @@ -797,7 +800,8 @@ mod style { button::Style { background: Some(Background::Color(match self { Button::Primary => Color::from_rgb(0.11, 0.42, 0.87), - Button::Secondary => Color::from_rgb(0.5, 0.5, 0.5), + Button::Secondary => Color::from_rgb(0.055, 0.21, 0.435), + Button::Disabled => Color::from_rgb(0.5, 0.5, 0.5), })), border_radius: 12.0, shadow_offset: Vector::new(1.0, 1.0), diff --git a/native/src/widget/button.rs b/native/src/widget/button.rs index f61c22d0..c9b9df58 100644 --- a/native/src/widget/button.rs +++ b/native/src/widget/button.rs @@ -29,6 +29,13 @@ use std::hash::Hash; /// let button = Button::new(&mut state, Text::new("Press me!")) /// .on_press(Message::ButtonPressed); /// ``` +/// +/// Buttons can be disabled by not having an on_press. +/// +/// ``` +/// let mut state = button::State::new(); +/// let disabled_button = Button::new(&mut state, Text::new("I'm disabled!")); +/// ``` #[allow(missing_debug_implementations)] pub struct Button<'a, Message, Renderer: self::Renderer> { state: &'a mut State, @@ -97,6 +104,7 @@ where } /// Sets the message that will be produced when the [`Button`] is pressed. + /// If on_press isn't set, button will be disabled. pub fn on_press(mut self, msg: Message) -> Self { self.on_press = Some(msg); self diff --git a/web/src/widget/button.rs b/web/src/widget/button.rs index 8a36aab9..7c8612f6 100644 --- a/web/src/widget/button.rs +++ b/web/src/widget/button.rs @@ -20,6 +20,14 @@ use dodrio::bumpalo; /// let button = Button::new(&mut state, Text::new("Press me!")) /// .on_press(Message::ButtonPressed); /// ``` +/// +/// Buttons can be disabled by not having an on_press. +/// +/// ``` +/// let mut state = button::State::new(); +/// let disabled_button = Button::new(&mut state, Text::new("I'm disabled!")); +/// ``` + #[allow(missing_debug_implementations)] pub struct Button<'a, Message> { content: Element<'a, Message>, @@ -90,6 +98,7 @@ impl<'a, Message> Button<'a, Message> { } /// Sets the message that will be produced when the [`Button`] is pressed. + /// If on_press isn't set, button will be disabled. pub fn on_press(mut self, msg: Message) -> Self { self.on_press = Some(msg); self @@ -153,6 +162,8 @@ where node = node.on("click", move |_root, _vdom, _event| { event_bus.publish(on_press.clone()); }); + } else { + node = node.attr("disabled", ""); } node.finish()