Simplify gradients example

examples/gradients/src/main.rs

@@ -8,16 +8,17 @@ pub fn main() -> iced::Result {
     Gradient::run(Settings::default())
 }
 
+#[derive(Debug, Clone, Copy)]
 struct Gradient {
-    first: Color,
+    start: Color,
-    second: Color,
+    end: Color,
     angle: f32,
 }
 
 #[derive(Debug, Clone, Copy)]
 enum Message {
-    FirstChanged(Color),
+    StartChanged(Color),
-    SecondChanged(Color),
+    EndChanged(Color),
     AngleChanged(f32),
 }
 
@@ -25,32 +26,30 @@ impl Sandbox for Gradient {
     type Message = Message;
 
     fn new() -> Self {
-        let first = Color::new(0.2784314, 0.0627451, 0.4117647, 1.0);
+        let start = Color::new(1.0, 1.0, 1.0, 1.0);
-        let second = Color::new(0.1882353, 0.772549, 0.8235294, 1.0);
+        let end = Color::new(0.0, 0.0, 1.0, 1.0);
 
         Self {
-            first,
+            start,
-            second,
+            end,
             angle: 0.0,
         }
     }
 
     fn title(&self) -> String {
-        String::from("Color gradient")
+        String::from("Gradient")
     }
 
     fn update(&mut self, message: Message) {
         match message {
-            Message::FirstChanged(color) => self.first = color,
+            Message::StartChanged(color) => self.start = color,
-            Message::SecondChanged(color) => self.second = color,
+            Message::EndChanged(color) => self.end = color,
             Message::AngleChanged(angle) => self.angle = angle,
         }
     }
 
     fn view(&self) -> Element<Message> {
-        let first = self.first;
+        let Self { start, end, angle } = *self;
-        let second = self.second;
-        let angle = self.angle;
 
         let gradient_box = container(text(""))
             .width(Length::Fill)
@@ -58,10 +57,12 @@ impl Sandbox for Gradient {
             .center_x()
             .center_y()
             .style(move |_: &_| {
-                let gradient = gradient::Linear::new(Radians(angle))
+                let gradient = gradient::Linear::new(Radians(
-                    .add_stop(0.0, first)
+                    angle + std::f32::consts::PI,
-                    .add_stop(1.0, second)
+                ))
-                    .into();
+                .add_stop(0.0, start)
+                .add_stop(1.0, end)
+                .into();
 
                 container::Appearance {
                     text_color: None,
@@ -72,48 +73,6 @@ impl Sandbox for Gradient {
                 }
             });
 
-        let range = 0.0..=1.0;
-        let l = self.first;
-        let r = self.second;
-
-        let first_color_picker = row![
-            text("First").width(64),
-            slider(range.clone(), l.r, move |v| {
-                Message::FirstChanged(Color::new(v, l.g, l.b, l.a))
-            })
-            .step(0.01),
-            slider(range.clone(), l.g, move |v| {
-                Message::FirstChanged(Color::new(l.r, v, l.b, l.a))
-            })
-            .step(0.01),
-            slider(range.clone(), l.b, move |v| {
-                Message::FirstChanged(Color::new(l.r, l.g, v, l.a))
-            })
-            .step(0.01),
-        ]
-        .spacing(8)
-        .padding(8)
-        .align_items(Alignment::Center);
-
-        let second_color_picker = row![
-            text("Second").width(64),
-            slider(range.clone(), r.r, move |v| {
-                Message::SecondChanged(Color::new(v, r.g, r.b, r.a))
-            })
-            .step(0.01),
-            slider(range.clone(), r.g, move |v| {
-                Message::SecondChanged(Color::new(r.r, v, r.b, r.a))
-            })
-            .step(0.01),
-            slider(range.clone(), r.b, move |v| {
-                Message::SecondChanged(Color::new(r.r, r.g, v, r.a))
-            })
-            .step(0.01),
-        ]
-        .spacing(8)
-        .padding(8)
-        .align_items(Alignment::Center);
-
         let angle_picker = row![
             text("Angle").width(64),
             slider(0.0..=std::f32::consts::PI * 2.0, self.angle, move |v| {
@@ -126,11 +85,27 @@ impl Sandbox for Gradient {
         .align_items(Alignment::Center);
 
         column![
-            first_color_picker,
+            color_picker("Start", self.start).map(Message::StartChanged),
-            second_color_picker,
+            color_picker("End", self.end).map(Message::EndChanged),
             angle_picker,
             gradient_box
         ]
         .into()
     }
 }
+
+fn color_picker(label: &str, color: Color) -> Element<'_, Color> {
+    row![
+        text(label).width(64),
+        slider(0.0..=1.0, color.r, move |r| { Color { r, ..color } })
+            .step(0.01),
+        slider(0.0..=1.0, color.g, move |g| { Color { g, ..color } })
+            .step(0.01),
+        slider(0.0..=1.0, color.b, move |b| { Color { b, ..color } })
+            .step(0.01),
+    ]
+    .spacing(8)
+    .padding(8)
+    .align_items(Alignment::Center)
+    .into()
+}