androidflutteranimationflame

Bug on some devices with animation using flutter and flame


Basically, I have a problem in an app I'm creating from a game based on a tutorial I saw, however, my character's animation is buggy on some devices, and on others it's running normal, as follows the viking animations with animation correct in how it appears on some devices:

Right Animation

and Viking with wrong animation on some devices (more than one viking showing up almost always, with the animation well buggy):

Viking with wrong animation on some devices

The spritesheet I'm using has 256x144 pixels images for the viking, where the first 29 frames are him running and the rest he's jumping (idle) follow the lines of code that define the viking animation in Flutter:

part of the animations in the viking.dart file:

enum VikingAnimationStates {
  Idle,
  Run,
  Kick,
  Hit,
  Sprint,
}


class Viking extends SpriteAnimationGroupComponent<VikingAnimationStates>
    with Hitbox, Collidable, HasGameRef<VikingRun> {
  
  static final _animationMap = {
    VikingAnimationStates.Idle: SpriteAnimationData.sequenced(
      amount: 19,
      stepTime: 0.1,
      textureSize: Vector2.all(256),
      texturePosition: Vector2(7424, -90), //29*256
    ),
    VikingAnimationStates.Run: SpriteAnimationData.sequenced(
      amount: 29,
      stepTime: 0.034,
      textureSize: Vector2.all(256), 
      texturePosition: Vector2(0, -90), 
    ),
    VikingAnimationStates.Kick: SpriteAnimationData.sequenced(
      amount: 4,
      stepTime: 0.1,
      textureSize: Vector2.all(256),
      texturePosition: Vector2(0, -90), 
    ),
    VikingAnimationStates.Hit: SpriteAnimationData.sequenced(
      amount: 3,
      stepTime: 0.1,
      textureSize: Vector2.all(256),
      texturePosition: Vector2(0, -90),
    ),
    VikingAnimationStates.Sprint: SpriteAnimationData.sequenced(
      amount: 7,
      stepTime: 0.1,
      textureSize: Vector2.all(256),
      texturePosition: Vector2(0, -90),
    ),
  };



  Viking(Image image, this.playerData)
      : super.fromFrameData(image, _animationMap);

part where i create the viking in the game inside the viking_run.dart file:

_viking = Viking(images.fromCache('spritesheet viking 48 frames 256x144.png'),
    playerData);

And the versions of android on both devices are the same


Solution

  • You say that your sprites are 256x144 in the sprite sheet, but you use textureSize: Vector2.all(256). Try changing that to Vector2(256, 144) instead.

    Also the texturePosition should never be anything negative, it defines a position in the sprite sheet. Since you only have one row of sprites in your sprite sheet you should always have y as 0 and then you can change x for where the sequence of each animation should start.