Issue with screen resize using Flame Engine

Issue

I am trying to embed a small game using Flame Engine directly in my flutter website.

I have managed to created a container containing the GameWidget:

class gameContainer extends StatelessWidget {
 const gameContainer({Key? key, required this.width}) : super(key: key);
   final double width;

   @override
   Widget build(BuildContext context) {
     return Container(
       width: width,
       height: 100,
       padding: EdgeInsets.symmetric(horizontal: 40, vertical: 10),
       child: GameWidget(game: game()),
    );
  }
}

I have the game running, showing a player on screen and moving.

My width being Dynamic I would like to be able to resize the screen and the GameViewport to resize itself. The issue is that when the screen resize itself the entire game reset. Both onGameResize and onLoad are called: end result I am then loosing my player position.

It tried override onGameResize to get the player position before the resize in the Game class but the player position is already set to [0,0] when it is called.

I have looked several tutorial but I have no idea on how where to go to by pass this issue.

Any idea from where to go from here.

Solution

It is because you are initiating the game inside of the GameWidget, if you initiate it outside of the widget you should be fine. The flutter widget tree is rebuilt on resize, that is why you are facing this issue.

class gameContainer extends StatelessWidget {
 const gameContainer({Key? key, required this.width}) : super(key: key);
   final double width;
   final FlameGame _game = game();

   @override
   Widget build(BuildContext context) {
     return Container(
       width: width,
       height: 100,
       padding: EdgeInsets.symmetric(horizontal: 40, vertical: 10),
       child: GameWidget(game: _game),
    );
  }
}

Remember that you might have to react on onGameResize inside of your game class depending on how you have built your game.

Answered By – spydon

Answer Checked By – Willingham (FlutterFixes Volunteer)