saytoonz/flutter_gif

gif image widget help to controll gif progress,speed,repeat frames

flutter_gif

We should know that in order to achieve Gif in flutter, we can use Image, but we have no way to manipulate Gif, for example: change its speed, control it has been playing in a frame, in which frame range loop. These problems can be solved by this widget,it also help you contain gif cache,avoid load frame every time.

Screenshots

Usage(Simple)

add in pubspec

     flutter_gif: any // or the latest version on Pub

simple usage

    FlutterGifController controller= FlutterGifController(vsync: this);


    GifImage(
         controller: controller,
         image: AssetImage("images/animate.gif"),
    )

list the most common operate in FlutterGifController:

// loop from 0 frame to 29 frame
controller.repeat(min:0, max:29, period:const Duration(millseconds:300));

// jumpTo thrid frame(index from 0)
controller.value = 0;

// from current frame to 26 frame
controller.animateTo(26);

If you need to preCache gif,try this

// put imageProvider
fetchGif(AssetImage("images/animate.gif"));

Support the package (optional)

If you find this package useful, you can support it for free by giving it a thumbs up at the top of this page. Here's another option to support the package:

Thanks

• flutter_gifimage

License

MIT License

Copyright (c) 2019 Jpeng

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

flutter_gif's Issues

Gifs do not load web version mobile

When you use a website on your mobile phone which displays gifs, there is just a grey box where the gif should be. Why is that? On a computer everything works fine

Error: The method 'instantiateImageCodec' isn't defined for the class 'PaintingBinding'.

Appears on:

robertmainzer@Roberts-MacBook-Air remonon_app % flutter --version
Flutter 3.16.5 • channel stable • https://github.com/flutter/flutter.git
Framework • revision 78666c8dc5 (2 weeks ago) • 2023-12-19 16:14:14 -0800
Engine • revision 3f3e560236
Tools • Dart 3.2.3 • DevTools 2.28.4

Flutter build logs:

Launching lib/main.dart on iPhone 15 Pro in debug mode...
Running Xcode build...
Xcode build done.                                           33.5s
Failed to build iOS app
Error (Xcode): ../../.pub-cache/hosted/pub.dev/flutter_gif-0.0.4/lib/flutter_gif.dart:236:8: Error: The method 'instantiateImageCodec' isn't defined for the class 'PaintingBinding'.

Could not build the application for the simulator.
Error launching application on iPhone 15 Pro.

Fetching gifs crashs on iPhone 10 and iPad 6 - Out of memory

Hey there 👋

The last couple days I was debugging our application for out-of-memory failures on iPhone 10 and iPad 6 (both using iOS 15 or iPad OS 16).
We got messages like this:

* thread #12, name = 'io.flutter.1.io', stop reason = EXC_RESOURCE (RESOURCE_TYPE_MEMORY: high watermark memory limit exceeded) (limit=1450 MB)
    frame #0: 0x000000022e02483c AGXMetalA10`___lldb_unnamed_symbol2784 + 632
