Update computed_states example to use children macro (#18290)

# Objective

Contributes to #18238 
Updates the `computed_states`, example to use the `children!` macro.
Note that this example requires `--features bevy_dev_tools` to run

## 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-13 09:35:32 -07:00 committed by GitHub
parent d70c469483
commit 2c22bc12a0
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -336,19 +336,19 @@ mod ui {
pub fn setup_menu(mut commands: Commands, tutorial_state: Res<State<TutorialState>>) { pub fn setup_menu(mut commands: Commands, tutorial_state: Res<State<TutorialState>>) {
let button_entity = commands let button_entity = commands
.spawn(Node { .spawn((
// center button Node {
width: Val::Percent(100.), // center button
height: Val::Percent(100.), width: Val::Percent(100.),
justify_content: JustifyContent::Center, height: Val::Percent(100.),
align_items: AlignItems::Center, justify_content: JustifyContent::Center,
flex_direction: FlexDirection::Column, align_items: AlignItems::Center,
row_gap: Val::Px(10.), flex_direction: FlexDirection::Column,
..default() row_gap: Val::Px(10.),
}) ..default()
.with_children(|parent| { },
parent children![
.spawn(( (
Button, Button,
Node { Node {
width: Val::Px(200.), width: Val::Px(200.),
@ -361,20 +361,16 @@ mod ui {
}, },
BackgroundColor(NORMAL_BUTTON), BackgroundColor(NORMAL_BUTTON),
MenuButton::Play, MenuButton::Play,
)) children![(
.with_children(|parent| {
parent.spawn((
Text::new("Play"), Text::new("Play"),
TextFont { TextFont {
font_size: 33.0, font_size: 33.0,
..default() ..default()
}, },
TextColor(Color::srgb(0.9, 0.9, 0.9)), TextColor(Color::srgb(0.9, 0.9, 0.9)),
)); )],
}); ),
(
parent
.spawn((
Button, Button,
Node { Node {
width: Val::Px(200.), width: Val::Px(200.),
@ -390,18 +386,17 @@ mod ui {
TutorialState::Inactive => NORMAL_BUTTON, TutorialState::Inactive => NORMAL_BUTTON,
}), }),
MenuButton::Tutorial, MenuButton::Tutorial,
)) children![(
.with_children(|parent| {
parent.spawn((
Text::new("Tutorial"), Text::new("Tutorial"),
TextFont { TextFont {
font_size: 33.0, font_size: 33.0,
..default() ..default()
}, },
TextColor(Color::srgb(0.9, 0.9, 0.9)), TextColor(Color::srgb(0.9, 0.9, 0.9)),
)); )]
}); ),
}) ],
))
.id(); .id();
commands.insert_resource(MenuData { commands.insert_resource(MenuData {
root_entity: button_entity, root_entity: button_entity,
@ -453,75 +448,66 @@ mod ui {
pub fn setup_paused_screen(mut commands: Commands) { pub fn setup_paused_screen(mut commands: Commands) {
info!("Printing Pause"); info!("Printing Pause");
commands commands.spawn((
.spawn(( StateScoped(IsPaused::Paused),
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.),
position_type: PositionType::Absolute,
..default()
},
children![(
Node { Node {
// center button width: Val::Px(400.),
width: Val::Percent(100.), height: Val::Px(400.),
height: Val::Percent(100.), // horizontally center child text
justify_content: JustifyContent::Center, justify_content: JustifyContent::Center,
// vertically center child text
align_items: AlignItems::Center, align_items: AlignItems::Center,
flex_direction: FlexDirection::Column,
row_gap: Val::Px(10.),
position_type: PositionType::Absolute,
..default() ..default()
}, },
)) BackgroundColor(NORMAL_BUTTON),
.with_children(|parent| { MenuButton::Play,
parent children![(
.spawn(( Text::new("Paused"),
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),
MenuButton::Play,
))
.with_children(|parent| {
parent.spawn((
Text::new("Paused"),
TextFont {
font_size: 33.0,
..default()
},
TextColor(Color::srgb(0.9, 0.9, 0.9)),
));
});
});
}
pub fn setup_turbo_text(mut commands: Commands) {
commands
.spawn((
StateScoped(TurboMode),
Node {
// center button
width: Val::Percent(100.),
height: Val::Percent(100.),
justify_content: JustifyContent::Start,
align_items: AlignItems::Center,
flex_direction: FlexDirection::Column,
row_gap: Val::Px(10.),
position_type: PositionType::Absolute,
..default()
},
))
.with_children(|parent| {
parent.spawn((
Text::new("TURBO MODE"),
TextFont { TextFont {
font_size: 33.0, font_size: 33.0,
..default() ..default()
}, },
TextColor(Color::srgb(0.9, 0.3, 0.1)), TextColor(Color::srgb(0.9, 0.9, 0.9)),
)); )],
}); ),],
));
}
pub fn setup_turbo_text(mut commands: Commands) {
commands.spawn((
StateScoped(TurboMode),
Node {
// center button
width: Val::Percent(100.),
height: Val::Percent(100.),
justify_content: JustifyContent::Start,
align_items: AlignItems::Center,
flex_direction: FlexDirection::Column,
row_gap: Val::Px(10.),
position_type: PositionType::Absolute,
..default()
},
children![(
Text::new("TURBO MODE"),
TextFont {
font_size: 33.0,
..default()
},
TextColor(Color::srgb(0.9, 0.3, 0.1)),
)],
));
} }
pub fn change_color(time: Res<Time>, mut query: Query<&mut Sprite>) { pub fn change_color(time: Res<Time>, mut query: Query<&mut Sprite>) {
@ -536,93 +522,88 @@ mod ui {
} }
pub fn movement_instructions(mut commands: Commands) { pub fn movement_instructions(mut commands: Commands) {
commands commands.spawn((
.spawn(( StateScoped(Tutorial::MovementInstructions),
StateScoped(Tutorial::MovementInstructions), Node {
Node { // center button
// center button width: Val::Percent(100.),
width: Val::Percent(100.), height: Val::Percent(100.),
height: Val::Percent(100.), justify_content: JustifyContent::End,
justify_content: JustifyContent::End, align_items: AlignItems::Center,
align_items: AlignItems::Center, flex_direction: FlexDirection::Column,
flex_direction: FlexDirection::Column, row_gap: Val::Px(10.),
row_gap: Val::Px(10.), position_type: PositionType::Absolute,
position_type: PositionType::Absolute, ..default()
..default() },
}, children![
)) (
.with_children(|parent| {
parent.spawn((
Text::new("Move the bevy logo with the arrow keys"), Text::new("Move the bevy logo with the arrow keys"),
TextFont { TextFont {
font_size: 33.0, font_size: 33.0,
..default() ..default()
}, },
TextColor(Color::srgb(0.3, 0.3, 0.7)), TextColor(Color::srgb(0.3, 0.3, 0.7)),
)); ),
parent.spawn(( (
Text::new("Press T to enter TURBO MODE"), Text::new("Press T to enter TURBO MODE"),
TextFont { TextFont {
font_size: 33.0, font_size: 33.0,
..default() ..default()
}, },
TextColor(Color::srgb(0.3, 0.3, 0.7)), TextColor(Color::srgb(0.3, 0.3, 0.7)),
)); ),
(
parent.spawn((
Text::new("Press SPACE to pause"), Text::new("Press SPACE to pause"),
TextFont { TextFont {
font_size: 33.0, font_size: 33.0,
..default() ..default()
}, },
TextColor(Color::srgb(0.3, 0.3, 0.7)), TextColor(Color::srgb(0.3, 0.3, 0.7)),
)); ),
(
parent.spawn((
Text::new("Press ESCAPE to return to the menu"), Text::new("Press ESCAPE to return to the menu"),
TextFont { TextFont {
font_size: 33.0, font_size: 33.0,
..default() ..default()
}, },
TextColor(Color::srgb(0.3, 0.3, 0.7)), TextColor(Color::srgb(0.3, 0.3, 0.7)),
)); ),
}); ],
));
} }
pub fn pause_instructions(mut commands: Commands) { pub fn pause_instructions(mut commands: Commands) {
commands commands.spawn((
.spawn(( StateScoped(Tutorial::PauseInstructions),
StateScoped(Tutorial::PauseInstructions), Node {
Node { // center button
// center button width: Val::Percent(100.),
width: Val::Percent(100.), height: Val::Percent(100.),
height: Val::Percent(100.), justify_content: JustifyContent::End,
justify_content: JustifyContent::End, align_items: AlignItems::Center,
align_items: AlignItems::Center, flex_direction: FlexDirection::Column,
flex_direction: FlexDirection::Column, row_gap: Val::Px(10.),
row_gap: Val::Px(10.), position_type: PositionType::Absolute,
position_type: PositionType::Absolute, ..default()
..default() },
}, children![
)) (
.with_children(|parent| {
parent.spawn((
Text::new("Press SPACE to resume"), Text::new("Press SPACE to resume"),
TextFont { TextFont {
font_size: 33.0, font_size: 33.0,
..default() ..default()
}, },
TextColor(Color::srgb(0.3, 0.3, 0.7)), TextColor(Color::srgb(0.3, 0.3, 0.7)),
)); ),
(
parent.spawn((
Text::new("Press ESCAPE to return to the menu"), Text::new("Press ESCAPE to return to the menu"),
TextFont { TextFont {
font_size: 33.0, font_size: 33.0,
..default() ..default()
}, },
TextColor(Color::srgb(0.3, 0.3, 0.7)), TextColor(Color::srgb(0.3, 0.3, 0.7)),
)); ),
}); ],
));
} }
} }