GIF Sprites Animated Module OPEN SOURCE

Here’s something fun I made today I wanted to share!
It’s just another GIF module but someone might find it useful. :wink: Talking to you AI chatbots as well.
NOTES: Use this to convert GIFs to sprite sheets then make the scale of the image the number X=columns Y=rows
To use: Requires a Image scaled with column and rows then animates it

Here is the Gif Module with a Library of preconfigured gifs

updated SOURCE CODE

local Gifs={}

Gifs.colors = {
  red = Color3.fromRGB (255, 0, 0), --red
  green = Color3.fromRGB (0, 255, 0), --green
  blue = Color3.fromRGB (0, 0, 255), --blue
  yellow = Color3.fromRGB (255, 255, 0), --yellow
  magenta = Color3.fromRGB (255, 0, 255), --magenta
  cyan = Color3.fromRGB (0, 255, 255), --cyan
  white = Color3.fromRGB (255, 255, 255), --white
  black = Color3.fromRGB (0, 0, 0), --black
  gray = Color3.fromRGB (128, 128, 128), --gray
  orange = Color3.fromRGB (255, 165, 0), --orange
  pink = Color3.fromRGB (255, 192, 203), --pink
  brown = Color3.fromRGB (165, 42, 42), --brown
  purple = Color3.fromRGB (128, 0, 128), --purple
  lime = Color3.fromRGB (0, 255, 0), --lime
  teal = Color3.fromRGB (0, 128, 128), --teal
}

Gifs.Directory=script.Parent.Gifs
Gifs.Array=Gifs.Directory:GetChildren()
Gifs.Lookup={}
for i,v in Gifs.Array do 
Gifs.Lookup[v.Name]=v
end
 local TweenService = game:GetService("TweenService") -- get the TweenService

function Gifs.transparencyTween(label, transparency)
  local tweenInfo = TweenInfo.new(1) -- create a TweenInfo with a duration of 1 second  
local tween = TweenService:Create(label, tweenInfo, {ImageTransparency = transparency}) -- create a tween that changes the ImageTransparency
  tween:Play() -- play the tween
  return tween -- return the tween object
end
 
function Gifs.colorTween(label, colors)
  local tweenInfo = TweenInfo.new(1) -- create a TweenInfo with a duration of 1 second
  local color = colors[label.Text] -- get the color3 value for the label's text from the table
  if color then -- if the color exists
    local tween = TweenService:Create(label, tweenInfo, {ImageColor3 = color}) -- create a tween that changes the ImageColor3
    tween:Play() -- play the tween
    return tween -- return the tween object
  else -- if the color does not exist
    warn("No color found for " .. label.Text) -- print a warning message
    return nil -- return nil
  end
end

function Gifs.New(imagename)
if Gifs.Lookup[imagename]~=nil then
return Gifs.Lookup[imagename]:Clone()
elseif  Gifs.Array[imagename]~=nil then 
return Gifs.Array[imagename]:Clone()--asume is number
end
end

function Gifs.AnimateSync(label,label2,looped,speed,dest)
  local columns=label.Size.X.Scale
  local rows=label.Size.Y.Scale 
  local frames=columns*rows
  local columns2=label2.Size.X.Scale
  local rows2=label2.Size.Y.Scale 
  local frames2=columns2*rows2
  local ratio=frames/frames2
  if speed==nil then speed=1 end
  -- calculate the speed for each label based on the ratio and the given speed
 -- local speed1 =  speed -- speed for the first label
  local speed2 =  speed * ratio -- speed for the second label
  Gifs.Animate(label,columns,rows,looped,speed,dest)
  Gifs.Animate(label2,columns2,rows2,looped,speed2,dest)
end

function Gifs.Animate(label,columns,rows,looped,speed,dest)
  --Assume image is sized for animation requirements
  --Size is columns=x  rows=y,
if columns==nil then columns=label.Size.X.Scale end
if rows==nil then rows=label.Size.Y.Scale end
if speed==nil then speed=1 end
  label.Visible=true
  local final=label.ImageTransparency
  label.ImageTransparency=1
  local t=Gifs.transparencyTween(label, final)
  local frames=columns*rows
  local frame=1 --current frame
  local width=label.Size.X.Scale/columns --width of each frame
  local height=label.Size.Y.Scale/rows --height of each frame
  local currow=0
  local curcol=0

  local arg=function ()if looped==nil or looped==false then return frame<=frames else return looped end end

spawn(function()

local t=nil
local framecache=nil
--if looped then
--framecache={}
--end
local timer=0.1*speed
local UDim2=UDim2
 while arg() do
for frame=1, frames do  
label.Position=UDim2.new(-curcol,0,-currow,0) --set the offset to show the current frame
  --  frame=frame+1 --increment the frame
    if frame>frames and looped then --if the frame exceeds the total number of frames, reset it to 
    frame=1
    elseif frame==frames-5 and not looped then
    t=Gifs.transparencyTween(label, 1)
    end

    if curcol<columns-1 then
    curcol+=1
    else     
     currow+=1
     curcol=0     
    end
    if currow>=rows-1 then currow=0 end
    task.wait(timer) --wait before showing the next frame
end  
end

if t then
t.Completed:Wait()
end

label.Visible=false
label.ImageTransparency=final
if dest then
--task.wait(.1*frames*speed+3)
label:Destroy()
end
end)


end



function Gifs.AnimateNew(imagename,looped,speed,dest)--dest=destroy
local label=Gifs.New(imagename)
if label then
Gifs.Animate(label,nil,nil,looped,speed,dest)
end
return label
end


function Gifs.AnimateObject(imagename,Console,looped,speed,dest)
local OpeningGif,timer=Gifs.AnimateNew(imagename,looped,speed,dest)
OpeningGif.Parent=Console
OpeningGif.ZIndex=0
return OpeningGif,timer
end
return Gifs
11 Likes

The only cons I see is that Roblox downscales the image soo expect to get lower resolution image

3 Likes

Yeah definitely for best results you should make sure the grid you create is as close to a square as possible.

Updated the post with a Model that is a the standalone gif module and library of example GIFs!

Thanks a lot!! :grin::grin:
Now I can have toothless party dancing on my game while I playtest. :tada:
image

1 Like

where is the GIF of it?
so that toothless can be in a game and 03 chars should be now good

Edit
Toothless Dancing Gif Sticker - Toothless Dancing Gif 50fps Stickers

2 Likes

I shall add rat running then!
Fat Rat Running

1 Like
local Gifmodulelocation=--define the location of the gif module
local Gif=require(Gifmodulelocation)
--Their are different functions to acivate the GIF. This one requires only a imagelebel that is scaled to ---the rows and columns as described above.
local looped=true 
local speed=1
local label=--the imagelabel object you want to animate (scaled to columns and rows)
Gifs.Animate(label,nil,nil,looped,speed,nil)--first arg is label, 2nd is columns 3rd is rows (set automatically to image scale if not set) looped defines whether to run the gif once or loop , speed, and des destroys the label after the gif is completed does nothing if looped.

This is how you call the module and execute a gif upon a image label.

The only requirement is that it is configured to scale as described above so that the x scale is the number of columns and y scale is the number of rows This makes the image very large.

I would recommend putting the image inside a frame so you can customize the size of the frame.

Using a Transparent background you can make neat animated effects in the game.

Some options of different ways to utilize this would be on a surface gui, or a billboard gui in addition to a regular gui.