AGXMetalA10`___lldb_unnamed_symbol2784:
->  0x22e02483c <+632>: st1.4s { v16, v17, v18, v19 }, [x4]
    0x22e024840 <+636>: add    x4, x4, #0x80
    0x22e024844 <+640>: st1.4s { v20, v21, v22, v23 }, [x4]
    0x22e024848 <+644>: add    x4, x4, #0x80

While this might be a common issue on pages which have lots of pictures which are not cached correctly, we eliminated such issues first. We also suspected other kind of problematic async code parts to be at fault, but what was bugging me is that we suddenly overshoot in memory by GB not MB. This was not really visible in the memory debug view and its pain to find out whats going wrong.
On newer devices e.g. iPhone 11 there were no crashes. The same holds true for the emulated devices. Only a real iPhone 10 or an iPad 6 was crashing.

To reproduce please use this flutter application:

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter_gif/flutter_gif.dart';

void main() {
  runApp(const MainApp());
}

class MainApp extends StatelessWidget {
  const MainApp({super.key});

  Future<void> doFetching() async {
    await fetchGif(const AssetImage('assets/images/this_is_fine.gif'));
  }

  @override
  Widget build(BuildContext context) {
    WidgetsBinding.instance.addPostFrameCallback((_) async {
      unawaited(doFetching());
    });
    return const MaterialApp(
      home: Scaffold(
        body: Center(
          child: Text('Hello World!'),
        ),
      ),
    );
  }
}

name: flutter_gif_oom
description: A new Flutter project.
publish_to: 'none'
version: 0.1.0

environment:
  sdk: '>=3.1.2 <4.0.0'

dependencies:
  flutter:
    sdk: flutter
  flutter_gif: 0.0.4

dev_dependencies:
  flutter_test:
    sdk: flutter
  flutter_lints: ^2.0.0

flutter:
  uses-material-design: true

  assets:
      - assets/images/my_gif.gif

It seems to be related to gif loaded. It crashes for a 1.8mb gif but doesn't e.g. for a 94mb gif.
I'll ask for permission to upload the gif here as well. If I receive it, then I'll upload it to this issue.

Maybe it is also not wise to use an unmaintained <0.1.0 library for anything else than testing 😅

Could not getPixels for frame 0

I'm getting this error

[ERROR:flutter/lib/ui/painting/multi_frame_codec.cc(110)] Could not getPixels for frame 0
E/flutter (14759): [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: Exception: Could not getPixels for frame 0

flutter doctor:

Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.13.1, on Microsoft Windows [versÆo 10.0.22621.2134], locale en-US)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[√] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
[√] Chrome - develop for the web
[√] Visual Studio - develop Windows apps (Visual Studio Build Tools 2019 16.11.27)
[√] Android Studio (version 2022.3)
[√] VS Code (version 1.81.1)
[√] Connected device (4 available)
[√] Network resources

• No issues found!

How can i play gif only once

Thanks for creating this useful package.
Can you please tell me how can i play gif only once, No repeat.

Why not play automatically

Time must be set？It‘s bad

play gif is stumble at ios 14.4.1, other phone is no problem...

Flutter 3.16.9: The method 'instantiateImageCodec' isn't defined for the class 'PaintingBinding'.

I recently upgraded Flutter to version 3.16.9, I'm on the stable channel. When I try to run my app which depends on flutter_gif version 0.0.4 and worked fine before updating Flutter, I get an error:

Launching lib/main.dart on sdk gwear arm64 in debug mode...
../../../.pub-cache/hosted/pub.dev/flutter_gif-0.0.4/lib/flutter_gif.dart:236:8: Error: The method 'instantiateImageCodec' isn't defined for the class 'PaintingBinding'.
 - 'PaintingBinding' is from 'package:flutter/src/painting/binding.dart' ('../../../xxxxx/Flutter/sdk/packages/flutter/lib/src/painting/binding.dart').
Try correcting the name to the name of an existing method, or defining a method named 'instantiateImageCodec'.
      .instantiateImageCodec(data.buffer.asUint8List());
       ^^^^^^^^^^^^^^^^^^^^^
Target kernel_snapshot failed: Exception


FAILURE: Build failed with an exception.

* Where:
Script '/xxxxx/Flutter/sdk/packages/flutter_tools/gradle/src/main/groovy/flutter.groovy' line: 1350

* What went wrong:
Execution failed for task ':app:compileFlutterBuildDebug'.
> Process 'command '/xxxxx/Flutter/sdk/bin/flutter'' finished with non-zero exit value 1

* Try:
> Run with --stacktrace option to get the stack trace.
> Run with --info or --debug option to get more log output.
> Run with --scan to get full insights.

* Get more help at https://help.gradle.org

BUILD FAILED in 5s
Exception: Gradle task assembleDebug failed with exit code 1

Exited (1).

flutter doctor -v output:

andrej@Andrejs-MacBook-Pro ~ % flutter doctor -v
[✓] Flutter (Channel stable, 3.16.9, on macOS 13.6 22G120 darwin-arm64, locale
    en-BA)
    • Flutter version 3.16.9 on channel stable at
      /Users/andrej/Documents/Flutter/sdk
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 41456452f2 (9 days ago), 2024-01-25 10:06:23 -0800
    • Engine revision f40e976bed
    • Dart version 3.2.6
    • DevTools version 2.28.5

[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
    • Android SDK at /Users/andrej/Library/Android/sdk
    • Platform android-33, build-tools 33.0.0
    • Java binary at: /Applications/Android
      Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build
      17.0.6+0-17.0.6b802.4-9586694)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.2)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15C500b
    • CocoaPods version 1.11.3

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2022.2)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build
      17.0.6+0-17.0.6b802.4-9586694)

[✓] VS Code (version 1.86.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.82.0

[✓] Connected device (3 available)
    • sdk gwear arm64 (mobile) • emulator-5554 • android-arm64  • Android 11
      (API 30) (emulator)
    • macOS (desktop)          • macos         • darwin-arm64   • macOS 13.6
      22G120 darwin-arm64
    • Chrome (web)             • chrome        • web-javascript • Google Chrome
      119.0.6045.123

[✓] Network resources
    • All expected network resources are available.

• No issues found!

FileImage is not correctly handled in the cache

in fetchGif function, it should handle FileImage:

String key = provider is NetworkImage
      ? provider.url
      : provider is AssetImage
      ? provider.assetName
      : provider is MemoryImage
      ? provider.bytes.toString()
      : provider is FileImage
      ? provider.file.path
      : "";