This page is in support for the video tutorial on using Sprites/Images in Love as part of the GameDev For Complete Beginners tutorial series. It contains the code and images used in the tutorial. There is also a copy of the tutorial embedded below.
Images
The graphics are from this pack of images, made transparent using this process.
![]()
![]()
Simply right click and save to your project directory.
Source Code
Drawing an Image
local imageFile function love.load() imageFile = love.graphics.newImage("ALC-17.PNG") end function love.draw() love.graphics.draw(imageFile) end
Using a Spritesheet
local imageFile local frames = {} local activeFrame local currentFrame = 1 function love.load() imageFile = love.graphics.newImage("AttackChoppers.PNG") frames[1] = love.graphics.newQuad(0,0,128,64,imageFile:getDimensions()) frames[2] = love.graphics.newQuad(128,0,128,64,imageFile:getDimensions()) frames[3] = love.graphics.newQuad(0,64,128,64,imageFile:getDimensions()) frames[4] = love.graphics.newQuad(128,64,128,64,imageFile:getDimensions()) activeFrame = frames[currentFrame] print(select(4,activeFrame:getViewport())/2) end function love.draw() --love.graphics.draw(imageFile,activeFrame) --[[ love.graphics.draw(imageFile,activeFrame, love.graphics.getWidth()/2 - (select(3,activeFrame:getViewport())/2) * 2, love.graphics.getHeight()/2 - (select(4,activeFrame:getViewport())/2) * 2, 0, 2, 2) ]]-- -- draw image 4x size centered love.graphics.draw(imageFile,activeFrame, love.graphics.getWidth()/2 - ({activeFrame:getViewport()})[3]/2 * 4, love.graphics.getHeight()/2 - ({activeFrame:getViewport()})[4]/2 * 4, 0, 4, 4) end local elapsedTime = 0 function love.update(dt) elapsedTime = elapsedTime + dt if(elapsedTime > 1) then if(currentFrame < 4) then currentFrame = currentFrame + 1 else currentFrame = 1 end activeFrame = frames[currentFrame] elapsedTime = 0 end end
The Video
