Making a sprite face the mouse

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
User avatar
fridays18
Citizen
Posts: 90
Joined: Tue Nov 01, 2022 3:24 pm

Making a sprite face the mouse

Post by fridays18 »

I want to make one sprite (this is for a top down game) that has a clear front and back, I then want the front of the sprite to always be facing the mouse pointer. Basically the sprite rotating to the mouse, does anyone know how I would go about this?
User avatar
Bigfoot71
Party member
Posts: 287
Joined: Fri Mar 11, 2022 11:07 am

Re: Making a sprite face the mouse

Post by Bigfoot71 »

Basically you need to get the angle between the position of the image and the mouse, you can do it with the function `math.atan2(dy,dx)` where dx and dy are the difference between the position of the mouse and image, here is an example:

Code: Select all

local lg = love.graphics

local GW, GH = lg.getDimensions()

local image = lg.newImage("spaceship.png")
local image_w, image_h = image:getDimensions()

local x, y = GW/2, GH/2
local ox, oy = image_w/2, image_h/2
local angle = 0

function love.update(dt)

    local mx, my = love.mouse.getPosition()

 -- angle = math.atan2(my-y, mx-x)+math.pi/2    -- get angle + 90° in radian
    angle = -math.atan2(mx-x, my-y)+math.pi     -- get -angle + 180° in radian


end

function love.draw()
    lg.draw(image,x,y,angle,1,1,ox,oy)
end
But what do you mean by:
that has a clear front and back
Attachments
rotate-to-mouse.love
(1.07 KiB) Downloaded 30 times
My avatar code for the curious :D V1, V2, V3.
User avatar
fridays18
Citizen
Posts: 90
Joined: Tue Nov 01, 2022 3:24 pm

Re: Making a sprite face the mouse

Post by fridays18 »

Bigfoot71 wrote: Wed Mar 01, 2023 2:13 pm Basically you need to get the angle between the position of the image and the mouse, you can do it with the function `math.atan2(dy,dx)` where dx and dy are the difference between the position of the mouse and image, here is an example:

Code: Select all

local lg = love.graphics

local GW, GH = lg.getDimensions()

local image = lg.newImage("spaceship.png")
local image_w, image_h = image:getDimensions()

local x, y = GW/2, GH/2
local ox, oy = image_w/2, image_h/2
local angle = 0

function love.update(dt)

    local mx, my = love.mouse.getPosition()

 -- angle = math.atan2(my-y, mx-x)+math.pi/2    -- get angle + 90° in radian
    angle = -math.atan2(mx-x, my-y)+math.pi     -- get -angle + 180° in radian


end

function love.draw()
    lg.draw(image,x,y,angle,1,1,ox,oy)
end
But what do you mean by:
that has a clear front and back
Appreciate the help this should work great! I meant front and back like the sprite clearly has a back and front rather than being kinda ambiguous.
MrFariator
Party member
Posts: 525
Joined: Wed Oct 05, 2016 11:53 am

Re: Making a sprite face the mouse

Post by MrFariator »

Clearly signaling which way the sprite is facing is more of a visual design dilemma, than anything löve specific. The usual go-to for perfectly top-down games (like Hotline Miami) tends to be that the character's arms clearly point one way or the other, particularly if they're holding a weapon of some sort. The alternative is to have the character's head lean forward in the direction they're facing, as seen in game like GTA2. Basically take an element of your character's design, and put some emphasis on it for clarity.

If in doubt, or you fear that player's might get confused in the heat of the moment, you could even add a toggle setting in the options that adds an arrow or triangle to signify character's facing direction.
User avatar
fridays18
Citizen
Posts: 90
Joined: Tue Nov 01, 2022 3:24 pm

Re: Making a sprite face the mouse

Post by fridays18 »

MrFariator wrote: Wed Mar 01, 2023 7:31 pm Clearly signaling which way the sprite is facing is more of a visual design dilemma, than anything löve specific. The usual go-to for perfectly top-down games (like Hotline Miami) tends to be that the character's arms clearly point one way or the other, particularly if they're holding a weapon of some sort. The alternative is to have the character's head lean forward in the direction they're facing, as seen in game like GTA2. Basically take an element of your character's design, and put some emphasis on it for clarity.

If in doubt, or you fear that player's might get confused in the heat of the moment, you could even add a toggle setting in the options that adds an arrow or triangle to signify character's facing direction.
Didnt even consider adding a arrow but that would add to the experience 10 fold, thanks for the hint!
Post Reply

Who is online

Users browsing this forum: Google [Bot] and 1 guest