diff --git a/packages/slides/assets/images/diagrams/mesh.png b/packages/slides/assets/images/diagrams/mesh.png new file mode 100644 index 0000000..cf332f2 Binary files /dev/null and b/packages/slides/assets/images/diagrams/mesh.png differ diff --git a/packages/slides/assets/images/diagrams/surface.png b/packages/slides/assets/images/diagrams/surface.png new file mode 100644 index 0000000..87dfffd Binary files /dev/null and b/packages/slides/assets/images/diagrams/surface.png differ diff --git a/packages/slides/assets/images/diagrams/vertex.png b/packages/slides/assets/images/diagrams/vertex.png new file mode 100644 index 0000000..7dff3ca Binary files /dev/null and b/packages/slides/assets/images/diagrams/vertex.png differ diff --git a/packages/slides/lib/main.dart b/packages/slides/lib/main.dart index 73cbec0..ece8e66 100644 --- a/packages/slides/lib/main.dart +++ b/packages/slides/lib/main.dart @@ -45,6 +45,9 @@ class FlutterDeckExample extends StatelessWidget { Slide06ThreeDimensionalAxes(), Slide07ThreeDimensionalProjections(), Slide08Matrices(), + Slide09Glossary(), + Slide10FirstCube(), + Slides.title('Sample Slides'), SlideSampleImage(), SlideSampleCode(), SlideSampleGame(), diff --git a/packages/slides/lib/slides/components/slide_game.dart b/packages/slides/lib/slides/components/slide_game.dart new file mode 100644 index 0000000..aeeb865 --- /dev/null +++ b/packages/slides/lib/slides/components/slide_game.dart @@ -0,0 +1,23 @@ +import 'package:flame/game.dart'; +import 'package:flutter/material.dart'; + +class SlideGame extends StatelessWidget { + final GameFactory game; + + const SlideGame({ + required this.game, + super.key, + }); + + @override + Widget build(BuildContext context) { + return Container( + width: 800, + height: 600, + child: GameWidget.controlled( + gameFactory: game, + autofocus: false, + ), + ); + } +} diff --git a/packages/slides/lib/slides/slide_04_flame_game_loop.dart b/packages/slides/lib/slides/slide_04_flame_game_loop.dart index 3bb6fa4..d7eb94d 100644 --- a/packages/slides/lib/slides/slide_04_flame_game_loop.dart +++ b/packages/slides/lib/slides/slide_04_flame_game_loop.dart @@ -1,6 +1,6 @@ -import 'package:flame/game.dart'; import 'package:flame_3d_workshop_slides/games/game_loop/game_loop.dart'; import 'package:flame_3d_workshop_slides/slides/components/slide.dart'; +import 'package:flame_3d_workshop_slides/slides/components/slide_game.dart'; import 'package:flame_3d_workshop_slides/slides/components/slide_text.dart'; import 'package:flutter/material.dart'; @@ -11,14 +11,7 @@ class Slide04FlameGameLoop extends Slide { List children(BuildContext context) { return [ SlideText.title('Game Loop'), - Container( - width: 800, - height: 600, - child: const GameWidget.controlled( - gameFactory: GameLoop.new, - autofocus: false, - ), - ), + const SlideGame(game: GameLoop.new), ]; } } diff --git a/packages/slides/lib/slides/slide_06_3d_axes.dart b/packages/slides/lib/slides/slide_06_3d_axes.dart index 6c166bd..e705f89 100644 --- a/packages/slides/lib/slides/slide_06_3d_axes.dart +++ b/packages/slides/lib/slides/slide_06_3d_axes.dart @@ -2,13 +2,13 @@ import 'dart:async'; import 'dart:math'; import 'package:flame/components.dart' hide Matrix4; -import 'package:flame/game.dart' hide Matrix4; import 'package:flame/palette.dart'; import 'package:flame_3d/camera.dart'; import 'package:flame_3d/components.dart'; import 'package:flame_3d/game.dart'; import 'package:flame_3d/resources.dart'; import 'package:flame_3d_workshop_slides/slides/components/slide.dart'; +import 'package:flame_3d_workshop_slides/slides/components/slide_game.dart'; import 'package:flame_3d_workshop_slides/slides/components/slide_text.dart'; import 'package:flutter/material.dart' hide Matrix4, Material; @@ -19,14 +19,7 @@ class Slide06ThreeDimensionalAxes extends Slide { List children(BuildContext context) { return [ SlideText.title('3D Axes'), - Container( - width: 800, - height: 600, - child: const GameWidget.controlled( - gameFactory: _ThreeDimensionalAxesGame.new, - autofocus: false, - ), - ), + const SlideGame(game: _ThreeDimensionalAxesGame.new), ]; } } diff --git a/packages/slides/lib/slides/slide_09_glossary.dart b/packages/slides/lib/slides/slide_09_glossary.dart new file mode 100644 index 0000000..68da184 --- /dev/null +++ b/packages/slides/lib/slides/slide_09_glossary.dart @@ -0,0 +1,28 @@ +import 'package:flame_3d_workshop_slides/slides/components/slide.dart'; +import 'package:flame_3d_workshop_slides/slides/components/slide_text.dart'; +import 'package:flutter/material.dart' hide Matrix4, Material; + +class Slide09Glossary extends Slide { + Slide09Glossary({super.key}) : super(route: '/slide_09_glossary'); + + @override + List children(BuildContext context) { + return [ + SlideText.title('Glossary'), + SlideText.p('Some useful terms that we are going to be using a lot.'), + SlideText.bullet('Vertex'), + SlideText.bullet('Surface'), + SlideText.bullet('Mesh'), + SlideText.bullet('Model'), + const SizedBox(height: 16), + Row( + mainAxisAlignment: MainAxisAlignment.spaceEvenly, + children: [ + Image.asset('assets/images/diagrams/vertex.png'), + Image.asset('assets/images/diagrams/surface.png'), + Image.asset('assets/images/diagrams/mesh.png'), + ], + ), + ]; + } +} diff --git a/packages/slides/lib/slides/slide_10_first_cube.dart b/packages/slides/lib/slides/slide_10_first_cube.dart new file mode 100644 index 0000000..5b25a7f --- /dev/null +++ b/packages/slides/lib/slides/slide_10_first_cube.dart @@ -0,0 +1,74 @@ +import 'package:flame/palette.dart'; +import 'package:flame_3d/camera.dart'; +import 'package:flame_3d/components.dart'; +import 'package:flame_3d/game.dart'; +import 'package:flame_3d/resources.dart'; +import 'package:flame_3d_workshop_slides/slides/components/slide.dart'; +import 'package:flame_3d_workshop_slides/slides/components/slide_game.dart'; +import 'package:flame_3d_workshop_slides/slides/components/slide_text.dart'; +import 'package:flutter/material.dart' hide Matrix4, Material; + +class Slide10FirstCube extends Slide { + Slide10FirstCube({super.key}) : super(route: '/slide_10_first_cube'); + + @override + List children(BuildContext context) { + return [ + SlideText.title('Our First Cube!'), + Row( + mainAxisAlignment: MainAxisAlignment.center, + spacing: 8.0, + children: [ + SlideText.code(''' +class _FirstCubeGame extends FlameGame3D { + _FirstCubeGame() + : super( + world: World3D(clearColor: ...), + camera: CameraComponent3D( + position: Vector3.all(8), + ), + ); + + @override + Future onLoad() async { + world.addAll([ + MeshComponent( + mesh: CuboidMesh( + size: Vector3.all(2.0), + material: SpatialMaterial(albedoColor: ...), + ), + ), + ]); + return super.onLoad(); + } +} + '''), + const SlideGame(game: _FirstCubeGame.new), + ], + ), + ]; + } +} + +class _FirstCubeGame extends FlameGame3D { + _FirstCubeGame() + : super( + world: World3D(clearColor: const Color(0xFF000000)), + camera: CameraComponent3D( + position: Vector3.all(8), + ), + ); + + @override + Future onLoad() async { + world.addAll([ + MeshComponent( + mesh: CuboidMesh( + size: Vector3.all(2.0), + material: SpatialMaterial(albedoColor: BasicPalette.white.color), + ), + ), + ]); + return super.onLoad(); + } +} diff --git a/packages/slides/lib/slides/slides.dart b/packages/slides/lib/slides/slides.dart index 0270f67..14584a4 100644 --- a/packages/slides/lib/slides/slides.dart +++ b/packages/slides/lib/slides/slides.dart @@ -7,6 +7,8 @@ export 'slide_05_flame_components.dart'; export 'slide_06_3d_axes.dart'; export 'slide_07_3d_projections.dart'; export 'slide_08_matrices.dart'; +export 'slide_09_glossary.dart'; +export 'slide_10_first_cube.dart'; export 'slide_sample_code.dart'; export 'slide_sample_game.dart'; export 'slide_sample_image.dart'; diff --git a/packages/template/README.md b/packages/template/README.md index cf2d810..ee74cfc 100644 --- a/packages/template/README.md +++ b/packages/template/README.md @@ -1,3 +1,3 @@ # template -Use this template to start working on your game using `flame_3d`. \ No newline at end of file +Use this template to start working on your game using `flame_3d`.