rustrust-iced

How to Style Button in Iced 0.12?

I'm new to Rust language and I want to style my button so it can be disabled when the process is still running.

I use iced 0.12.1.

This is my code snippet:

#[derive(Debug, Clone, Copy)]
pub struct CustomButtonStyle;

impl StyleSheet for CustomButtonStyle {
    type Style = ();

    fn active(&self, _: &Self::Style) -> Appearance {
        Appearance {
            background: Some(Background::Color(Color::from_rgb(0.2, 0.6, 0.2))),
            text_color: Color::WHITE,
            border: Border::default(),
            shadow: Shadow::default(),
            shadow_offset: Vector::default(),
        }
    }

    fn hovered(&self, _: &Self::Style) -> Appearance {
        Appearance {
            background: Some(Background::Color(Color::from_rgb(0.3, 0.7, 0.3))),
            text_color: Color::WHITE,
            border: Border::default(),
            shadow: Shadow::default(),
            shadow_offset: Vector::default(),
        }
    }

    fn disabled(&self, _: &Self::Style) -> Appearance {
        Appearance {
            background: Some(Background::Color(Color::from_rgb(0.5, 0.5, 0.5))),
            text_color: Color::from_rgb(0.7, 0.7, 0.7),
            border: Border::default(),
            shadow: Shadow::default(),
            shadow_offset: Vector::default(),
        }
    }
}

...
                    button("Process")
                      .on_press(Message::Process)
                      .padding(Padding::from(5))
                      .style(CustomButtonStyle) //ERROR
...

The error said:

the trait bound iced::theme::Button: From<CustomButtonStyle> is not satisfied required for CustomButtonStyle to implement Into<iced::theme::Button>

Full Error:

error[E0277]: the trait bound `iced::theme::Button: From<CustomButtonStyle>` is not satisfied
   --> src\test_rust.rs:332:32
    |
332 |                         .style(CustomButtonStyle)
    |                          ----- ^^^^^^^^^^^^^^^^^ the trait `From<CustomButtonStyle>` is not implemented for `iced::theme::Button`, which is required by `CustomButtonStyle: Into<_>`
    |                          |
    |                          required by a bound introduced by this call
    |
    = note: required for `CustomButtonStyle` to implement `Into<iced::theme::Button>`
note: required by a bound in `iced::widget::Button::<'a, Message, Theme, Renderer>::style`
   --> C:\Users\\.cargo\registry\src\index.crates.io-6f17d22bba15001f\iced_widget-0.12.3\src\button.rs:127:40
    |
127 |     pub fn style(mut self, style: impl Into<Theme::Style>) -> Self {
    |                                        ^^^^^^^^^^^^^^^^^^ required by this bound in `Button::<'a, Message, Theme, Renderer>::style`

I searched and found this: https://github.com/iced-rs/iced/issues/882

So I tried:

.style(iced::theme::Button::CustomButtonStyle)

And got this error:

no variant or associated item named CustomButtonStyle found for enum iced::theme::Button in the current scope variant or associated item not found in Button

Full error:

error[E0271]: type mismatch resolving `<CustomButtonStyle as StyleSheet>::Style == Theme`
   --> src\frontend_desktop.rs:331:60
    |
331 |                         .style(iced::theme::Button::custom(CustomButtonStyle))
    |                                --------------------------- ^^^^^^^^^^^^^^^^^ type mismatch resolving `<CustomButtonStyle as StyleSheet>::Style == Theme`
    |                                |
    |                                required by a bound introduced by this call
    |
note: expected this to be `Theme`
   --> src\test_rust.rs:15:18
    |
15  |     type Style = ();
    |                  ^^
note: required by a bound in `iced::theme::Button::custom`
   --> C:\Users\\.cargo\registry\src\index.crates.io-6f17d22bba15001f\iced_style-0.12.1\src\theme.rs:311:46
    |
310 |     pub fn custom(
    |            ------ required by a bound in this associated function
311 |         style_sheet: impl button::StyleSheet<Style = Theme> + 'static,
    |                                              ^^^^^^^^^^^^^ required by this bound in `Button::custom`

I also tried to change the

type Style = iced::theme::Button::Custom;

Got error that told me to either:

Then I follow:

type Style = iced::theme::Custom;

And got error for both "type Style" line and ".style(___)" line.

The full error for line "type Style":

error[E0277]: the trait bound `iced::theme::Custom: std::default::Default` is not satisfied
  --> src\test_rust.rs:14:18
   |
14 |     type Style = iced::theme::Custom;
   |                  ^^^^^^^^^^^^^^^^^^^ the trait `std::default::Default` is not implemented for `iced::theme::Custom`
   |
note: required by a bound in `iced::widget::button::StyleSheet::Style`
  --> C:\Users\\.cargo\registry\src\index.crates.io-6f17d22bba15001f\iced_style-0.12.1\src\button.rs:34:17
   |
34 |     type Style: Default;
   |                 ^^^^^^^ required by this bound in `StyleSheet::Style`
Solution

  • I believe for iced 0.12 you need to do the following:

    You’re getting errors because your button uses the default theme, so you need to provide a style from the default theme. Thankfully they provide a custom variant that lets you supply your own style - but you need to properly wrap your custom style in that variant.

    Note that iced 0.13 appears to change the way .style works entirely.