Implement theme styling for `Container`

7 files changed, 94 insertions, 48 deletions

diff --git a/native/src/overlay/menu.rs b/native/src/overlay/menu.rs
index 36dc8f03..fdb68247 100644
--- a/native/src/overlay/menu.rs
+++ b/native/src/overlay/menu.rs
@@ -7,8 +7,8 @@ use crate::overlay;
 use crate::renderer;
 use crate::text::{self, Text};
 use crate::touch;
+use crate::widget::container::{self, Container};
 use crate::widget::scrollable::{self, Scrollable};
-use crate::widget::Container;
 use crate::{
     Clipboard, Color, Element, Layout, Length, Padding, Point, Rectangle,
     Shell, Size, Vector, Widget,
@@ -34,7 +34,7 @@ impl<'a, T, Renderer> Menu<'a, T, Renderer>
 where
     T: ToString + Clone,
     Renderer: text::Renderer + 'a,
-    Renderer::Theme: scrollable::StyleSheet,
+    Renderer::Theme: container::StyleSheet + scrollable::StyleSheet,
 {
     /// Creates a new [`Menu`] with the given [`State`], a list of options, and
     /// the message to produced when an option is selected.
@@ -118,7 +118,11 @@ impl State {
     }
 }
 
-struct Overlay<'a, Message, Renderer> {
+struct Overlay<'a, Message, Renderer>
+where
+    Renderer: crate::Renderer,
+    Renderer::Theme: container::StyleSheet,
+{
     container: Container<'a, Message, Renderer>,
     width: u16,
     target_height: f32,
@@ -130,7 +134,7 @@ where
     Message: 'a,
     Renderer: 'a,
     Renderer: text::Renderer,
-    Renderer::Theme: scrollable::StyleSheet,
+    Renderer::Theme: container::StyleSheet + scrollable::StyleSheet,
 {
     pub fn new<T>(menu: Menu<'a, T, Renderer>, target_height: f32) -> Self
     where
@@ -173,6 +177,7 @@ impl<'a, Message, Renderer> crate::Overlay<Message, Renderer>
     for Overlay<'a, Message, Renderer>
 where
     Renderer: text::Renderer,
+    Renderer::Theme: container::StyleSheet,
 {
     fn layout(
         &self,
diff --git a/native/src/widget/container.rs b/native/src/widget/container.rs
index efcecb1e..493aa67b 100644
--- a/native/src/widget/container.rs
+++ b/native/src/widget/container.rs
@@ -12,13 +12,17 @@ use crate::{
 
 use std::u32;
 
-pub use iced_style::container::{Style, StyleSheet};
+pub use iced_style::container::{Appearance, StyleSheet};
 
 /// An element decorating some content.
 ///
 /// It is normally used for alignment purposes.
 #[allow(missing_debug_implementations)]
-pub struct Container<'a, Message, Renderer> {
+pub struct Container<'a, Message, Renderer>
+where
+    Renderer: crate::Renderer,
+    Renderer::Theme: StyleSheet,
+{
     padding: Padding,
     width: Length,
     height: Length,
@@ -26,13 +30,14 @@ pub struct Container<'a, Message, Renderer> {
     max_height: u32,
     horizontal_alignment: alignment::Horizontal,
     vertical_alignment: alignment::Vertical,
-    style_sheet: Box<dyn StyleSheet + 'a>,
+    style: <Renderer::Theme as StyleSheet>::Style,
     content: Element<'a, Message, Renderer>,
 }
 
 impl<'a, Message, Renderer> Container<'a, Message, Renderer>
 where
     Renderer: crate::Renderer,
+    Renderer::Theme: StyleSheet,
 {
     /// Creates an empty [`Container`].
     pub fn new<T>(content: T) -> Self
@@ -47,7 +52,7 @@ where
             max_height: u32::MAX,
             horizontal_alignment: alignment::Horizontal::Left,
             vertical_alignment: alignment::Vertical::Top,
-            style_sheet: Default::default(),
+            style: Default::default(),
             content: content.into(),
         }
     }
@@ -109,9 +114,9 @@ where
     /// Sets the style of the [`Container`].
     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
     }
 }
@@ -146,6 +151,7 @@ impl<'a, Message, Renderer> Widget<Message, Renderer>
     for Container<'a, Message, Renderer>
 where
     Renderer: crate::Renderer,
+    Renderer::Theme: StyleSheet,
 {
     fn width(&self) -> Length {
         self.width
@@ -215,7 +221,7 @@ where
         cursor_position: Point,
         viewport: &Rectangle,
     ) {
-        let style = self.style_sheet.style();
+        let style = theme.appearance(self.style);
 
         draw_background(renderer, &style, layout.bounds());
 
@@ -246,20 +252,20 @@ where
 /// Draws the background of a [`Container`] given its [`Style`] and its `bounds`.
 pub fn draw_background<Renderer>(
     renderer: &mut Renderer,
-    style: &Style,
+    appearance: &Appearance,
     bounds: Rectangle,
 ) where
     Renderer: crate::Renderer,
 {
-    if style.background.is_some() || style.border_width > 0.0 {
+    if appearance.background.is_some() || appearance.border_width > 0.0 {
         renderer.fill_quad(
             renderer::Quad {
                 bounds,
-                border_radius: style.border_radius,
-                border_width: style.border_width,
-                border_color: style.border_color,
+                border_radius: appearance.border_radius,
+                border_width: appearance.border_width,
+                border_color: appearance.border_color,
             },
-            style
+            appearance
                 .background
                 .unwrap_or(Background::Color(Color::TRANSPARENT)),
         );
@@ -269,8 +275,9 @@ pub fn draw_background<Renderer>(
 impl<'a, Message, Renderer> From<Container<'a, Message, Renderer>>
     for Element<'a, Message, Renderer>
 where
-    Renderer: 'a + crate::Renderer,
     Message: 'a,
+    Renderer: 'a + crate::Renderer,
+    Renderer::Theme: StyleSheet,
 {
     fn from(
         column: Container<'a, Message, Renderer>,
diff --git a/native/src/widget/pane_grid.rs b/native/src/widget/pane_grid.rs
index f903c021..eb969dbf 100644
--- a/native/src/widget/pane_grid.rs
+++ b/native/src/widget/pane_grid.rs
@@ -36,6 +36,7 @@ use crate::mouse;
 use crate::overlay;
 use crate::renderer;
 use crate::touch;
+use crate::widget::container;
 use crate::{
     Clipboard, Color, Element, Layout, Length, Point, Rectangle, Shell, Size,
     Vector, Widget,
@@ -96,7 +97,7 @@ pub use iced_style::pane_grid::{Line, StyleSheet};
 pub struct PaneGrid<'a, Message, Renderer>
 where
     Renderer: crate::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + container::StyleSheet,
 {
     state: &'a mut state::Internal,
     action: &'a mut state::Action,
@@ -113,7 +114,7 @@ where
 impl<'a, Message, Renderer> PaneGrid<'a, Message, Renderer>
 where
     Renderer: crate::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + container::StyleSheet,
 {
     /// Creates a [`PaneGrid`] with the given [`State`] and view function.
     ///
@@ -659,7 +660,7 @@ impl<'a, Message, Renderer> Widget<Message, Renderer>
     for PaneGrid<'a, Message, Renderer>
 where
     Renderer: crate::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + container::StyleSheet,
 {
     fn width(&self) -> Length {
         self.width
@@ -815,7 +816,7 @@ impl<'a, Message, Renderer> From<PaneGrid<'a, Message, Renderer>>
 where
     Message: 'a,
     Renderer: 'a + crate::Renderer,
-    Renderer::Theme: StyleSheet,
+    Renderer::Theme: StyleSheet + container::StyleSheet,
 {
     fn from(
         pane_grid: PaneGrid<'a, Message, Renderer>,
diff --git a/native/src/widget/pane_grid/content.rs b/native/src/widget/pane_grid/content.rs
index 6b3ff680..4c9e65c9 100644
--- a/native/src/widget/pane_grid/content.rs
+++ b/native/src/widget/pane_grid/content.rs
@@ -11,22 +11,27 @@ use crate::{Clipboard, Element, Layout, Point, Rectangle, Shell, Size};
 ///
 /// [`Pane`]: crate::widget::pane_grid::Pane
 #[allow(missing_debug_implementations)]
-pub struct Content<'a, Message, Renderer> {
+pub struct Content<'a, Message, Renderer>
+where
+    Renderer: crate::Renderer,
+    Renderer::Theme: container::StyleSheet,
+{
     title_bar: Option<TitleBar<'a, Message, Renderer>>,
     body: Element<'a, Message, Renderer>,
-    style_sheet: Box<dyn container::StyleSheet + 'a>,
+    style: <Renderer::Theme as container::StyleSheet>::Style,
 }
 
 impl<'a, Message, Renderer> Content<'a, Message, Renderer>
 where
     Renderer: crate::Renderer,
+    Renderer::Theme: container::StyleSheet,
 {
     /// Creates a new [`Content`] with the provided body.
     pub fn new(body: impl Into<Element<'a, Message, Renderer>>) -> Self {
         Self {
             title_bar: None,
             body: body.into(),
-            style_sheet: Default::default(),
+            style: Default::default(),
         }
     }
 
@@ -42,9 +47,9 @@ where
     /// Sets the style of the [`Content`].
     pub fn style(
         mut self,
-        style_sheet: impl Into<Box<dyn container::StyleSheet + 'a>>,
+        style: impl Into<<Renderer::Theme as container::StyleSheet>::Style>,
     ) -> Self {
-        self.style_sheet = style_sheet.into();
+        self.style = style.into();
         self
     }
 }
@@ -52,6 +57,7 @@ where
 impl<'a, Message, Renderer> Content<'a, Message, Renderer>
 where
     Renderer: crate::Renderer,
+    Renderer::Theme: container::StyleSheet,
 {
     /// Draws the [`Content`] with the provided [`Renderer`] and [`Layout`].
     ///
@@ -65,10 +71,12 @@ where
         cursor_position: Point,
         viewport: &Rectangle,
     ) {
+        use container::StyleSheet;
+
         let bounds = layout.bounds();
 
         {
-            let style = self.style_sheet.style();
+            let style = theme.appearance(self.style);
 
             container::draw_background(renderer, &style, bounds);
         }
@@ -248,6 +256,7 @@ where
 impl<'a, Message, Renderer> Draggable for &Content<'a, Message, Renderer>
 where
     Renderer: crate::Renderer,
+    Renderer::Theme: container::StyleSheet,
 {
     fn can_be_dragged_at(
         &self,
@@ -269,6 +278,7 @@ impl<'a, T, Message, Renderer> From<T> for Content<'a, Message, Renderer>
 where
     T: Into<Element<'a, Message, Renderer>>,
     Renderer: crate::Renderer,
+    Renderer::Theme: container::StyleSheet,
 {
     fn from(element: T) -> Self {
         Self::new(element)
diff --git a/native/src/widget/pane_grid/title_bar.rs b/native/src/widget/pane_grid/title_bar.rs
index 1392d505..2a028dd5 100644
--- a/native/src/widget/pane_grid/title_bar.rs
+++ b/native/src/widget/pane_grid/title_bar.rs
@@ -12,17 +12,22 @@ use crate::{
 ///
 /// [`Pane`]: crate::widget::pane_grid::Pane
 #[allow(missing_debug_implementations)]
-pub struct TitleBar<'a, Message, Renderer> {
+pub struct TitleBar<'a, Message, Renderer>
+where
+    Renderer: crate::Renderer,
+    Renderer::Theme: container::StyleSheet,
+{
     content: Element<'a, Message, Renderer>,
     controls: Option<Element<'a, Message, Renderer>>,
     padding: Padding,
     always_show_controls: bool,
-    style_sheet: Box<dyn container::StyleSheet + 'a>,
+    style: <Renderer::Theme as container::StyleSheet>::Style,
 }
 
 impl<'a, Message, Renderer> TitleBar<'a, Message, Renderer>
 where
     Renderer: crate::Renderer,
+    Renderer::Theme: container::StyleSheet,
 {
     /// Creates a new [`TitleBar`] with the given content.
     pub fn new<E>(content: E) -> Self
@@ -34,7 +39,7 @@ where
             controls: None,
             padding: Padding::ZERO,
             always_show_controls: false,
-            style_sheet: Default::default(),
+            style: Default::default(),
         }
     }
 
@@ -56,9 +61,9 @@ where
     /// Sets the style of the [`TitleBar`].
     pub fn style(
         mut self,
-        style: impl Into<Box<dyn container::StyleSheet + 'a>>,
+        style: impl Into<<Renderer::Theme as container::StyleSheet>::Style>,
     ) -> Self {
-        self.style_sheet = style.into();
+        self.style = style.into();
         self
     }
 
@@ -79,6 +84,7 @@ where
 impl<'a, Message, Renderer> TitleBar<'a, Message, Renderer>
 where
     Renderer: crate::Renderer,
+    Renderer::Theme: container::StyleSheet,
 {
     /// Draws the [`TitleBar`] with the provided [`Renderer`] and [`Layout`].
     ///
@@ -93,8 +99,10 @@ where
         viewport: &Rectangle,
         show_controls: bool,
     ) {
+        use container::StyleSheet;
+
         let bounds = layout.bounds();
-        let style = self.style_sheet.style();
+        let style = theme.appearance(self.style);
         let inherited_style = renderer::Style {
             text_color: style.text_color.unwrap_or(inherited_style.text_color),
         };
diff --git a/native/src/widget/pick_list.rs b/native/src/widget/pick_list.rs
index b19c65ed..eea5862a 100644
--- a/native/src/widget/pick_list.rs
+++ b/native/src/widget/pick_list.rs
@@ -9,6 +9,7 @@ use crate::overlay::menu::{self, Menu};
 use crate::renderer;
 use crate::text::{self, Text};
 use crate::touch;
+use crate::widget::container;
 use crate::widget::scrollable;
 use crate::{
     Clipboard, Element, Layout, Length, Padding, Point, Rectangle, Shell, Size,
@@ -323,7 +324,7 @@ pub fn overlay<'a, T, Message, Renderer>(
 where
     Message: 'a,
     Renderer: text::Renderer + 'a,
-    Renderer::Theme: scrollable::StyleSheet,
+    Renderer::Theme: container::StyleSheet + scrollable::StyleSheet,
     T: Clone + ToString,
 {
     if state.is_open {
@@ -432,7 +433,7 @@ where
     [T]: ToOwned<Owned = Vec<T>>,
     Message: 'static,
     Renderer: text::Renderer + 'a,
-    Renderer::Theme: scrollable::StyleSheet,
+    Renderer::Theme: container::StyleSheet + scrollable::StyleSheet,
 {
     fn width(&self) -> Length {
         self.width
@@ -536,7 +537,7 @@ where
     [T]: ToOwned<Owned = Vec<T>>,
     Message: 'static,
     Renderer: text::Renderer + 'a,
-    Renderer::Theme: scrollable::StyleSheet,
+    Renderer::Theme: container::StyleSheet + scrollable::StyleSheet,
 {
     fn into(self) -> Element<'a, Message, Renderer> {
         Element::new(self)
diff --git a/native/src/widget/tooltip.rs b/native/src/widget/tooltip.rs
index 141aa5c8..d034f648 100644
--- a/native/src/widget/tooltip.rs
+++ b/native/src/widget/tooltip.rs
@@ -13,18 +13,23 @@ use crate::{
 
 /// An element to display a widget over another.
 #[allow(missing_debug_implementations)]
-pub struct Tooltip<'a, Message, Renderer: text::Renderer> {
+pub struct Tooltip<'a, Message, Renderer>
+where
+    Renderer: text::Renderer,
+    Renderer::Theme: container::StyleSheet,
+{
     content: Element<'a, Message, Renderer>,
     tooltip: Text<Renderer>,
     position: Position,
-    style_sheet: Box<dyn container::StyleSheet + 'a>,
     gap: u16,
     padding: u16,
+    style: <Renderer::Theme as container::StyleSheet>::Style,
 }
 
 impl<'a, Message, Renderer> Tooltip<'a, Message, Renderer>
 where
     Renderer: text::Renderer,
+    Renderer::Theme: container::StyleSheet,
 {
     /// The default padding of a [`Tooltip`] drawn by this renderer.
     const DEFAULT_PADDING: u16 = 5;
@@ -41,9 +46,9 @@ where
             content: content.into(),
             tooltip: Text::new(tooltip.to_string()),
             position,
-            style_sheet: Default::default(),
             gap: 0,
             padding: Self::DEFAULT_PADDING,
+            style: Default::default(),
         }
     }
 
@@ -76,9 +81,9 @@ where
     /// Sets the style of the [`Tooltip`].
     pub fn style(
         mut self,
-        style_sheet: impl Into<Box<dyn container::StyleSheet + 'a>>,
+        style: impl Into<<Renderer::Theme as container::StyleSheet>::Style>,
     ) -> Self {
-        self.style_sheet = style_sheet.into();
+        self.style = style.into();
         self
     }
 }
@@ -99,8 +104,9 @@ pub enum Position {
 }
 
 /// Draws a [`Tooltip`].
-pub fn draw<Renderer: crate::Renderer>(
+pub fn draw<Renderer>(
     renderer: &mut Renderer,
+    theme: &Renderer::Theme,
     inherited_style: &renderer::Style,
     layout: Layout<'_>,
     cursor_position: Point,
@@ -108,7 +114,7 @@ pub fn draw<Renderer: crate::Renderer>(
     position: Position,
     gap: u16,
     padding: u16,
-    style_sheet: &dyn container::StyleSheet,
+    style: <Renderer::Theme as container::StyleSheet>::Style,
     layout_text: impl FnOnce(&Renderer, &layout::Limits) -> layout::Node,
     draw_text: impl FnOnce(
         &mut Renderer,
@@ -117,12 +123,17 @@ pub fn draw<Renderer: crate::Renderer>(
         Point,
         &Rectangle,
     ),
-) {
+) where
+    Renderer: crate::Renderer,
+    Renderer::Theme: container::StyleSheet,
+{
+    use container::StyleSheet;
+
     let bounds = layout.bounds();
 
     if bounds.contains(cursor_position) {
         let gap = f32::from(gap);
-        let style = style_sheet.style();
+        let style = theme.appearance(style);
 
         let defaults = renderer::Style {
             text_color: style.text_color.unwrap_or(inherited_style.text_color),
@@ -213,6 +224,7 @@ impl<'a, Message, Renderer> Widget<Message, Renderer>
     for Tooltip<'a, Message, Renderer>
 where
     Renderer: text::Renderer,
+    Renderer::Theme: container::StyleSheet,
 {
     fn width(&self) -> Length {
         self.content.width()
@@ -286,6 +298,7 @@ where
 
         draw(
             renderer,
+            theme,
             inherited_style,
             layout,
             cursor_position,
@@ -293,7 +306,7 @@ where
             self.position,
             self.gap,
             self.padding,
-            self.style_sheet.as_ref(),
+            self.style,
             |renderer, limits| {
                 Widget::<(), Renderer>::layout(tooltip, renderer, limits)
             },
@@ -315,8 +328,9 @@ where
 impl<'a, Message, Renderer> From<Tooltip<'a, Message, Renderer>>
     for Element<'a, Message, Renderer>
 where
-    Renderer: 'a + text::Renderer,
     Message: 'a,
+    Renderer: 'a + text::Renderer,
+    Renderer::Theme: container::StyleSheet,
 {
     fn from(
         tooltip: Tooltip<'a, Message, Renderer>,