Flutter / Flame - Как работать с PanDetector и другим GestureDetector для компонентов одновременно?

Question

Моя игра использует PanDetector для перемещения игрока.

class MyGame extends BaseGame with PanDetector, HasTapableComponents {


  @override
  void onPanUpdate(DragUpdateDetails details) {

    // move the player
   player.move(details.delta.dx, details.delta.dy);

    super.onPanUpdate(details);
  }


}

Мне нужно было добавить кнопку паузы в правом верхнем углу экрана.

class PauseComponent extends PositionComponent with Tapable, HasGameRef<MyGame>{

  Rect rect;
  Sprite spritePause = Sprite("pause_button.png");

  PauseComponent(){

    rect = Rect.fromLTWH(
        Get.find<Config>().screenSize.width * 0.92,
        Get.find<Config>().screenSize.height * 0.04,
        Get.find<Config>().screenSize.width * 0.05,
        Get.find<Config>().screenSize.height * 0.10);

  }

  @override
  void render(Canvas c) {

    spritePause.renderRect(c, rect);

  }

  @override
  void onTapDown(TapDownDetails details) {

    if(gameRef.gameState == GameState.PLAYING){

      gameRef.gameState = GameState.PAUSED;
      gameRef.pauseEngine();

    } else {

      gameRef.gameState = GameState.PLAYING;
      gameRef.resumeEngine();

    }

    print("STATUS: ${gameRef.gameState}");

    super.onTapDown(details);
  }
}

Но это не работает, как я могу заставить onTapDown PauseComponent работать, использовать PanDetector и какой-то другой детектор для PauseComponent?

Answer 1

Я использовал миксин addWidgetsOverlay и добавил настраиваемый виджет кнопки паузы, поскольку PanDetector не работал с Tapable.

import 'package:flutter/material.dart';

class PauseButton extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Align(
      alignment: Alignment.topRight,
      child: Material(
        color: Colors.blue,
        child: IconButton(
          icon: Icon(Icons.pause),
          onPressed: (){
            print("TOUCH!");
          },
        ),
      ),
    );
  }
}

И удаление миксина HasTapableComponents (не уверен, что он с чем-то конфликтует), теперь он работает.

class MyGame extends BaseGame with HasWidgetsOverlay, PanDetector {

  MyGame(){

  addWidgetsOverlay("Pause Button", PauseButton());


 }

}

Answer 2

Вы должны добавить HasTapableComponents на MyGame, и вы также должны добавить свой PauseComponent к MyGame (но вы могли просто пропустить эту часть кода).

class MyGame extends BaseGame with PanDetector, HasTapableComponents {
  ....
}

Вы можете узнать больше о съемных компонентах здесь.