Update testbed_ui to use Improved Spawning API (#18329)

# Objective

Contributes to #18238 
Updates the `text2d`, example to use the `children!` macro.

~~The SpawnIter usage in this example is maybe not the best. Very open
to opinions. I even left one `with_children` that I thought was just
much better than any alternative.~~

## 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

examples/testbed/ui.rs

@@ -105,8 +105,7 @@ mod grid {
     pub fn setup(mut commands: Commands) {
         commands.spawn((Camera2d, StateScoped(super::Scene::Grid)));
         // Top-level grid (app frame)
-        commands
+        commands.spawn((
-            .spawn((
             Node {
                 display: Display::Grid,
                 width: Val::Percent(100.0),
@@ -121,10 +120,9 @@ mod grid {
             },
             BackgroundColor(Color::WHITE),
             StateScoped(super::Scene::Grid),
-            ))
+            children![
-            .with_children(|builder| {
                 // Header
-                builder.spawn((
+                (
                     Node {
                         display: Display::Grid,
                         grid_column: GridPlacement::span(2),
@@ -132,11 +130,9 @@ mod grid {
                         ..default()
                     },
                     BackgroundColor(RED.into()),
-                ));
+                ),
-
                 // Main content grid (auto placed in row 2, column 1)
-                builder
+                (
-                    .spawn((
                     Node {
                         height: Val::Percent(100.0),
                         aspect_ratio: Some(1.0),
@@ -148,18 +144,18 @@ mod grid {
                         ..default()
                     },
                     BackgroundColor(Color::srgb(0.25, 0.25, 0.25)),
-                    ))
+                    children![
-                    .with_children(|builder| {
+                        (Node::default(), BackgroundColor(ORANGE.into())),
-                        builder.spawn((Node::default(), BackgroundColor(ORANGE.into())));
+                        (Node::default(), BackgroundColor(BISQUE.into())),
-                        builder.spawn((Node::default(), BackgroundColor(BISQUE.into())));
+                        (Node::default(), BackgroundColor(BLUE.into())),
-                        builder.spawn((Node::default(), BackgroundColor(BLUE.into())));
+                        (Node::default(), BackgroundColor(CRIMSON.into())),
-                        builder.spawn((Node::default(), BackgroundColor(CRIMSON.into())));
+                        (Node::default(), BackgroundColor(AQUA.into())),
-                        builder.spawn((Node::default(), BackgroundColor(AQUA.into())));
+                    ]
-                    });
+                ),
-
                 // Right side bar (auto placed in row 2, column 2)
-                builder.spawn((Node::DEFAULT, BackgroundColor(BLACK.into())));
+                (Node::DEFAULT, BackgroundColor(BLACK.into())),
-            });
+            ],
+        ));
     }
 }