gifencoder 1.0.0

  • Readme
  • Changelog
  • Example
  • Installing
  • 66

gifencoder #

Pub Package Version Latest Dartdocs

A gif encoder written in Dart.

Usage #

To create a regular GIF:

import 'dart:html';
import 'package:gifencoder/gifencoder.dart';

int width = ...;
int height = ...;
var ctx = new CanvasElement(width: width, height: height).context2D;
// draw your image in the canvas context
var data = ctx.getImageData(0, 0, width, height);
List<int> bytes = gifencoder.makeGif(width, height,

To create an animated Gif, use a GifBuffer instead:

int framesPerSecond = ...;
var frames = new gifencoder.GifBuffer(width, height);
for (var i = 0; i < myFrameCount; i++) {
    // draw the next frame on the canvas context
    frames.add(ctx.getImageData(0, 0, width, height).data);
List<int> bytes =;

Once you have the bytes of the GIF, you can save it somewhere or convert it into a data URL. See example/example.dart for how to do that. You can run the example by running the following: pub run build_runner serve and then connecting to localhost in the browser on port 8081.

Testing #

To test in the VM:

pub run test -p vm

To run browser tests in Chrome:

pub run build_runner test --release -- -p chrome

You can also access the tests from a browser by running pub run build_runner serve and then connecting to localhost in the browser on port 8080.

Changelog #

1.0 #

  • Supports and requires Dart 2 (no API change)

0.2.3 #

  • Stable version for Dart 1


import 'dart:async';
import 'dart:html';
import 'dart:typed_data';

import "package:gifencoder/gifencoder.dart" as gifencoder;

const int size = 200;
const int frameCount = 32;
const int framesPerSecond = 15;

void drawSquare(CanvasRenderingContext2D ctx, int frameNumber) {
  final frameFraction = (frameNumber / frameCount);
  final green = 0;
  final blue = 0;
  for (int i = 0; i < size / 2; i++) {
    final drawnFraction = i / (size / 2);
    final red = (256 * (frameFraction + drawnFraction)).floor() % 256;
      ..fillStyle = "rgb($red,$green,$blue)"
      ..fillRect(i, i, size - i * 2, size - i * 2);

Future<String> createDataUrl(Uint8List bytes) {
  final c = new Completer<String>();
  final f = new FileReader();
  f.onLoadEnd.listen((ProgressEvent e) {
    if (f.readyState == FileReader.DONE) {
      final String url = f.result;
      c.complete(url.replaceFirst("data:;", "data:image/gif;"));
  f.readAsDataUrl(new Blob([bytes]));
  return c.future;

void main() {
  final ctx = new CanvasElement(width: size, height: size).context2D;
  final frames = new gifencoder.GifBuffer(size, size);
  for (var i = 0; i < frameCount; i++) {
    drawSquare(ctx, i);
    frames.add(ctx.getImageData(0, 0, size, size).data);
  final Uint8List gif =;
  createDataUrl(gif).then((dataUrl) {
    (querySelector("#gif") as ImageElement)..src = dataUrl;

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:

  gifencoder: ^1.0.0

2. Install it

You can install packages from the command line:

with pub:

$ pub get

with Flutter:

$ flutter pub get

Alternatively, your editor might support pub get or flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:

import 'package:gifencoder/gifencoder.dart';
Describes how popular the package is relative to other packages. [more]
Code health derived from static analysis. [more]
Reflects how tidy and up-to-date the package is. [more]
Weighted score of the above. [more]
Learn more about scoring.

We analyzed this package on Nov 15, 2019, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.6.0
  • pana: 0.12.21


Detected platforms: Flutter, web, other

No platform restriction found in primary library package:gifencoder/gifencoder.dart.

Maintenance suggestions

Package is getting outdated. (-29.59 points)

The package was last published 67 weeks ago.

The package description is too short. (-2 points)

Add more detail to the description field of pubspec.yaml. Use 60 to 180 characters to describe the package, what it does, and its target use case.


Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.0.0-dev.61.0 <3.0.0
Dev dependencies
build_runner ^0.9.2
build_test ^0.10.3+1
build_web_compilers ^0.4.1
test ^1.3.0