Update custom_transitions and sub_states examples to use children macro (#18292)

# Objective

Contributes to #18238 
Updates the `custom_transitions` and `sub_states` examples to use the
`children!` macro.

## Solution

Updates examples to use the Improved Spawning API merged in
https://github.com/bevyengine/bevy/pull/17521

## Testing

- Did you test these changes? If so, how?
- Opened the examples before and after and verified the same behavior
was observed. I did this on Ubuntu 24.04.2 LTS using `--features
wayland`.
- Are there any parts that need more testing?
- Other OS's and features can't hurt, but this is such a small change it
shouldn't be a problem.
- How can other people (reviewers) test your changes? Is there anything
specific they need to know?
  - Run the examples yourself with and without these changes.
- If relevant, what platforms did you test these changes on, and are
there any important ones you can't test?
  - see above

---

## Showcase

n/a

## Migration Guide

n/a
This commit is contained in:
krunchington 2025-03-12 20:11:13 -07:00 committed by GitHub
parent ab0e3f8714
commit 4d47de8ad8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 86 additions and 98 deletions

View File

@ -243,40 +243,37 @@ const PRESSED_BUTTON: Color = Color::srgb(0.35, 0.75, 0.35);
fn setup_menu(mut commands: Commands) {
let button_entity = commands
.spawn(Node {
// center button
width: Val::Percent(100.),
height: Val::Percent(100.),
justify_content: JustifyContent::Center,
align_items: AlignItems::Center,
..default()
})
.with_children(|parent| {
parent
.spawn((
Button,
Node {
width: Val::Px(150.),
height: Val::Px(65.),
// horizontally center child text
justify_content: JustifyContent::Center,
// vertically center child text
align_items: AlignItems::Center,
.spawn((
Node {
// center button
width: Val::Percent(100.),
height: Val::Percent(100.),
justify_content: JustifyContent::Center,
align_items: AlignItems::Center,
..default()
},
children![(
Button,
Node {
width: Val::Px(150.),
height: Val::Px(65.),
// horizontally center child text
justify_content: JustifyContent::Center,
// vertically center child text
align_items: AlignItems::Center,
..default()
},
BackgroundColor(NORMAL_BUTTON),
children![(
Text::new("Play"),
TextFont {
font_size: 33.0,
..default()
},
BackgroundColor(NORMAL_BUTTON),
))
.with_children(|parent| {
parent.spawn((
Text::new("Play"),
TextFont {
font_size: 33.0,
..default()
},
TextColor(Color::srgb(0.9, 0.9, 0.9)),
));
});
})
TextColor(Color::srgb(0.9, 0.9, 0.9)),
)]
)],
))
.id();
commands.insert_resource(MenuData { button_entity });
}

View File

@ -156,40 +156,37 @@ mod ui {
pub fn setup_menu(mut commands: Commands) {
let button_entity = commands
.spawn(Node {
// center button
width: Val::Percent(100.),
height: Val::Percent(100.),
justify_content: JustifyContent::Center,
align_items: AlignItems::Center,
..default()
})
.with_children(|parent| {
parent
.spawn((
Button,
Node {
width: Val::Px(150.),
height: Val::Px(65.),
// horizontally center child text
justify_content: JustifyContent::Center,
// vertically center child text
align_items: AlignItems::Center,
.spawn((
Node {
// center button
width: Val::Percent(100.),
height: Val::Percent(100.),
justify_content: JustifyContent::Center,
align_items: AlignItems::Center,
..default()
},
children![(
Button,
Node {
width: Val::Px(150.),
height: Val::Px(65.),
// horizontally center child text
justify_content: JustifyContent::Center,
// vertically center child text
align_items: AlignItems::Center,
..default()
},
BackgroundColor(NORMAL_BUTTON),
children![(
Text::new("Play"),
TextFont {
font_size: 33.0,
..default()
},
BackgroundColor(NORMAL_BUTTON),
))
.with_children(|parent| {
parent.spawn((
Text::new("Play"),
TextFont {
font_size: 33.0,
..default()
},
TextColor(Color::srgb(0.9, 0.9, 0.9)),
));
});
})
TextColor(Color::srgb(0.9, 0.9, 0.9)),
)]
)],
))
.id();
commands.insert_resource(MenuData { button_entity });
}
@ -199,44 +196,38 @@ mod ui {
}
pub fn setup_paused_screen(mut commands: Commands) {
commands
.spawn((
StateScoped(IsPaused::Paused),
commands.spawn((
StateScoped(IsPaused::Paused),
Node {
// center button
width: Val::Percent(100.),
height: Val::Percent(100.),
justify_content: JustifyContent::Center,
align_items: AlignItems::Center,
flex_direction: FlexDirection::Column,
row_gap: Val::Px(10.),
..default()
},
children![(
Node {
// center button
width: Val::Percent(100.),
height: Val::Percent(100.),
width: Val::Px(400.),
height: Val::Px(400.),
// horizontally center child text
justify_content: JustifyContent::Center,
// vertically center child text
align_items: AlignItems::Center,
flex_direction: FlexDirection::Column,
row_gap: Val::Px(10.),
..default()
},
))
.with_children(|parent| {
parent
.spawn((
Node {
width: Val::Px(400.),
height: Val::Px(400.),
// horizontally center child text
justify_content: JustifyContent::Center,
// vertically center child text
align_items: AlignItems::Center,
..default()
},
BackgroundColor(NORMAL_BUTTON),
))
.with_children(|parent| {
parent.spawn((
Text::new("Paused"),
TextFont {
font_size: 33.0,
..default()
},
TextColor(Color::srgb(0.9, 0.9, 0.9)),
));
});
});
BackgroundColor(NORMAL_BUTTON),
children![(
Text::new("Paused"),
TextFont {
font_size: 33.0,
..default()
},
TextColor(Color::srgb(0.9, 0.9, 0.9)),
)]
)],
));
}
}