Rename horizontal_rule to rule and introduce Rule::vertical

examples/layout/src/main.rs

@@ -3,8 +3,7 @@ use iced::keyboard;
 use iced::mouse;
 use iced::widget::{
     button, canvas, center, center_y, checkbox, column, container,
-    horizontal_rule, horizontal_space, pick_list, pin, row, scrollable, stack,
+    horizontal_space, pick_list, pin, row, rule, scrollable, stack, text,
-    text, vertical_rule,
 };
 use iced::{
     Center, Element, Fill, Font, Length, Point, Rectangle, Renderer, Shrink,
@@ -295,7 +294,7 @@ fn quotes<'a>() -> Element<'a, Message> {
     fn quote<'a>(
         content: impl Into<Element<'a, Message>>,
     ) -> Element<'a, Message> {
-        row![vertical_rule(1), content.into()]
+        row![rule(1).vertical(), content.into()]
             .spacing(10)
             .height(Shrink)
             .into()
@@ -313,7 +312,7 @@ fn quotes<'a>() -> Element<'a, Message> {
             reply("This is the original message", "This is a reply"),
             "This is another reply",
         ),
-        horizontal_rule(1),
+        rule(1),
         text("A separator ↑"),
     ]
     .width(Shrink)

examples/styling/src/main.rs

@@ -1,8 +1,8 @@
 use iced::keyboard;
 use iced::widget::{
-    button, center_x, center_y, checkbox, column, container, horizontal_rule,
+    button, center_x, center_y, checkbox, column, container, pick_list,
-    pick_list, progress_bar, row, scrollable, slider, text, text_input,
+    progress_bar, row, rule, scrollable, slider, text, text_input, toggler,
-    toggler, vertical_rule, vertical_space,
+    vertical_space,
 };
 use iced::{Center, Element, Fill, Shrink, Subscription, Theme};
 
