Implement theme styling for Rule

examples/scrollable/src/main.rs

@@ -179,7 +179,7 @@ impl Sandbox for ScrollableDemo {
             .spacing(20)
             .padding(20)
             .push(choose_theme)
-            .push(Rule::horizontal(20).style(self.theme))
+            .push(Rule::horizontal(20))
             .push(scrollable_row);
 
         Container::new(content)

examples/scrollable/src/style.rs

@@ -1,4 +1,4 @@
-use iced::{container, rule, scrollable};
+use iced::{container, scrollable};
 
 #[derive(Debug, Clone, Copy, PartialEq, Eq)]
 pub enum Theme {
@@ -34,17 +34,8 @@ impl<'a> From<Theme> for Box<dyn scrollable::StyleSheet + 'a> {
     }
 }
 
-impl From<Theme> for Box<dyn rule::StyleSheet> {
-    fn from(theme: Theme) -> Self {
-        match theme {
-            Theme::Light => Default::default(),
-            Theme::Dark => dark::Rule.into(),
-        }
-    }
-}
-
 mod dark {
-    use iced::{container, rule, scrollable, Color};
+    use iced::{container, scrollable, Color};
 
     const BACKGROUND: Color = Color::from_rgb(
         0x36 as f32 / 255.0,
@@ -139,17 +130,4 @@ mod dark {
             }
         }
     }
-
-    pub struct Rule;
-
-    impl rule::StyleSheet for Rule {
-        fn style(&self) -> rule::Style {
-            rule::Style {
-                color: SURFACE,
-                width: 2,
-                radius: 1.0,
-                fill_mode: rule::FillMode::Percent(30.0),
-            }
-        }
-    }
 }

examples/styling/src/main.rs

