Skip to content
This repository has been archived by the owner on Nov 10, 2020. It is now read-only.
/ as3-gif-support Public archive

Contains some dependencies used to run GIF files in your AS3 project.

License

Notifications You must be signed in to change notification settings

Devwarlt/as3-gif-support

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

17 Commits
 
 
 
 
 
 
 
 

Repository files navigation

AS3: *.GIF support license-badge

Contains some dependencies used to run GIF files in your AS3 project.

Languages

as3-language-badge flex-language-badge

Intro

Firstly, you need to know what is the *.GIF extension:

A GIF is a lossless format for image files that supports both animated and static images. It was the standard for 8-bit colour images on the internet until PNG became a viable alternative. You may have seen them used often in email signatures. Animated GIFs are several images or frames combined into a single file.

In other words, you can actually split your GIF file into a collection of several frames, whose could be exported as *.PNG format type.

Tutorial

  • Step 1 - split your GIF file into a collection of several frames

    This is the first step needed to properly setup GIF support for your AS3 project, you can use EZGIF.com - GIF frame extractor or any other online tool, as long you have all desired frames from your GIF.

  • Step 2 - setup a template for your GIF

    With your GIF frames in hands, create a new folder (to keep it organised) and place all frames there.

    media-1

  • Step 3 - create a new file for your GIF class

    This class will be responsible to extends most used GIF behaviors like:

    Your class file might look like example below (if you have various frames to process, checkout this script):

    💡 Note: you can control the frame delay speed with parameter frameDelay on GIF::constructor().

import GIF;

import mx.core.BitmapAsset;

public class PeppoHackerGIF extends GIF {
    [Embed(source="frame_00_delay-0.07s.gif")]
    private const frame0:Class;
    [Embed(source="frame_01_delay-0.07s.gif")]
    private const frame1:Class;
    [Embed(source="frame_02_delay-0.07s.gif")]
    private const frame2:Class;
    
    // ... frames declaration scope
    
    [Embed(source="frame_19_delay-0.07s.gif")]
    private const frame19:Class;

    public function PeppoHackerGIF() {
        super(70, new <BitmapAsset>[
            new this.frame0 as BitmapAsset,
            new this.frame1 as BitmapAsset,
            new this.frame2 as BitmapAsset,
            
            // ... frames assign
            
            new this.frame19 as BitmapAsset
        ]);
    }
}
  • Step 4 - usage of your GIF class in action

    It's done. You can now control your GIF dynamically and attach to your Sprite using Object::AddChild().

var peppoGIF:GIF = new PeppoHackerGIF();
peppoGIF.start();
this.addChild(peppoGIF);

C# code: this is used at rextester.com to make it dynamic formatting

Make sure to change pattern of your file name and also amout of frames that'll be generated with this code using variables attributePattern and amount, see output for more details how it does behave.

⚠️ Note: this C# program execution is optional, just in case you have tons of frames to process in a single file.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Text.RegularExpressions;

namespace Rextester
{
    public class Program
    {
        public static void Main(string[] args)
        {
            var attributePattern = "[Embed(source=\"frame_{frame_index}_delay-0.07s.gif\")]";
            var propertyPattern = "private const frame{frame_index}:Class;";
            var vectorPattern = "new <BitmapAsset>[\n{frames}\n]";
            var frames = new StringBuilder();
            var amount = 3;
            for (var i = 0; i <= amount; i++) {
                frames.Append($"\tnew this.frame{i} as BitmapAsset{(i + 1 > amount ? "" : ",\n")}");
                Console.WriteLine(
                    $"{attributePattern.Replace("{frame_index}", i.ToString("00"))}" +
                    $"\n{propertyPattern.Replace("{frame_index}", i.ToString())}"
                );
            }

            Console.WriteLine($"\n{vectorPattern.Replace("{frames}", frames.ToString())}");
        }
    }
}
output
[Embed(source="frame_00_delay-0.07s.gif")]
private const frame0:Class;
[Embed(source="frame_01_delay-0.07s.gif")]
private const frame1:Class;
[Embed(source="frame_02_delay-0.07s.gif")]
private const frame2:Class;
[Embed(source="frame_03_delay-0.07s.gif")]
private const frame3:Class;

new <BitmapAsset>[
	new this.frame0 as BitmapAsset,
	new this.frame1 as BitmapAsset,
	new this.frame2 as BitmapAsset,
	new this.frame3 as BitmapAsset
]

Contributors

About

Contains some dependencies used to run GIF files in your AS3 project.

Topics

Resources

License

Stars

Watchers

Forks