We are creating a game in flutter flame and we notice some strage jitter whenever we move our camera. We have a position component that moves by changing the position and the camera follows

We have very simple movement for now where dt is delta time inside the Player component that extends PositionComponent

  void update(double dt) {
    if (position.distanceTo(moveTarget) > 0.1) {
      final moveDirection = moveTarget - position;
      moveDirection.normalize();
      position  = moveDirection * dt * speed.toDouble();
    }
    super.update(dt);
  }

and this is the camera

 camera.followComponent(player);

But our sprite has alot of jitter. The lines of the sprite flicker. We will be using pixel art but this is just an example sprite to illustrate

What causes this?

Movement on 1 axis seem to work better but still

We are running this on flutter web with flutter version 2.8.1

CodePudding user response：

This is probably caused by Flutter's anti aliasing bug.

If you use a sprite without lines like that in the middle you shouldn't notice it, as can be seen on the component that is solid teal in your example.