@@ -122,7 +122,7 @@ impl Sandbox for Styling {
             .padding(20)
             .max_width(600)
             .push(choose_theme)
-            .push(Rule::horizontal(38).style(self.theme))
+            .push(Rule::horizontal(38))
             .push(Row::new().spacing(10).push(text_input).push(button))
             .push(slider)
             .push(progress_bar)
@@ -132,7 +132,7 @@ impl Sandbox for Styling {
                     .height(Length::Units(100))
                     .align_items(Alignment::Center)
                     .push(scrollable)
-                    .push(Rule::vertical(38).style(self.theme))
+                    .push(Rule::vertical(38))
                     .push(
                         Column::new()
                             .width(Length::Shrink)
@@ -159,7 +159,7 @@ impl Sandbox for Styling {
 }
 
 mod style {
-    use iced::{checkbox, progress_bar, rule, scrollable, text_input};
+    use iced::{checkbox, progress_bar, scrollable, text_input};
 
     #[derive(Debug, Clone, Copy, PartialEq, Eq)]
     pub enum Theme {
@@ -213,19 +213,8 @@ mod style {
         }
     }
 
-    impl From<Theme> for Box<dyn rule::StyleSheet> {
-        fn from(theme: Theme) -> Self {
-            match theme {
-                Theme::Light => Default::default(),
-                Theme::Dark => dark::Rule.into(),
-            }
-        }
-    }
-
     mod dark {
-        use iced::{
-            checkbox, progress_bar, rule, scrollable, text_input, Color,
-        };
+        use iced::{checkbox, progress_bar, scrollable, text_input, Color};
 
         const SURFACE: Color = Color::from_rgb(
             0x40 as f32 / 255.0,
@@ -374,18 +363,5 @@ mod style {
                 }
             }
         }
-
-        pub struct Rule;
-
-        impl rule::StyleSheet for Rule {
-            fn style(&self) -> rule::Style {
-                rule::Style {
-                    color: SURFACE,
-                    width: 2,
-                    radius: 1.0,
-                    fill_mode: rule::FillMode::Padded(15),
-                }
-            }
-        }
     }
 }

native/src/widget/rule.rs

@@ -3,25 +3,33 @@ use crate::layout;
 use crate::renderer;
 use crate::{Color, Element, Layout, Length, Point, Rectangle, Size, Widget};
 
-pub use iced_style::rule::{FillMode, Style, StyleSheet};
+pub use iced_style::rule::{Appearance, FillMode, StyleSheet};
 
 /// Display a horizontal or vertical rule for dividing content.
 #[allow(missing_debug_implementations)]
-pub struct Rule<'a> {
+pub struct Rule<Renderer>
+where
+    Renderer: crate::Renderer,
+    Renderer::Theme: StyleSheet,
+{
     width: Length,
     height: Length,
     is_horizontal: bool,
-    style_sheet: Box<dyn StyleSheet + 'a>,
+    style: <Renderer::Theme as StyleSheet>::Style,
 }
 
-impl<'a> Rule<'a> {
+impl<Renderer> Rule<Renderer>
+where
+    Renderer: crate::Renderer,
+    Renderer::Theme: StyleSheet,
+{
     /// Creates a horizontal [`Rule`] with the given height.
     pub fn horizontal(height: u16) -> Self {
         Rule {
             width: Length::Fill,
             height: Length::Units(height),
             is_horizontal: true,
-            style_sheet: Default::default(),
+            style: Default::default(),
         }
     }
 
@@ -31,23 +39,24 @@ impl<'a> Rule<'a> {
             width: Length::from(Length::Units(width)),
             height: Length::Fill,
             is_horizontal: false,
-            style_sheet: Default::default(),
+            style: Default::default(),
         }
     }
 
     /// Sets the style of the [`Rule`].
     pub fn style(
         mut self,
-        style_sheet: impl Into<Box<dyn StyleSheet + 'a>>,
+        style: impl Into<<Renderer::Theme as StyleSheet>::Style>,
     ) -> Self {
-        self.style_sheet = style_sheet.into();
+        self.style = style.into();
         self
     }
 }
 
-impl<'a, Message, Renderer> Widget<Message, Renderer> for Rule<'a>
+impl<Message, Renderer> Widget<Message, Renderer> for Rule<Renderer>
 where
     Renderer: crate::Renderer,
+    Renderer::Theme: StyleSheet,
 {
     fn width(&self) -> Length {
         self.width
@@ -77,7 +86,7 @@ where
         _viewport: &Rectangle,
     ) {
         let bounds = layout.bounds();
-        let style = self.style_sheet.style();
+        let style = theme.style(self.style);
 
         let bounds = if self.is_horizontal {
             let line_y = (bounds.y + (bounds.height / 2.0)
@@ -121,12 +130,14 @@ where
     }
 }
 
-impl<'a, Message, Renderer> From<Rule<'a>> for Element<'a, Message, Renderer>
+impl<'a, Message, Renderer> From<Rule<Renderer>>
+    for Element<'a, Message, Renderer>
 where
-    Renderer: 'a + crate::Renderer,
     Message: 'a,
+    Renderer: 'a + crate::Renderer,
+    Renderer::Theme: StyleSheet,
 {
-    fn from(rule: Rule<'a>) -> Element<'a, Message, Renderer> {
+    fn from(rule: Rule<Renderer>) -> Element<'a, Message, Renderer> {
         Element::new(rule)
     }
 }

pure/src/helpers.rs

@@ -202,14 +202,22 @@ pub fn vertical_space(height: Length) -> widget::Space {
 /// Creates a horizontal [`Rule`] with the given height.
 ///
 /// [`Rule`]: widget::Rule
-pub fn horizontal_rule<'a>(height: u16) -> widget::Rule<'a> {
+pub fn horizontal_rule<Renderer>(height: u16) -> widget::Rule<Renderer>
+where
+    Renderer: iced_native::Renderer,
+    Renderer::Theme: widget::rule::StyleSheet,
+{
     widget::Rule::horizontal(height)
 }
 
 /// Creates a vertical [`Rule`] with the given width.
 ///
 /// [`Rule`]: widget::Rule
-pub fn vertical_rule<'a>(width: u16) -> widget::Rule<'a> {
+pub fn vertical_rule<Renderer>(width: u16) -> widget::Rule<Renderer>
+where
+    Renderer: iced_native::Renderer,
+    Renderer::Theme: widget::rule::StyleSheet,
+{
     widget::Rule::vertical(width)
 }
 

pure/src/widget/rule.rs

@@ -10,9 +10,10 @@ use iced_native::{Clipboard, Length, Point, Rectangle, Shell};
 
 pub use iced_native::widget::rule::*;
 
-impl<'a, Message, Renderer> Widget<Message, Renderer> for Rule<'a>
+impl<'a, Message, Renderer> Widget<Message, Renderer> for Rule<Renderer>
 where
     Renderer: iced_native::Renderer,
+    Renderer::Theme: StyleSheet,
 {
     fn width(&self) -> Length {
         <Self as iced_native::Widget<Message, Renderer>>::width(self)
@@ -92,9 +93,11 @@ where
     }
 }
 
-impl<'a, Message, Renderer> Into<Element<'a, Message, Renderer>> for Rule<'a>
+impl<'a, Message, Renderer> Into<Element<'a, Message, Renderer>>
+    for Rule<Renderer>
 where
     Renderer: iced_native::Renderer + 'a,
+    Renderer::Theme: StyleSheet,
 {
     fn into(self) -> Element<'a, Message, Renderer> {
         Element::new(self)

style/src/rule.rs

@@ -1,6 +1,27 @@
 //! Display a horizontal or vertical rule for dividing content.
 use iced_core::Color;
 
+/// The appearance of a rule.
+#[derive(Debug, Clone, Copy)]
+pub struct Appearance {
+    /// The color of the rule.
+    pub color: Color,
+    /// The width (thickness) of the rule line.
+    pub width: u16,
+    /// The radius of the line corners.
+    pub radius: f32,
+    /// The [`FillMode`] of the rule.
+    pub fill_mode: FillMode,
+}
+
+/// A set of rules that dictate the style of a rule.
+pub trait StyleSheet {
+    type Style: Default + Copy;
+
+    /// Produces the style of a rule.
+    fn style(&self, style: Self::Style) -> Appearance;
+}
+
 /// The fill mode of a rule.
 #[derive(Debug, Clone, Copy)]
 pub enum FillMode {
@@ -64,56 +85,3 @@ impl FillMode {
         }
     }
 }
-
-/// The appearance of a rule.
-#[derive(Debug, Clone, Copy)]
-pub struct Style {
-    /// The color of the rule.
-    pub color: Color,
-    /// The width (thickness) of the rule line.
-    pub width: u16,
-    /// The radius of the line corners.
-    pub radius: f32,
-    /// The [`FillMode`] of the rule.
-    pub fill_mode: FillMode,
-}
-
-impl std::default::Default for Style {
-    fn default() -> Self {
-        Style {
-            color: [0.6, 0.6, 0.6, 0.6].into(),
-            width: 1,
-            radius: 0.0,
-            fill_mode: FillMode::Full,
-        }
-    }
-}
-
-/// A set of rules that dictate the style of a rule.
-pub trait StyleSheet {
-    /// Produces the style of a rule.
-    fn style(&self) -> Style;
-}
-
-struct Default;
-
-impl StyleSheet for Default {
-    fn style(&self) -> Style {
-        Style::default()
-    }
-}
-
-impl<'a> std::default::Default for Box<dyn StyleSheet + 'a> {
-    fn default() -> Self {
-        Box::new(Default)
-    }
-}
-
-impl<'a, T> From<T> for Box<dyn StyleSheet + 'a>
-where
-    T: 'a + StyleSheet,
-{
-    fn from(style: T) -> Self {
-        Box::new(style)
-    }
-}

style/src/theme.rs

@@ -6,6 +6,7 @@ use crate::application;
 use crate::button;
 use crate::pane_grid;
 use crate::radio;
+use crate::rule;
 use crate::slider;
 use crate::toggler;
 
@@ -279,3 +280,21 @@ impl pane_grid::StyleSheet for Theme {
         })
     }
 }
+
+/*
+ * Rule
+ */
+impl rule::StyleSheet for Theme {
+    type Style = ();
+
+    fn style(&self, _style: Self::Style) -> rule::Appearance {
+        let palette = self.extended_palette();
+
+        rule::Appearance {
+            color: palette.background.strong.color,
+            width: 1,
+            radius: 0.0,
+            fill_mode: rule::FillMode::Full,
+        }
+    }
+}