Gradients example: Fit in initial window (#19520)

# Objective

When running the `gradient` example, part of the content doesn't fit
within the initial window:
![Screenshot from 2025-06-07
11-42-59](https://github.com/user-attachments/assets/a54223db-0223-4a6e-b8e7-adb306706b28)

The UI requires 1830×930 pixels, but the initial window size is
1280×720.

## Solution

Make ui elements smaller:
![Screenshot from 2025-06-07
11-42-13](https://github.com/user-attachments/assets/c1afc01e-51be-4295-8c0f-6a983fbb0969)

Alternative: Use a larger initial window size. I decided against this
because that would make the examples less uniform, make the code less
focused on gradients and not help on web.
This commit is contained in:
SpecificProtagonist 2025-06-08 19:26:02 +02:00 committed by GitHub
parent 2c37bdeb47
commit b9754f963f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -26,20 +26,20 @@ fn setup(mut commands: Commands) {
commands commands
.spawn(Node { .spawn(Node {
flex_direction: FlexDirection::Column, flex_direction: FlexDirection::Column,
row_gap: Val::Px(30.), row_gap: Val::Px(20.),
margin: UiRect::all(Val::Px(30.)), margin: UiRect::all(Val::Px(20.)),
..Default::default() ..Default::default()
}) })
.with_children(|commands| { .with_children(|commands| {
for (b, stops) in [ for (b, stops) in [
( (
5., 4.,
vec![ vec![
ColorStop::new(Color::WHITE, Val::Percent(15.)), ColorStop::new(Color::WHITE, Val::Percent(15.)),
ColorStop::new(Color::BLACK, Val::Percent(85.)), ColorStop::new(Color::BLACK, Val::Percent(85.)),
], ],
), ),
(5., vec![RED.into(), BLUE.into(), LIME.into()]), (4., vec![RED.into(), BLUE.into(), LIME.into()]),
( (
0., 0.,
vec![ vec![
@ -64,11 +64,11 @@ fn setup(mut commands: Commands) {
commands commands
.spawn(Node { .spawn(Node {
flex_direction: FlexDirection::Column, flex_direction: FlexDirection::Column,
row_gap: Val::Px(10.), row_gap: Val::Px(5.),
..Default::default() ..Default::default()
}) })
.with_children(|commands| { .with_children(|commands| {
for (w, h) in [(100., 100.), (50., 100.), (100., 50.)] { for (w, h) in [(70., 70.), (35., 70.), (70., 35.)] {
commands commands
.spawn(Node { .spawn(Node {
column_gap: Val::Px(10.), column_gap: Val::Px(10.),
@ -108,7 +108,7 @@ fn setup(mut commands: Commands) {
aspect_ratio: Some(1.), aspect_ratio: Some(1.),
height: Val::Percent(100.), height: Val::Percent(100.),
border: UiRect::all(Val::Px(b)), border: UiRect::all(Val::Px(b)),
margin: UiRect::left(Val::Px(30.)), margin: UiRect::left(Val::Px(20.)),
..default() ..default()
}, },
BorderRadius::all(Val::Px(20.)), BorderRadius::all(Val::Px(20.)),
@ -128,7 +128,7 @@ fn setup(mut commands: Commands) {
aspect_ratio: Some(1.), aspect_ratio: Some(1.),
height: Val::Percent(100.), height: Val::Percent(100.),
border: UiRect::all(Val::Px(b)), border: UiRect::all(Val::Px(b)),
margin: UiRect::left(Val::Px(30.)), margin: UiRect::left(Val::Px(20.)),
..default() ..default()
}, },
BorderRadius::all(Val::Px(20.)), BorderRadius::all(Val::Px(20.)),
@ -148,7 +148,7 @@ fn setup(mut commands: Commands) {
aspect_ratio: Some(1.), aspect_ratio: Some(1.),
height: Val::Percent(100.), height: Val::Percent(100.),
border: UiRect::all(Val::Px(b)), border: UiRect::all(Val::Px(b)),
margin: UiRect::left(Val::Px(30.)), margin: UiRect::left(Val::Px(20.)),
..default() ..default()
}, },
BorderRadius::all(Val::Px(20.)), BorderRadius::all(Val::Px(20.)),