docs/bevy/examples/ui/styling/stacked_gradients.rs 3.3 K · 91 lines · raw · history

1 //! An example demonstrating overlaid gradients
2
3 use bevy::color::palettes::css::BLUE;
4 use bevy::color::palettes::css::RED;
5 use bevy::color::palettes::css::YELLOW;
6 use bevy::prelude::*;
7 use core::f32::consts::TAU;
8
9 fn main() {
10 App::new()
11 .add_plugins(DefaultPlugins)
12 .add_systems(Startup, setup)
13 .run();
14 }
15
16 fn setup(mut commands: Commands) {
17 commands.spawn(Camera2d);
18 commands
19 .spawn(Node {
20 display: Display::Grid,
21 width: percent(100),
22 height: percent(100),
23
24 ..Default::default()
25 })
26 .with_children(|commands| {
27 commands.spawn((
28 Node {
29 width: percent(100),
30 height: percent(100),
31 ..Default::default()
32 },
33 BackgroundColor(Color::BLACK),
34 BackgroundGradient(vec![
35 LinearGradient::to_top_right(vec![
36 ColorStop::auto(RED),
37 ColorStop::auto(RED.with_alpha(0.)),
38 ])
39 .into(),
40 LinearGradient::to_top_left(vec![
41 ColorStop::auto(BLUE),
42 ColorStop::auto(BLUE.with_alpha(0.)),
43 ])
44 .into(),
45 ConicGradient {
46 start: 0.,
47 position: UiPosition::CENTER,
48 stops: vec![
49 AngularColorStop::auto(YELLOW.with_alpha(0.)),
50 AngularColorStop::auto(YELLOW.with_alpha(0.)),
51 AngularColorStop::auto(YELLOW),
52 AngularColorStop::auto(YELLOW.with_alpha(0.)),
53 AngularColorStop::auto(YELLOW.with_alpha(0.)),
54 ],
55 ..Default::default()
56 }
57 .into(),
58 RadialGradient {
59 position: UiPosition::TOP.at_x(percent(5)),
60 shape: RadialGradientShape::Circle(vh(30)),
61 stops: vec![
62 ColorStop::auto(Color::WHITE),
63 ColorStop::auto(YELLOW),
64 ColorStop::auto(YELLOW.with_alpha(0.1)),
65 ColorStop::auto(YELLOW.with_alpha(0.)),
66 ],
67 ..Default::default()
68 }
69 .into(),
70 LinearGradient {
71 angle: TAU / 16.,
72 stops: vec![
73 ColorStop::auto(Color::BLACK),
74 ColorStop::auto(Color::BLACK.with_alpha(0.)),
75 ],
76 ..Default::default()
77 }
78 .into(),
79 LinearGradient {
80 angle: 15. * TAU / 16.,
81 stops: vec![
82 ColorStop::auto(Color::BLACK),
83 ColorStop::auto(Color::BLACK.with_alpha(0.)),
84 ],
85 ..Default::default()
86 }
87 .into(),
88 ]),
89 ));
90 });
91 }