From 188db4da48954b95a3fe79bcd22689ffc3a661e0 Mon Sep 17 00:00:00 2001
From: Héctor Ramón Jiménez <hector@hecrj.dev>
Date: Thu, 21 Mar 2024 05:52:48 +0100
Subject: Draft support for dynamic custom renderer injection

---
 widget/src/svg.rs | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

(limited to 'widget/src/svg.rs')

diff --git a/widget/src/svg.rs b/widget/src/svg.rs
index 1ac07ade..53c45bcb 100644
--- a/widget/src/svg.rs
+++ b/widget/src/svg.rs
@@ -108,7 +108,7 @@ where
         limits: &layout::Limits,
     ) -> layout::Node {
         // The raw w/h of the underlying image
-        let Size { width, height } = renderer.dimensions(&self.handle);
+        let Size { width, height } = renderer.measure_svg(&self.handle);
         let image_size = Size::new(width as f32, height as f32);
 
         // The size to be available to the widget prior to `Shrink`ing
@@ -142,7 +142,7 @@ where
         cursor: mouse::Cursor,
         _viewport: &Rectangle,
     ) {
-        let Size { width, height } = renderer.dimensions(&self.handle);
+        let Size { width, height } = renderer.measure_svg(&self.handle);
         let image_size = Size::new(width as f32, height as f32);
 
         let bounds = layout.bounds();
@@ -169,7 +169,7 @@ where
 
             let appearance = (self.style)(theme, status);
 
-            renderer.draw(
+            renderer.draw_svg(
                 self.handle.clone(),
                 appearance.color,
                 drawing_bounds + offset,
-- 
cgit 


From e657dc2ecd2ffa72c0abd87f9a59dcc1acbc7083 Mon Sep 17 00:00:00 2001
From: Héctor Ramón Jiménez <hector@hecrj.dev>
Date: Sun, 24 Mar 2024 02:08:20 +0100
Subject: Fine-tune `Catalog` approach for `button`, `checkbox`, and `svg`

---
 widget/src/svg.rs | 89 ++++++++++++++++++++++++++++++++++---------------------
 1 file changed, 56 insertions(+), 33 deletions(-)

(limited to 'widget/src/svg.rs')

diff --git a/widget/src/svg.rs b/widget/src/svg.rs
index 1ac07ade..d2fd0aee 100644
--- a/widget/src/svg.rs
+++ b/widget/src/svg.rs
@@ -20,36 +20,36 @@ pub use crate::core::svg::Handle;
 /// [`Svg`] images can have a considerable rendering cost when resized,
 /// specially when they are complex.
 #[allow(missing_debug_implementations)]
-pub struct Svg<'a, Theme = crate::Theme> {
+pub struct Svg<'a, Theme = crate::Theme>
+where
+    Theme: Catalog,
+{
     handle: Handle,
     width: Length,
     height: Length,
     content_fit: ContentFit,
-    style: Style<'a, Theme>,
+    class: Theme::Class<'a>,
 }
 
-impl<'a, Theme> Svg<'a, Theme> {
+impl<'a, Theme> Svg<'a, Theme>
+where
+    Theme: Catalog,
+{
     /// Creates a new [`Svg`] from the given [`Handle`].
-    pub fn new(handle: impl Into<Handle>) -> Self
-    where
-        Theme: DefaultStyle + 'a,
-    {
+    pub fn new(handle: impl Into<Handle>) -> Self {
         Svg {
             handle: handle.into(),
             width: Length::Fill,
             height: Length::Shrink,
             content_fit: ContentFit::Contain,
-            style: Box::new(Theme::default_style),
+            class: Theme::default(),
         }
     }
 
     /// Creates a new [`Svg`] that will display the contents of the file at the
     /// provided path.
     #[must_use]
-    pub fn from_path(path: impl Into<PathBuf>) -> Self
-    where
-        Theme: DefaultStyle + 'a,
-    {
+    pub fn from_path(path: impl Into<PathBuf>) -> Self {
         Self::new(Handle::from_path(path))
     }
 
@@ -78,13 +78,21 @@ impl<'a, Theme> Svg<'a, Theme> {
         }
     }
 
-    /// Sets the style variant of this [`Svg`].
+    /// Sets the style of this [`Svg`].
+    #[must_use]
+    pub fn style(mut self, style: impl Fn(&Theme, Status) -> Style + 'a) -> Self
+    where
+        Theme::Class<'a>: From<StyleFn<'a, Theme>>,
+    {
+        self.class = (Box::new(style) as StyleFn<'a, Theme>).into();
+        self
+    }
+
+    /// Sets the style class of this [`Svg`].
+    #[cfg(feature = "advanced")]
     #[must_use]
-    pub fn style(
-        mut self,
-        style: impl Fn(&Theme, Status) -> Appearance + 'a,
-    ) -> Self {
-        self.style = Box::new(style);
+    pub fn class(mut self, class: impl Into<Theme::Class<'a>>) -> Self {
+        self.class = class.into();
         self
     }
 }
@@ -93,6 +101,7 @@ impl<'a, Message, Theme, Renderer> Widget<Message, Theme, Renderer>
     for Svg<'a, Theme>
 where
     Renderer: svg::Renderer,
+    Theme: Catalog,
 {
     fn size(&self) -> Size<Length> {
         Size {
@@ -167,7 +176,7 @@ where
                 Status::Idle
             };
 
-            let appearance = (self.style)(theme, status);
+            let appearance = theme.style(&self.class, status);
 
             renderer.draw(
                 self.handle.clone(),
@@ -189,7 +198,7 @@ where
 impl<'a, Message, Theme, Renderer> From<Svg<'a, Theme>>
     for Element<'a, Message, Theme, Renderer>
 where
-    Theme: 'a,
+    Theme: Catalog + 'a,
     Renderer: svg::Renderer + 'a,
 {
     fn from(icon: Svg<'a, Theme>) -> Element<'a, Message, Theme, Renderer> {
@@ -208,7 +217,7 @@ pub enum Status {
 
 /// The appearance of an [`Svg`].
 #[derive(Debug, Clone, Copy, PartialEq, Default)]
-pub struct Appearance {
+pub struct Style {
     /// The [`Color`] filter of an [`Svg`].
     ///
     /// Useful for coloring a symbolic icon.
@@ -217,23 +226,37 @@ pub struct Appearance {
     pub color: Option<Color>,
 }
 
-/// The style of an [`Svg`].
-pub type Style<'a, Theme> = Box<dyn Fn(&Theme, Status) -> Appearance + 'a>;
+/// The theme catalog of an [`Svg`].
+pub trait Catalog {
+    /// The item class of this [`Catalog`].
+    type Class<'a>;
+
+    /// The default class produced by this [`Catalog`].
+    fn default<'a>() -> Self::Class<'a>;
 
-/// The default style of an [`Svg`].
-pub trait DefaultStyle {
-    /// Returns the default style of an [`Svg`].
-    fn default_style(&self, status: Status) -> Appearance;
+    /// The [`Style`] of a class with the given status.
+    fn style(&self, class: &Self::Class<'_>, status: Status) -> Style;
 }
 
-impl DefaultStyle for Theme {
-    fn default_style(&self, _status: Status) -> Appearance {
-        Appearance::default()
+impl Catalog for Theme {
+    type Class<'a> = StyleFn<'a, Self>;
+
+    fn default<'a>() -> Self::Class<'a> {
+        Box::new(|_theme, _status| Style::default())
+    }
+
+    fn style(&self, class: &Self::Class<'_>, status: Status) -> Style {
+        class(self, status)
     }
 }
 
-impl DefaultStyle for Appearance {
-    fn default_style(&self, _status: Status) -> Appearance {
-        *self
+/// A styling function for an [`Svg`].
+///
+/// This is just a boxed closure: `Fn(&Theme, Status) -> Style`.
+pub type StyleFn<'a, Theme> = Box<dyn Fn(&Theme, Status) -> Style + 'a>;
+
+impl<'a, Theme> From<Style> for StyleFn<'a, Theme> {
+    fn from(style: Style) -> Self {
+        Box::new(move |_theme, _status| style)
     }
 }
-- 
cgit 


From f0ae9a0c38c2532220a7460916604914db94c078 Mon Sep 17 00:00:00 2001
From: Héctor Ramón Jiménez <hector@hecrj.dev>
Date: Sun, 24 Mar 2024 05:03:09 +0100
Subject: Use `Catalog` approach for all widgets

---
 widget/src/svg.rs | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

(limited to 'widget/src/svg.rs')

diff --git a/widget/src/svg.rs b/widget/src/svg.rs
index d2fd0aee..66988097 100644
--- a/widget/src/svg.rs
+++ b/widget/src/svg.rs
@@ -78,7 +78,7 @@ where
         }
     }
 
-    /// Sets the style of this [`Svg`].
+    /// Sets the style of the [`Svg`].
     #[must_use]
     pub fn style(mut self, style: impl Fn(&Theme, Status) -> Style + 'a) -> Self
     where
@@ -88,7 +88,7 @@ where
         self
     }
 
-    /// Sets the style class of this [`Svg`].
+    /// Sets the style class of the [`Svg`].
     #[cfg(feature = "advanced")]
     #[must_use]
     pub fn class(mut self, class: impl Into<Theme::Class<'a>>) -> Self {
@@ -176,11 +176,11 @@ where
                 Status::Idle
             };
 
-            let appearance = theme.style(&self.class, status);
+            let style = theme.style(&self.class, status);
 
             renderer.draw(
                 self.handle.clone(),
-                appearance.color,
+                style.color,
                 drawing_bounds + offset,
             );
         };
@@ -228,10 +228,10 @@ pub struct Style {
 
 /// The theme catalog of an [`Svg`].
 pub trait Catalog {
-    /// The item class of this [`Catalog`].
+    /// The item class of the [`Catalog`].
     type Class<'a>;
 
-    /// The default class produced by this [`Catalog`].
+    /// The default class produced by the [`Catalog`].
     fn default<'a>() -> Self::Class<'a>;
 
     /// The [`Style`] of a class with the given status.
-- 
cgit 


From 09a6bcfffc24f5abdc8709403bab7ae1e01563f1 Mon Sep 17 00:00:00 2001
From: Héctor Ramón Jiménez <hector@hecrj.dev>
Date: Thu, 2 May 2024 13:15:17 +0200
Subject: Add `Image` rotation support

Co-authored-by: DKolter <68352124+DKolter@users.noreply.github.com>
---
 widget/src/svg.rs | 65 ++++++++++++++++++++++++++++++++++++++++++-------------
 1 file changed, 50 insertions(+), 15 deletions(-)

(limited to 'widget/src/svg.rs')

diff --git a/widget/src/svg.rs b/widget/src/svg.rs
index eb142189..21946af8 100644
--- a/widget/src/svg.rs
+++ b/widget/src/svg.rs
@@ -5,8 +5,8 @@ use crate::core::renderer;
 use crate::core::svg;
 use crate::core::widget::Tree;
 use crate::core::{
-    Color, ContentFit, Element, Layout, Length, Rectangle, Size, Theme, Vector,
-    Widget,
+    Color, ContentFit, Element, Layout, Length, Point, Rectangle,
+    RotationLayout, Size, Theme, Widget,
 };
 
 use std::path::PathBuf;
@@ -29,6 +29,8 @@ where
     height: Length,
     content_fit: ContentFit,
     class: Theme::Class<'a>,
+    rotation: f32,
+    rotation_layout: RotationLayout,
 }
 
 impl<'a, Theme> Svg<'a, Theme>
@@ -43,6 +45,8 @@ where
             height: Length::Shrink,
             content_fit: ContentFit::Contain,
             class: Theme::default(),
+            rotation: 0.0,
+            rotation_layout: RotationLayout::Change,
         }
     }
 
@@ -95,6 +99,18 @@ where
         self.class = class.into();
         self
     }
+
+    /// Rotates the [`Svg`] by the given angle in radians.
+    pub fn rotation(mut self, degrees: f32) -> Self {
+        self.rotation = degrees;
+        self
+    }
+
+    /// Sets the [`RotationLayout`] of the [`Svg`].
+    pub fn rotation_layout(mut self, rotation_layout: RotationLayout) -> Self {
+        self.rotation_layout = rotation_layout;
+        self
+    }
 }
 
 impl<'a, Message, Theme, Renderer> Widget<Message, Theme, Renderer>
@@ -120,11 +136,16 @@ where
         let Size { width, height } = renderer.measure_svg(&self.handle);
         let image_size = Size::new(width as f32, height as f32);
 
+        // The rotated size of the svg
+        let rotated_size = self
+            .rotation_layout
+            .apply_to_size(image_size, self.rotation);
+
         // The size to be available to the widget prior to `Shrink`ing
-        let raw_size = limits.resolve(self.width, self.height, image_size);
+        let raw_size = limits.resolve(self.width, self.height, rotated_size);
 
         // The uncropped size of the image when fit to the bounds above
-        let full_size = self.content_fit.fit(image_size, raw_size);
+        let full_size = self.content_fit.fit(rotated_size, raw_size);
 
         // Shrink the widget to fit the resized image, if requested
         let final_size = Size {
@@ -153,23 +174,35 @@ where
     ) {
         let Size { width, height } = renderer.measure_svg(&self.handle);
         let image_size = Size::new(width as f32, height as f32);
+        let rotated_size = self
+            .rotation_layout
+            .apply_to_size(image_size, self.rotation);
 
         let bounds = layout.bounds();
-        let adjusted_fit = self.content_fit.fit(image_size, bounds.size());
+        let adjusted_fit = self.content_fit.fit(rotated_size, bounds.size());
+        let scale = Size::new(
+            adjusted_fit.width / rotated_size.width,
+            adjusted_fit.height / rotated_size.height,
+        );
+
         let is_mouse_over = cursor.is_over(bounds);
 
         let render = |renderer: &mut Renderer| {
-            let offset = Vector::new(
-                (bounds.width - adjusted_fit.width).max(0.0) / 2.0,
-                (bounds.height - adjusted_fit.height).max(0.0) / 2.0,
-            );
-
-            let drawing_bounds = Rectangle {
-                width: adjusted_fit.width,
-                height: adjusted_fit.height,
-                ..bounds
+            let position = match self.content_fit {
+                ContentFit::None => Point::new(
+                    bounds.position().x
+                        + (rotated_size.width - image_size.width) / 2.0,
+                    bounds.position().y
+                        + (rotated_size.height - image_size.height) / 2.0,
+                ),
+                _ => Point::new(
+                    bounds.center_x() - image_size.width / 2.0,
+                    bounds.center_y() - image_size.height / 2.0,
+                ),
             };
 
+            let drawing_bounds = Rectangle::new(position, image_size);
+
             let status = if is_mouse_over {
                 Status::Hovered
             } else {
@@ -181,7 +214,9 @@ where
             renderer.draw_svg(
                 self.handle.clone(),
                 style.color,
-                drawing_bounds + offset,
+                drawing_bounds,
+                self.rotation,
+                scale,
             );
         };
 
-- 
cgit 


From a57313b23ecb9843856ca0ea08635b6121fcb2cb Mon Sep 17 00:00:00 2001
From: Héctor Ramón Jiménez <hector@hecrj.dev>
Date: Thu, 2 May 2024 15:21:22 +0200
Subject: Simplify image rotation API and its internals

---
 widget/src/svg.rs | 81 +++++++++++++++++++++++--------------------------------
 1 file changed, 34 insertions(+), 47 deletions(-)

(limited to 'widget/src/svg.rs')

diff --git a/widget/src/svg.rs b/widget/src/svg.rs
index 21946af8..c1fccba1 100644
--- a/widget/src/svg.rs
+++ b/widget/src/svg.rs
@@ -5,8 +5,8 @@ use crate::core::renderer;
 use crate::core::svg;
 use crate::core::widget::Tree;
 use crate::core::{
-    Color, ContentFit, Element, Layout, Length, Point, Rectangle,
-    RotationLayout, Size, Theme, Widget,
+    Color, ContentFit, Element, Layout, Length, Point, Rectangle, Rotation,
+    Size, Theme, Vector, Widget,
 };
 
 use std::path::PathBuf;
@@ -29,8 +29,7 @@ where
     height: Length,
     content_fit: ContentFit,
     class: Theme::Class<'a>,
-    rotation: f32,
-    rotation_layout: RotationLayout,
+    rotation: Rotation,
 }
 
 impl<'a, Theme> Svg<'a, Theme>
@@ -45,8 +44,7 @@ where
             height: Length::Shrink,
             content_fit: ContentFit::Contain,
             class: Theme::default(),
-            rotation: 0.0,
-            rotation_layout: RotationLayout::Change,
+            rotation: Rotation::default(),
         }
     }
 
@@ -100,15 +98,9 @@ where
         self
     }
 
-    /// Rotates the [`Svg`] by the given angle in radians.
-    pub fn rotation(mut self, degrees: f32) -> Self {
-        self.rotation = degrees;
-        self
-    }
-
-    /// Sets the [`RotationLayout`] of the [`Svg`].
-    pub fn rotation_layout(mut self, rotation_layout: RotationLayout) -> Self {
-        self.rotation_layout = rotation_layout;
+    /// Applies the given [`Rotation`] to the [`Svg`].
+    pub fn rotation(mut self, rotation: impl Into<Rotation>) -> Self {
+        self.rotation = rotation.into();
         self
     }
 }
@@ -137,9 +129,7 @@ where
         let image_size = Size::new(width as f32, height as f32);
 
         // The rotated size of the svg
-        let rotated_size = self
-            .rotation_layout
-            .apply_to_size(image_size, self.rotation);
+        let rotated_size = self.rotation.apply(image_size);
 
         // The size to be available to the widget prior to `Shrink`ing
         let raw_size = limits.resolve(self.width, self.height, rotated_size);
@@ -174,49 +164,46 @@ where
     ) {
         let Size { width, height } = renderer.measure_svg(&self.handle);
         let image_size = Size::new(width as f32, height as f32);
-        let rotated_size = self
-            .rotation_layout
-            .apply_to_size(image_size, self.rotation);
+        let rotated_size = self.rotation.apply(image_size);
 
         let bounds = layout.bounds();
         let adjusted_fit = self.content_fit.fit(rotated_size, bounds.size());
-        let scale = Size::new(
+        let scale = Vector::new(
             adjusted_fit.width / rotated_size.width,
             adjusted_fit.height / rotated_size.height,
         );
 
+        let final_size = image_size * scale;
+
+        let position = match self.content_fit {
+            ContentFit::None => Point::new(
+                bounds.x + (rotated_size.width - adjusted_fit.width) / 2.0,
+                bounds.y + (rotated_size.height - adjusted_fit.height) / 2.0,
+            ),
+            _ => Point::new(
+                bounds.center_x() - final_size.width / 2.0,
+                bounds.center_y() - final_size.height / 2.0,
+            ),
+        };
+
+        let drawing_bounds = Rectangle::new(position, final_size);
+
         let is_mouse_over = cursor.is_over(bounds);
 
-        let render = |renderer: &mut Renderer| {
-            let position = match self.content_fit {
-                ContentFit::None => Point::new(
-                    bounds.position().x
-                        + (rotated_size.width - image_size.width) / 2.0,
-                    bounds.position().y
-                        + (rotated_size.height - image_size.height) / 2.0,
-                ),
-                _ => Point::new(
-                    bounds.center_x() - image_size.width / 2.0,
-                    bounds.center_y() - image_size.height / 2.0,
-                ),
-            };
-
-            let drawing_bounds = Rectangle::new(position, image_size);
-
-            let status = if is_mouse_over {
-                Status::Hovered
-            } else {
-                Status::Idle
-            };
-
-            let style = theme.style(&self.class, status);
+        let status = if is_mouse_over {
+            Status::Hovered
+        } else {
+            Status::Idle
+        };
 
+        let style = theme.style(&self.class, status);
+
+        let render = |renderer: &mut Renderer| {
             renderer.draw_svg(
                 self.handle.clone(),
                 style.color,
                 drawing_bounds,
-                self.rotation,
-                scale,
+                self.rotation.radians(),
             );
         };
 
-- 
cgit 


From fa9e1d96ea1924b51749b775ea0e67e69bc8a305 Mon Sep 17 00:00:00 2001
From: Héctor Ramón Jiménez <hector@hecrj.dev>
Date: Fri, 3 May 2024 13:25:58 +0200
Subject: Introduce dynamic `opacity` support for `Image` and `Svg`

---
 widget/src/svg.rs | 12 ++++++++++++
 1 file changed, 12 insertions(+)

(limited to 'widget/src/svg.rs')

diff --git a/widget/src/svg.rs b/widget/src/svg.rs
index c1fccba1..4551bcad 100644
--- a/widget/src/svg.rs
+++ b/widget/src/svg.rs
@@ -30,6 +30,7 @@ where
     content_fit: ContentFit,
     class: Theme::Class<'a>,
     rotation: Rotation,
+    opacity: f32,
 }
 
 impl<'a, Theme> Svg<'a, Theme>
@@ -45,6 +46,7 @@ where
             content_fit: ContentFit::Contain,
             class: Theme::default(),
             rotation: Rotation::default(),
+            opacity: 1.0,
         }
     }
 
@@ -103,6 +105,15 @@ where
         self.rotation = rotation.into();
         self
     }
+
+    /// Sets the opacity of the [`Svg`].
+    ///
+    /// It should be in the [0.0, 1.0] range—`0.0` meaning completely transparent,
+    /// and `1.0` meaning completely opaque.
+    pub fn opacity(mut self, opacity: impl Into<f32>) -> Self {
+        self.opacity = opacity.into();
+        self
+    }
 }
 
 impl<'a, Message, Theme, Renderer> Widget<Message, Theme, Renderer>
@@ -204,6 +215,7 @@ where
                 style.color,
                 drawing_bounds,
                 self.rotation.radians(),
+                self.opacity,
             );
         };
 
-- 
cgit