From 445e177fbe10bbfaef7e9519a2a650853f66541e Mon Sep 17 00:00:00 2001 From: Parker Lougheed Date: Thu, 15 Feb 2024 13:43:25 -0600 Subject: [PATCH] Improve fluidity of arrow key paddle movement (#2839) --- pkgs/samples/lib/brick_breaker.dart | 54 ++++++++++++++--------------- pkgs/sketch_pad/lib/samples.g.dart | 54 ++++++++++++++--------------- 2 files changed, 54 insertions(+), 54 deletions(-) diff --git a/pkgs/samples/lib/brick_breaker.dart b/pkgs/samples/lib/brick_breaker.dart index 5437b0c54..9541c9195 100644 --- a/pkgs/samples/lib/brick_breaker.dart +++ b/pkgs/samples/lib/brick_breaker.dart @@ -99,7 +99,7 @@ class BrickBreaker extends FlameGame void startGame() { world.removeAll(world.children.query()); - world.removeAll(world.children.query()); + world.removeAll(world.children.query()); world.removeAll(world.children.query()); world.add(Ball( @@ -107,12 +107,12 @@ class BrickBreaker extends FlameGame radius: ballRadius, position: size / 2, velocity: - Vector2((rand.nextDouble() - 0.5) * width, height * 0.2).normalized() + Vector2((rand.nextDouble() - 0.5) * width, height * 0.3).normalized() ..scale(height / 4), )); - world.add(Bat( - size: Vector2(batWidth, batHeight), + world.add(Paddle( + size: Vector2(paddleWidth, paddleHeight), cornerRadius: const Radius.circular(ballRadius / 2), position: Vector2(width / 2, height * 0.95), )); @@ -141,12 +141,6 @@ class BrickBreaker extends FlameGame RawKeyEvent event, Set keysPressed) { super.onKeyEvent(event, keysPressed); switch (event.logicalKey) { - case LogicalKeyboardKey.arrowLeft: - case LogicalKeyboardKey.keyA: - world.children.query().first.moveBy(-batStep); - case LogicalKeyboardKey.keyD: - case LogicalKeyboardKey.arrowRight: - world.children.query().first.moveBy(batStep); case LogicalKeyboardKey.space: case LogicalKeyboardKey.enter: startGame(); @@ -201,7 +195,7 @@ class Ball extends CircleComponent }, )); } - } else if (other is Bat) { + } else if (other is Paddle) { velocity.y = -velocity.y; velocity.x = velocity.x + (position.x - other.position.x) / other.size.x * game.width * 0.3; @@ -220,9 +214,9 @@ class Ball extends CircleComponent } } -class Bat extends PositionComponent - with DragCallbacks, HasGameReference { - Bat({ +class Paddle extends PositionComponent + with DragCallbacks, HasGameReference, KeyboardHandler { + Paddle({ required this.cornerRadius, required super.position, required super.size, @@ -234,6 +228,22 @@ class Bat extends PositionComponent ..color = const Color(0xff1e6091) ..style = PaintingStyle.fill; + @override + void update(double dt) { + super.update(dt); + + final keysPressed = HardwareKeyboard.instance.logicalKeysPressed; + if (keysPressed.contains(LogicalKeyboardKey.arrowLeft) || + keysPressed.contains(LogicalKeyboardKey.keyA)) { + position.x = + (position.x - (dt * 500)).clamp(width / 2, game.width - width / 2); + } else if (keysPressed.contains(LogicalKeyboardKey.arrowRight) || + keysPressed.contains(LogicalKeyboardKey.keyD)) { + position.x = + (position.x + (dt * 500)).clamp(width / 2, game.width - width / 2); + } + } + @override void render(Canvas canvas) { super.render(canvas); @@ -253,16 +263,6 @@ class Bat extends PositionComponent position.x = (position.x + event.localDelta.x) .clamp(width / 2, game.width - width / 2); } - - void moveBy(double dx) { - add(MoveToEffect( - Vector2( - (position.x + dx).clamp(width / 2, game.width - width / 2), - position.y, - ), - EffectController(duration: 0.1), - )); - } } class Brick extends RectangleComponent @@ -316,9 +316,9 @@ const brickColors = [ const gameWidth = 820.0; const gameHeight = 1600.0; const ballRadius = gameWidth * 0.02; -const batWidth = gameWidth * 0.2; -const batHeight = ballRadius * 2; -const batStep = gameWidth * 0.05; +const paddleWidth = gameWidth * 0.2; +const paddleHeight = ballRadius * 2; +const paddleStep = gameWidth * 0.05; const brickGutter = gameWidth * 0.015; final brickWidth = (gameWidth - (brickGutter * (brickColors.length + 1))) / brickColors.length; diff --git a/pkgs/sketch_pad/lib/samples.g.dart b/pkgs/sketch_pad/lib/samples.g.dart index f751e3437..100e37747 100644 --- a/pkgs/sketch_pad/lib/samples.g.dart +++ b/pkgs/sketch_pad/lib/samples.g.dart @@ -238,7 +238,7 @@ class BrickBreaker extends FlameGame void startGame() { world.removeAll(world.children.query()); - world.removeAll(world.children.query()); + world.removeAll(world.children.query()); world.removeAll(world.children.query()); world.add(Ball( @@ -246,12 +246,12 @@ class BrickBreaker extends FlameGame radius: ballRadius, position: size / 2, velocity: - Vector2((rand.nextDouble() - 0.5) * width, height * 0.2).normalized() + Vector2((rand.nextDouble() - 0.5) * width, height * 0.3).normalized() ..scale(height / 4), )); - world.add(Bat( - size: Vector2(batWidth, batHeight), + world.add(Paddle( + size: Vector2(paddleWidth, paddleHeight), cornerRadius: const Radius.circular(ballRadius / 2), position: Vector2(width / 2, height * 0.95), )); @@ -280,12 +280,6 @@ class BrickBreaker extends FlameGame RawKeyEvent event, Set keysPressed) { super.onKeyEvent(event, keysPressed); switch (event.logicalKey) { - case LogicalKeyboardKey.arrowLeft: - case LogicalKeyboardKey.keyA: - world.children.query().first.moveBy(-batStep); - case LogicalKeyboardKey.keyD: - case LogicalKeyboardKey.arrowRight: - world.children.query().first.moveBy(batStep); case LogicalKeyboardKey.space: case LogicalKeyboardKey.enter: startGame(); @@ -340,7 +334,7 @@ class Ball extends CircleComponent }, )); } - } else if (other is Bat) { + } else if (other is Paddle) { velocity.y = -velocity.y; velocity.x = velocity.x + (position.x - other.position.x) / other.size.x * game.width * 0.3; @@ -359,9 +353,9 @@ class Ball extends CircleComponent } } -class Bat extends PositionComponent - with DragCallbacks, HasGameReference { - Bat({ +class Paddle extends PositionComponent + with DragCallbacks, HasGameReference, KeyboardHandler { + Paddle({ required this.cornerRadius, required super.position, required super.size, @@ -373,6 +367,22 @@ class Bat extends PositionComponent ..color = const Color(0xff1e6091) ..style = PaintingStyle.fill; + @override + void update(double dt) { + super.update(dt); + + final keysPressed = HardwareKeyboard.instance.logicalKeysPressed; + if (keysPressed.contains(LogicalKeyboardKey.arrowLeft) || + keysPressed.contains(LogicalKeyboardKey.keyA)) { + position.x = + (position.x - (dt * 500)).clamp(width / 2, game.width - width / 2); + } else if (keysPressed.contains(LogicalKeyboardKey.arrowRight) || + keysPressed.contains(LogicalKeyboardKey.keyD)) { + position.x = + (position.x + (dt * 500)).clamp(width / 2, game.width - width / 2); + } + } + @override void render(Canvas canvas) { super.render(canvas); @@ -392,16 +402,6 @@ class Bat extends PositionComponent position.x = (position.x + event.localDelta.x) .clamp(width / 2, game.width - width / 2); } - - void moveBy(double dx) { - add(MoveToEffect( - Vector2( - (position.x + dx).clamp(width / 2, game.width - width / 2), - position.y, - ), - EffectController(duration: 0.1), - )); - } } class Brick extends RectangleComponent @@ -455,9 +455,9 @@ const brickColors = [ const gameWidth = 820.0; const gameHeight = 1600.0; const ballRadius = gameWidth * 0.02; -const batWidth = gameWidth * 0.2; -const batHeight = ballRadius * 2; -const batStep = gameWidth * 0.05; +const paddleWidth = gameWidth * 0.2; +const paddleHeight = ballRadius * 2; +const paddleStep = gameWidth * 0.05; const brickGutter = gameWidth * 0.015; final brickWidth = (gameWidth - (brickGutter * (brickColors.length + 1))) / brickColors.length;