Solved: Lines in sprites flicker when moving


Asked by Mike O on January 13, 2022 (source).

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;
      position += moveDirection * dt * speed.toDouble();

and this is the camera


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

enter image description here

What causes this?

Movement on 1 axis seem to work better but still

enter image description here

We are running this on flutter web with flutter version 2.8.1


Question answered by spydon (source).

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.