Merge pull request #1578 from iced-rs/svg-styling

Svg styling

1 files changed, 54 insertions, 17 deletions

diff --git a/examples/svg/src/main.rs b/examples/svg/src/main.rs
index 27d175da..4dc92416 100644
--- a/examples/svg/src/main.rs
+++ b/examples/svg/src/main.rs
@@ -1,39 +1,76 @@
-use iced::widget::{container, svg};
-use iced::{Element, Length, Sandbox, Settings};
+use iced::theme;
+use iced::widget::{checkbox, column, container, svg};
+use iced::{color, Element, Length, Sandbox, Settings};
 
 pub fn main() -> iced::Result {
     Tiger::run(Settings::default())
 }
 
-struct Tiger;
+#[derive(Debug, Default)]
+struct Tiger {
+    apply_color_filter: bool,
+}
+
+#[derive(Debug, Clone, Copy)]
+pub enum Message {
+    ToggleColorFilter(bool),
+}
 
 impl Sandbox for Tiger {
-    type Message = ();
+    type Message = Message;
 
     fn new() -> Self {
-        Tiger
+        Tiger::default()
     }
 
     fn title(&self) -> String {
         String::from("SVG - Iced")
     }
 
-    fn update(&mut self, _message: ()) {}
+    fn update(&mut self, message: Self::Message) {
+        match message {
+            Message::ToggleColorFilter(apply_color_filter) => {
+                self.apply_color_filter = apply_color_filter;
+            }
+        }
+    }
 
-    fn view(&self) -> Element<()> {
-        let svg = svg(svg::Handle::from_path(format!(
+    fn view(&self) -> Element<Self::Message> {
+        let handle = svg::Handle::from_path(format!(
             "{}/resources/tiger.svg",
             env!("CARGO_MANIFEST_DIR")
-        )))
-        .width(Length::Fill)
-        .height(Length::Fill);
+        ));
+
+        let svg = svg(handle).width(Length::Fill).height(Length::Fill).style(
+            if self.apply_color_filter {
+                theme::Svg::custom_fn(|_theme| svg::Appearance {
+                    color: Some(color!(0x0000ff)),
+                })
+            } else {
+                theme::Svg::Default
+            },
+        );
 
-        container(svg)
+        let apply_color_filter = checkbox(
+            "Apply a color filter",
+            self.apply_color_filter,
+            Message::ToggleColorFilter,
+        );
+
+        container(
+            column![
+                svg,
+                container(apply_color_filter).width(Length::Fill).center_x()
+            ]
+            .spacing(20)
             .width(Length::Fill)
-            .height(Length::Fill)
-            .padding(20)
-            .center_x()
-            .center_y()
-            .into()
+            .height(Length::Fill),
+        )
+        .width(Length::Fill)
+        .height(Length::Fill)
+        .padding(20)
+        .center_x()
+        .center_y()
+        .into()
     }
 }