flutterdartflutter-image

How to replay webp in flutter?


I'm currently working on a project in Flutter. Specifically, I'm working on a problem, which contains the following code:

Image.asset('images/icon.webp')

This code is used to display a webp animation in my app. However, I'm having trouble getting the animation to loop indefinitely. Currently, the animation only plays once and then stops.

I've tried using the ImageRepeat property of the DecorationImage widget to repeat the animation, but it doesn't seem to work with webp files.

For ExtendedImage I also tried but also not working.

import 'package:extended_image/extended_image.dart';

ExtendedImage.asset(
  'images/icon.webp',
  fit: BoxFit.cover,
  repeat: ImageRepeat.repeat,
);

Does anyone know of a way to make a webp animation repeat in a loop in Flutter? Any help would be greatly appreciated.

Thank in advance!


Solution

  • Use loop playback when making webp files For example, when using ffmpeg to make webp files, you can use -loop 0 to set loop playback For example:

    ffmpeg -i icon%05d.png -lossless 1 -loop 0 icon.webp