HasTappableComponents class in Flame flutter deprecated

Question

The onTapDown method in GamePlayScreen doesn't seem to be triggered, and I can't figure out why. Any insights or suggestions would be greatly appreciated.

class FlyingCrowGameStart extends FlameGame with TapCallbacks {
  late final RouterComponent router;
  bool gameOver = false;
  bool showingGameOverScreen = false;
  Vector2 gravity = Vector2(0, 30);

  @override
  Future<void> onLoad() async {
    await super.onLoad();
    add(router = RouterComponent(initialRoute: 'gameStart', routes: {
      'gameStart': Route(GamePlayScreen.new),
      'gameEnd': Route(GameEndScreen.new),
    }));

    SystemChrome.setPreferredOrientations([
      DeviceOrientation.landscapeRight,
      DeviceOrientation.landscapeLeft,
    ]);
  }

  @override
  void onTapDown(TapDownEvent event) {
    super.onTapDown(event);
    gravity.y -= 20;
    print('main');
  }
}

class GamePlayScreen extends Component with HasGameRef<FlyingCrowGameStart>, TapCallbacks {
  FlyingCrow flyingCrow = FlyingCrow();

  @override
  Future<void> onLoad() async {
    super.onLoad();
    ParallaxComponent flyingCrowBackground = await gameRef.loadParallaxComponent(
      [
        ParallaxImageData('layers/sky.png'),
        // ... (other image data)
      ],
      baseVelocity: Vector2(5, 0),
      velocityMultiplierDelta: Vector2(1.6, 1.0),
    );
    add(flyingCrowBackground);
    add(flyingCrow);
    add(EnemyCraft());
  }

  void containsLocalPoints(Vector2 point) => true;

  @override
  void onTapDown(TapDownEvent event) {
    super.onTapDown(event);
    gameRef.gravity.y -= 20;
    print('play game');
  }
}

Answer 1

Component returns false on containsPoint since it doesn't have any size etc. What you can use here instead is the World:

class FlyingCrowGameStart extends FlameGame with TapCallbacks {
  late final RouterComponent router;
  bool gameOver = false;
  bool showingGameOverScreen = false;
  Vector2 gravity = Vector2(0, 30);

  @override
  Future<void> onLoad() async {
    await super.onLoad();
    add(router = RouterComponent(initialRoute: 'gameStart', routes: {
      'gameStart': Route(GamePlayScreen.new),
      'gameEnd': Route(GameEndScreen.new),
    }));

    SystemChrome.setPreferredOrientations([
      DeviceOrientation.landscapeRight,
      DeviceOrientation.landscapeLeft,
    ]);
  }

  @override
  void onTapDown(TapDownEvent event) {
    super.onTapDown(event);
    gravity.y -= 20;
    print('main');
  }
}

class GamePlayScreen extends World with HasGameRef<FlyingCrowGameStart>, TapCallbacks {
  FlyingCrow flyingCrow = FlyingCrow();

  @override
  Future<void> onLoad() async {
    super.onLoad();
    ParallaxComponent flyingCrowBackground = await gameRef.loadParallaxComponent(
      [
        ParallaxImageData('layers/sky.png'),
        // ... (other image data)
      ],
      baseVelocity: Vector2(5, 0),
      velocityMultiplierDelta: Vector2(1.6, 1.0),
    );
    add(flyingCrowBackground);
    add(flyingCrow);
    add(EnemyCraft());
  }

  @override
  void onMount() {
    // A bit of a hack until the `WorldRoute` is released.
    parent = game.world;
  }

  void containsLocalPoints(Vector2 point) => true;

  @override
  void onTapDown(TapDownEvent event) {
    super.onTapDown(event);
    gameRef.gravity.y -= 20;
    print('play game');
  }
}