1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
|
use iced::gradient;
use iced::widget::{column, container, horizontal_space, row, slider, text};
use iced::{
Alignment, Background, Color, Element, Length, Radians, Sandbox, Settings,
};
pub fn main() -> iced::Result {
Gradient::run(Settings::default())
}
#[derive(Debug, Clone, Copy)]
struct Gradient {
start: Color,
end: Color,
angle: Radians,
}
#[derive(Debug, Clone, Copy)]
enum Message {
StartChanged(Color),
EndChanged(Color),
AngleChanged(Radians),
}
impl Sandbox for Gradient {
type Message = Message;
fn new() -> Self {
Self {
start: Color::WHITE,
end: Color::new(0.0, 0.0, 1.0, 1.0),
angle: Radians(0.0),
}
}
fn title(&self) -> String {
String::from("Gradient")
}
fn update(&mut self, message: Message) {
match message {
Message::StartChanged(color) => self.start = color,
Message::EndChanged(color) => self.end = color,
Message::AngleChanged(angle) => self.angle = angle,
}
}
fn view(&self) -> Element<Message> {
let Self { start, end, angle } = *self;
let gradient_box = container(horizontal_space(Length::Fill))
.width(Length::Fill)
.height(Length::Fill)
.style(move |_: &_| {
let gradient = gradient::Linear::new(angle)
.add_stop(0.0, start)
.add_stop(1.0, end)
.into();
container::Appearance {
background: Some(Background::Gradient(gradient)),
..Default::default()
}
});
let angle_picker = row![
text("Angle").width(64),
slider(Radians::RANGE, self.angle, Message::AngleChanged)
.step(0.01)
]
.spacing(8)
.padding(8)
.align_items(Alignment::Center);
column![
color_picker("Start", self.start).map(Message::StartChanged),
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()
}
|
