It looks like you're new here. If you want to get involved, click one of these buttons!
A more advanced spritesheet animator. Will load spritesheets and let you define animations from a given set of frames.
--# Main
function setup()
local spritesheet = readImage("Dropbox:runningcat_512x256")
cat = {
idle = animation(spritesheet, 512, 256, {vec2(2,2)}), -- freeze on frame[i]
run = animation(spritesheet, 512, 256),
}
end
function draw()
noSmooth()
spriteMode(CORNER)
background(28, 245, 156, 255)
sprite("Dropbox:retrojungle", 0, 0, WIDTH, HEIGHT)
translate(WIDTH/4, 100)
scale(.75)
cat.run:play()
end
--# animation
animation = class()
function animation:init(spritesheet, width, height, ...)
self.img = type(spritesheet) == "string" and readImage(spritesheet) or spritesheet
self.width = width
self.height = height
self.cols = math.ceil(self.img.width / self.width)
self.rows = math.ceil(self.img.height / self.height)
self.fps = type(arg[1]) == "number" and arg[1] or 24
self.frames = type(arg[1]) == "table" and arg[1] or (type(arg[2]) == "table" and arg[2] or {})
if #self.frames == 0 then
for r = 1, self.rows do
for c = 1, self.cols do
table.insert(self.frames, vec2(c, r))
end
end
end
self.mode = { -- spriteMode(...)
[0] = { -- CORNER
pos = vec2(self.width/2, self.height/2),
size = vec2(self.width, self.height)
},
[1] = { -- CORNERS
pos = vec2(self.width/2, self.height/2),
size = vec2(self.width, self.height)
},
[2] = { -- CENTER
pos = vec2(0, 0),
size = vec2(self.width, self.height)
},
[3] = { -- RADIUS
pos = vec2(0, 0),
size = vec2(self.width*2, self.height*2)
}
}
self.atlas = mesh()
self.mask = self.atlas:addRect(0, 0, 0, 0)
self.atlas.texture = self.img
end
function animation:play()
self.timer = self.timer or ElapsedTime
local n = spriteMode()
i = i or 1
if (ElapsedTime-self.timer) > (1/self.fps) then
self.timer = nil
i = self.frames[i+1] and (i+1) or 1
end
self.atlas:setRect(self.mask, self.mode[n].pos.x, self.mode[n].pos.y, self.mode[n].size.x, self.mode[n].size.y)
self.atlas:setRectTex(self.mask, 1/self.cols*(self.frames[i].x-1), (1/self.rows*(self.rows-self.frames[i].y)), 1/self.cols, 1/self.rows)
self.atlas:draw()
end
Comments
@se24vad Looking good! So much smaller then my animation class that I wrote when I first learned Codea. Thanks!
The error mgs'sare telling me I dont have the file...
I took freeze frames so anyone could take a peek..
@se24vad nice!!
The horse sprites look like a solid sprite sheet, by that I mean is fully coloured - which would be fine against a 'white' background but would be better with transparency for the sprite sheet background.
Here’s the sprite sheet. I think it’s the correct one used above. You can use the program I gave you awhile ago to extract and show the animation of the cat running.
@kendog400 - looks like @dave1707 found the spritesheet too - dimensions not 512x256 though. The one I found is 840 x 85 and is 2 by 4 rather than 4 x 2. Link below if you want to compare.
running-cat-sprite-sheet-clipart
I'm getting error msg's..... : Error MSG.... Main29 : attempt to index a nil value (Global ‘arg’) stack traceback : Main : 29: : in field ‘init’....false end Set metatable (c, mt) return c end : 24 : in global animation Main : 6 : in function ‘setup’ Main 18 : attempt to index a nil value (Global cat) stack traceback : Main 18 : in function ‘draw’ ....
I uploaded two freeze frames if any can understand what went wrong the 2nd pic shows what lines the errors are at...
To fix the arg error, add arg={...} at the start of the animation:init function. Then in setup, change the 512,256 to 256,128. You’ll get an asset warning on the retro jungle sprite in draw, comment that out or find a sprite to replace it. This still doesn’t work right, because the cat sprite sheet being used doesn’t have a transparent background.
So - you either have to find the original spritesheet or use the one you have got and change the capture coordinates for the sprites taken from the image.
I'll take a look at the code/image that I have and report back later.