@@ -162,14 +162,14 @@ impl Styling {
 
         let content = column![
             choose_theme,
-            horizontal_rule(1),
+            rule(1),
             text_input,
             buttons,
             slider(),
             progress_bar(),
             row![
                 scroll_me,
-                vertical_rule(1),
+                rule(1).vertical(),
                 column![check, check_disabled, toggle, disabled_toggle]
                     .spacing(10)
             ]

examples/toast/src/main.rs

@@ -172,7 +172,7 @@ mod toast {
     use iced::theme;
     use iced::time::{self, Duration, Instant};
     use iced::widget::{
-        button, column, container, horizontal_rule, horizontal_space, row, text,
+        button, column, container, horizontal_space, row, rule, text,
     };
     use iced::window;
     use iced::{
@@ -254,7 +254,7 @@ mod toast {
                             Status::Success => success,
                             Status::Danger => danger,
                         }),
-                        horizontal_rule(1),
+                        rule(1),
                         container(text(toast.body.as_str()))
                             .width(Fill)
                             .padding(5)

tester/src/lib.rs

@@ -28,7 +28,7 @@ use crate::test::instruction;
 use crate::test::{Emulator, Ice, Instruction};
 use crate::widget::{
     button, center, column, combo_box, container, horizontal_space, pick_list,
-    row, scrollable, text, text_editor, text_input, themer,
+    row, rule, scrollable, text, text_editor, text_input, themer,
 };
 
 /// Attaches a [`Tester`] to the given [`Program`].
@@ -632,10 +632,13 @@ impl<P: Program + 'static> Tester<P> {
         row![
             center(column![status, viewport].spacing(10).align_x(Right))
                 .padding(10),
+            rule(1).vertical().style(rule::weak),
             container(self.controls().map(Tick::Tester))
                 .width(250)
                 .padding(10)
-                .style(container::dark)
+                .style(|theme| container::Style::default().background(
+                    theme.extended_palette().background.weakest.color
+                )),
         ]
         .into()
     }

widget/src/helpers.rs

@@ -1752,7 +1752,7 @@ pub fn vertical_space() -> Space {
 /// # mod iced { pub mod widget { pub use iced_widget::*; } }
 /// # pub type State = ();
 /// # pub type Element<'a, Message> = iced_widget::core::Element<'a, Message, iced_widget::Theme, iced_widget::Renderer>;
-/// use iced::widget::horizontal_rule;
+/// use iced::widget::rule;
 ///
 /// #[derive(Clone)]
 /// enum Message {
@@ -1760,39 +1760,14 @@ pub fn vertical_space() -> Space {
 /// }
 ///
 /// fn view(state: &State) -> Element<'_, Message> {
-///     horizontal_rule(2).into()
+///     rule(2).into()
 /// }
 /// ```
-pub fn horizontal_rule<'a, Theme>(height: impl Into<Pixels>) -> Rule<'a, Theme>
+pub fn rule<'a, Theme>(height: impl Into<Pixels>) -> Rule<'a, Theme>
 where
     Theme: rule::Catalog + 'a,
 {
-    Rule::horizontal(height)
+    Rule::new(height)
-}
-
-/// Creates a vertical [`Rule`] with the given width.
-///
-/// # Example
-/// ```no_run
-/// # mod iced { pub mod widget { pub use iced_widget::*; } }
-/// # pub type State = ();
-/// # pub type Element<'a, Message> = iced_widget::core::Element<'a, Message, iced_widget::Theme, iced_widget::Renderer>;
-/// use iced::widget::vertical_rule;
-///
-/// #[derive(Clone)]
-/// enum Message {
-///     // ...,
-/// }
-///
-/// fn view(state: &State) -> Element<'_, Message> {
-///     vertical_rule(2).into()
-/// }
-/// ```
-pub fn vertical_rule<'a, Theme>(width: impl Into<Pixels>) -> Rule<'a, Theme>
-where
-    Theme: rule::Catalog + 'a,
-{
-    Rule::vertical(width)
 }
 
 /// Creates a new [`ProgressBar`].

widget/src/markdown.rs

@@ -51,10 +51,7 @@ use crate::core::theme;
 use crate::core::{
     self, Color, Element, Length, Padding, Pixels, Theme, color,
 };
-use crate::{
+use crate::{column, container, rich_text, row, scrollable, span, text};
-    column, container, horizontal_rule, rich_text, row, rule, scrollable, span,
-    text, vertical_rule,
-};
 
 use std::borrow::BorrowMut;
 use std::cell::{Cell, RefCell};
@@ -1391,7 +1388,7 @@ where
     Renderer: core::text::Renderer<Font = Font> + 'a,
 {
     row![
-        vertical_rule(4),
+        crate::rule(4).vertical(),
         column(
             contents
                 .iter()
@@ -1413,7 +1410,7 @@ where
     Theme: Catalog + 'a,
     Renderer: core::text::Renderer<Font = Font> + 'a,
 {
-    horizontal_rule(2).into()
+    crate::rule(2).into()
 }
 
 /// Displays a table using the default look.
@@ -1637,8 +1634,8 @@ where
 pub trait Catalog:
     container::Catalog
     + scrollable::Catalog
-    + rule::Catalog
     + text::Catalog
+    + crate::rule::Catalog
     + crate::table::Catalog
 {
     /// The styling class of a Markdown code block.

widget/src/rule.rs

@@ -5,7 +5,7 @@
 //! # mod iced { pub mod widget { pub use iced_widget::*; } }
 //! # pub type State = ();
 //! # pub type Element<'a, Message> = iced_widget::core::Element<'a, Message, iced_widget::Theme, iced_widget::Renderer>;
-//! use iced::widget::horizontal_rule;
+//! use iced::widget::rule;
 //!
 //! #[derive(Clone)]
 //! enum Message {
@@ -13,7 +13,7 @@
 //! }
 //!
 //! fn view(state: &State) -> Element<'_, Message> {
-//!     horizontal_rule(2).into()
+//!     rule(2).into()
 //! }
 //! ```
 use crate::core;
@@ -33,7 +33,7 @@ use crate::core::{
 /// # mod iced { pub mod widget { pub use iced_widget::*; } }
 /// # pub type State = ();
 /// # pub type Element<'a, Message> = iced_widget::core::Element<'a, Message, iced_widget::Theme, iced_widget::Renderer>;
-/// use iced::widget::horizontal_rule;
+/// use iced::widget::rule;
 ///
 /// #[derive(Clone)]
 /// enum Message {
@@ -41,7 +41,7 @@ use crate::core::{
 /// }
 ///
 /// fn view(state: &State) -> Element<'_, Message> {
-///     horizontal_rule(2).into()
+///     rule(2).into()
 /// }
 /// ```
 #[allow(missing_debug_implementations)]
@@ -49,9 +49,8 @@ pub struct Rule<'a, Theme = crate::Theme>
 where
     Theme: Catalog,
 {
-    width: Length,
+    thickness: Length,
-    height: Length,
+    is_vertical: bool,
-    is_horizontal: bool,
     class: Theme::Class<'a>,
 }
 
@@ -59,24 +58,19 @@ impl<'a, Theme> Rule<'a, Theme>
 where
     Theme: Catalog,
 {
-    /// Creates a horizontal [`Rule`] with the given height.
+    /// Creates a horizontal [`Rule`] with the given thickness.
-    pub fn horizontal(height: impl Into<Pixels>) -> Self {
+    pub fn new(thickness: impl Into<Pixels>) -> Self {
         Rule {
-            width: Length::Fill,
+            thickness: Length::Fixed(thickness.into().0),
-            height: Length::Fixed(height.into().0),
+            is_vertical: false,
-            is_horizontal: true,
             class: Theme::default(),
         }
     }
 
-    /// Creates a vertical [`Rule`] with the given width.
+    /// Turns the [`Rule`] into a vertical one.
-    pub fn vertical(width: impl Into<Pixels>) -> Self {
+    pub fn vertical(mut self) -> Self {
-        Rule {
+        self.is_vertical = true;
-            width: Length::Fixed(width.into().0),
+        self
-            height: Length::Fill,
-            is_horizontal: false,
-            class: Theme::default(),
-        }
     }
 
     /// Sets the style of the [`Rule`].
@@ -105,9 +99,16 @@ where
     Theme: Catalog,
 {
     fn size(&self) -> Size<Length> {
-        Size {
+        if self.is_vertical {
-            width: self.width,
+            Size {
-            height: self.height,
+                width: self.thickness,
+                height: Length::Fill,
+            }
+        } else {
+            Size {
+                width: Length::Fill,
+                height: self.thickness,
+            }
         }
     }
 
@@ -117,7 +118,9 @@ where
         _renderer: &Renderer,
         limits: &layout::Limits,
     ) -> layout::Node {
-        layout::atomic(limits, self.width, self.height)
+        let size = <Self as Widget<(), Theme, Renderer>>::size(self);
+
+        layout::atomic(limits, size.width, size.height)
     }
 
     fn draw(
@@ -133,19 +136,7 @@ where
         let bounds = layout.bounds();
         let style = theme.style(&self.class);
 
-        let bounds = if self.is_horizontal {
+        let bounds = if self.is_vertical {
-            let line_y = bounds.y.round();
-
-            let (offset, line_width) = style.fill_mode.fill(bounds.width);
-            let line_x = bounds.x + offset;
-
-            Rectangle {
-                x: line_x,
-                y: line_y,
-                width: line_width,
-                height: bounds.height,
-            }
-        } else {
             let line_x = bounds.x.round();
 
             let (offset, line_height) = style.fill_mode.fill(bounds.height);
@@ -157,6 +148,18 @@ where
                 width: bounds.width,
                 height: line_height,
             }
+        } else {
+            let line_y = bounds.y.round();
+
+            let (offset, line_width) = style.fill_mode.fill(bounds.width);
+            let line_x = bounds.x + offset;
+
+            Rectangle {
+                x: line_x,
+                y: line_y,
+                width: line_width,
+                height: bounds.height,
+            }
         };
 
         renderer.fill_quad(