visualy tracking coordinate areas for sprites [Solutions Provided]

Questions about the LÖVE API, installing LÖVE and other support related questions go here.
Forum rules
Before you make a thread asking for help, read this.
Post Reply
klewis
Prole
Posts: 4
Joined: Fri Jan 10, 2020 1:54 pm

visualy tracking coordinate areas for sprites [Solutions Provided]

Post by klewis » Fri Jan 10, 2020 2:29 pm

Hello, my name is klewis and I am new to the community. I just want to say how awesome love2d is going for me so far. I pretty excited with the workflow process of building up games through the language. I'm in the midst of creating a zombie game that includes some sprite characters.

Here is my progress so far:

Code: Select all

function love.load()
    sprites = {}
    sprites.player = love.graphics.newImage('sprites/player.png')
    sprites.bullet = love.graphics.newImage('sprites/bullet.png');
    sprites.zombie = love.graphics.newImage('sprites/zombie.png');
    sprites.background = love.graphics.newImage('sprites/background.png');

    player = {}
    player.x = 600
    player.y = 200
    player.speed = 3
end

function love.update(dt)
    if love.keyboard.isDown("s") then
        player.y = player.y + player.speed
    end
    if love.keyboard.isDown("w") then
        player.y = player.y - player.speed
    end
    if love.keyboard.isDown("s") then
        player.y = player.y + player.speed
    end
     if love.keyboard.isDown("a") then
        player.x = player.x - player.speed
    end
    if love.keyboard.isDown("d") then
        player.x = player.x + player.speed
    end
end

function love.draw()
    love.graphics.draw(sprites.background, 0, 0)
    love.graphics.draw(sprites.player, player.x, player.y) 
 end
..How can I enable something like a "debug mode" that shows me the actual spacial coordinates of the space that my sprite character taking up? In other words, I want to visually see an outline of the space that sprites take up.

* This will help me visually see that he is sitting on the top left of his given area by default
* It will also help me see (later) at what point collisions happen.

Is this possible with love2d?

Thanks!
Last edited by klewis on Sat Jan 18, 2020 1:56 am, edited 1 time in total.

User avatar
master both
Party member
Posts: 260
Joined: Tue Nov 08, 2011 12:39 am
Location: Chile

Re: visualy tracking coordinate areas for sprites

Post by master both » Fri Jan 10, 2020 5:41 pm

Hi, welcome to the forums :)
The simplest solution for this is to actually draw the outline with a rectangle.

Code: Select all

function love.load()
    sprites = {}
    sprites.player = love.graphics.newImage('sprites/player.png')
    sprites.bullet = love.graphics.newImage('sprites/bullet.png');
    sprites.zombie = love.graphics.newImage('sprites/zombie.png');
    sprites.background = love.graphics.newImage('sprites/background.png');

    player = {}
    player.x = 600
    player.y = 200
    player.speed = 3
    -- get the sprite dimensions
    player.width = sprites.player:getWidth()
    player.height = spritse.player:getHeight()
end

function love.update(dt)
    if love.keyboard.isDown("s") then
        player.y = player.y + player.speed
    end
    if love.keyboard.isDown("w") then
        player.y = player.y - player.speed
    end
    if love.keyboard.isDown("s") then
        player.y = player.y + player.speed
    end
     if love.keyboard.isDown("a") then
        player.x = player.x - player.speed
    end
    if love.keyboard.isDown("d") then
        player.x = player.x + player.speed
    end
end

function love.draw()
    love.graphics.draw(sprites.background, 0, 0)
    love.graphics.draw(sprites.player, player.x, player.y) 
    -- draw sprite outline
    love.graphics.rectangle("line", player.x, player.y, player.width, player.height)
 end
Good luck :)

User avatar
raidho36
Party member
Posts: 2063
Joined: Mon Jun 17, 2013 12:00 pm

Re: visualy tracking coordinate areas for sprites

Post by raidho36 » Fri Jan 10, 2020 10:24 pm

Alternatively, you can use a shader that will draw a rectangle (or sprite edge) outline, auxiliary debug texture, a debug color filling, and million other things.

Sobel filter with a small tweak (read alpha difference and output it as color) can draw a sprite outline. Vingette filter with some of its math removed and tweaked (remove quadratic distance and apply a multiplier) will draw an outline or a fill. Drawing auxiliary debug textures can be done by simply sampling a second texture passed through a custom shader uniform, and mixing the color into the output.

User avatar
ReFreezed
Party member
Posts: 162
Joined: Sun Oct 25, 2015 11:32 pm
Location: Sweden
Contact:

Re: visualy tracking coordinate areas for sprites

Post by ReFreezed » Sat Jan 11, 2020 10:10 am

love.graphics.setWireframe may be of interest.
Tools: Hot Particles, LuaPreprocess
Games: Momento Temporis: Light from the Deep, Momento Temporis: Arena, Energize!
"If each mistake being made is a new one, then progress is being made."

klewis
Prole
Posts: 4
Joined: Fri Jan 10, 2020 1:54 pm

Re: visualy tracking coordinate areas for sprites

Post by klewis » Sat Jan 18, 2020 1:56 am

Thank you so much for the rich feedback. I will research each approach and test things on my end. This definitely gives me opportunities to dig into the framework!

Post Reply

Who is online

Users browsing this forum: No registered users and 24 guests