feat: added more components to layer story

packages/pinball_components/sandbox/lib/stories/ball/basic.dart

@@ -14,12 +14,6 @@ class BasicBallGame extends BasicGame with TapDetector {
 
   final Color color;
 
-  @override
-  Future<void> onLoad() async {
-    await add(BigSquare()..initialPosition = Vector2(30, -40));
-    await add(SmallSquare()..initialPosition = Vector2(50, -40));
-  }
-
   @override
   void onTapUp(TapUpInfo info) {
     add(
@@ -27,50 +21,3 @@ class BasicBallGame extends BasicGame with TapDetector {
     );
   }
 }
-
-class BigSquare extends BodyComponent with InitialPosition, Layered {
-  BigSquare() {
-    paint = Paint()
-      ..color = const Color.fromARGB(255, 8, 218, 241)
-      ..style = PaintingStyle.stroke;
-    layer = Layer.jetpack;
-  }
-
-  @override
-  Body createBody() {
-    final shape = PolygonShape()..setAsBoxXY(8, 8);
-    final fixtureDef = FixtureDef(shape);
-
-    final bodyDef = BodyDef()..position = initialPosition;
-
-    return world.createBody(bodyDef)..createFixture(fixtureDef);
-  }
-
-  @override
-  Future<void> onLoad() async {
-    await super.onLoad();
-
-    await add(
-      SmallSquare()..initialPosition = Vector2.zero(),
-    );
-  }
-}
-
-class SmallSquare extends BodyComponent with InitialPosition, Layered {
-  SmallSquare() {
-    paint = Paint()
-      ..color = Color.fromARGB(255, 27, 241, 8)
-      ..style = PaintingStyle.stroke;
-    layer = Layer.board;
-  }
-
-  @override
-  Body createBody() {
-    final shape = PolygonShape()..setAsBoxXY(3, 3);
-    final fixtureDef = FixtureDef(shape);
-
-    final bodyDef = BodyDef()..position = initialPosition;
-
-    return world.createBody(bodyDef)..createFixture(fixtureDef);
-  }
-}

packages/pinball_components/sandbox/lib/stories/layer/basic.dart

@@ -18,6 +18,7 @@ class BasicLayerGame extends BasicGame with TapDetector {
   Future<void> onLoad() async {
     await add(BigSquare()..initialPosition = Vector2(30, -40));
     await add(SmallSquare()..initialPosition = Vector2(50, -40));
+    await add(SimpleBodyComponent()..initialPosition = Vector2(60, -40));
   }
 
   @override
@@ -38,7 +39,7 @@ class BigSquare extends BodyComponent with InitialPosition, Layered {
 
   @override
   Body createBody() {
-    final shape = PolygonShape()..setAsBoxXY(8, 8);
+    final shape = PolygonShape()..setAsBoxXY(16, 16);
     final fixtureDef = FixtureDef(shape);
 
     final bodyDef = BodyDef()..position = initialPosition;
@@ -50,8 +51,11 @@ class BigSquare extends BodyComponent with InitialPosition, Layered {
   Future<void> onLoad() async {
     await super.onLoad();
 
-    await add(
-      SmallSquare()..initialPosition = Vector2.zero(),
+    await addAll(
+      [
+        SimpleBodyComponent()..initialPosition = Vector2.all(4),
+        SmallSquare()..initialPosition = Vector2.all(-4),
+      ],
     );
   }
 }
@@ -59,11 +63,29 @@ class BigSquare extends BodyComponent with InitialPosition, Layered {
 class SmallSquare extends BodyComponent with InitialPosition, Layered {
   SmallSquare() {
     paint = Paint()
-      ..color = Color.fromARGB(255, 27, 241, 8)
+      ..color = const Color.fromARGB(255, 27, 241, 8)
       ..style = PaintingStyle.stroke;
     layer = Layer.board;
   }
 
+  @override
+  Body createBody() {
+    final shape = PolygonShape()..setAsBoxXY(2, 2);
+    final fixtureDef = FixtureDef(shape);
+
+    final bodyDef = BodyDef()..position = initialPosition;
+
+    return world.createBody(bodyDef)..createFixture(fixtureDef);
+  }
+}
+
+class SimpleBodyComponent extends BodyComponent with InitialPosition {
+  SimpleBodyComponent() {
+    paint = Paint()
+      ..color = const Color.fromARGB(255, 241, 8, 8)
+      ..style = PaintingStyle.stroke;
+  }
+
   @override
   Body createBody() {
     final shape = PolygonShape()..setAsBoxXY(3, 3);