How to make smooth camera movement?

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
manuersuper
Prole
Posts: 2
Joined: Wed Nov 25, 2020 3:40 pm

How to make smooth camera movement?

Post by manuersuper »

Hello, i'm new to love2d and i can't resolve this simple problem, basically i was able to implement a camera that follows the ''player'' ( a simple square) but i don't know how to make the camera more smooth like for example in this video (around 23.20) https://youtu.be/hRsMCMe5K7s?t=1400 I'm using hump for the camera and i read on the documentation (https://hump.readthedocs.io/en/latest/c ... -smoothers) something about smoothness but still can't understand what to do. Any help is appreciated!

Code: Select all

Camera = require "camera"

function love.load()
	player = {}
	player.x= 500
	player.y= 120
camera = Camera(player.x, player.y)
end

function love.update(dt)
	local dx,dy = player.x - camera.x, player.y - camera.y
    camera:move(dx/2, dy/2)
   
   --movement control
  if love.keyboard.isDown("a") and player.x > 0 then 
   player.x = player.x - 5
  end
  if love.keyboard.isDown("d") and player.x < 10000 then
    player.x = player.x + 5
  end
  if love.keyboard.isDown("w") and player.x > 0 then 
   player.y = player.y - 5
  end
  if love.keyboard.isDown("s") and player.x < 10000 then
    player.y = player.y + 5
  end

end

function love.draw()
	camera:attach()
	--background
    love.graphics.rectangle('fill',0,0,500,300) 
	love.graphics.setColor(11, 0, 12) 
	--player
	love.graphics.rectangle('fill',player.x,player.y,100,100)
	love.graphics.setColor(0, 0, 1)
    camera:detach()
end
Edit: adding this in love.update i kinda get the result that i want but it has some problems

Code: Select all

local dx,dy = player.x - cam.x, player.y - cam.y
	if(dx>50 or dy>50 or dx<-50 or dy<-50) then
    cam:move(dx/10, dy/10) end
ginevra
User avatar
4vZEROv
Party member
Posts: 126
Joined: Wed Jan 02, 2019 8:44 pm

Re: How to make smooth camera movement?

Post by 4vZEROv »

When you want to smoothly set a value to a target value you want to use linear interpolation (aka. lerp).

Code: Select all

	function lerp(a, b, x) return a + (b - a) * x end
	-- or a better version framerate independant
	function lerp(a, b, x, dt) return a + (b - a) * (1.0 - math.exp(-x * dt)) end
In your case the hump library provide already a lerp function so I believe if you initialise the camera with the lerp like below you don't have to do the math and it should work just fine.

Code: Select all

function love.load()
cam = Camera()
cam.smoother = Camera.smooth.damped(10)
end

function love.update(dt)
	cam:update(dt)
	cam:move(x,y)
end
User avatar
manuersuper
Prole
Posts: 2
Joined: Wed Nov 25, 2020 3:40 pm

Re: How to make smooth camera movement?

Post by manuersuper »

Thanks so much for the answer and the explanation
ginevra
User avatar
zorg
Party member
Posts: 3444
Joined: Thu Dec 13, 2012 2:55 pm
Location: Absurdistan, Hungary
Contact:

Re: How to make smooth camera movement?

Post by zorg »

Just an addendum, this might be an even better lerp/damping function, but i haven't tested the combination yet (i only know that the main part of it can actually reach 1.0 in all cases, not whether the exponential messes with that or not)

Code: Select all

function lerp(a, b, x, dt)
local t = (1.0 - math.exp(-x * dt))
return a * (1.0 - t) + b * t
end
Me and my stuff :3True Neutral Aspirant. Why, yes, i do indeed enjoy sarcastically correcting others when they make the most blatant of spelling mistakes. No bullying or trolling the innocent tho.
RNavega
Party member
Posts: 249
Joined: Sun Aug 16, 2020 1:28 pm

Re: How to make smooth camera movement?

Post by RNavega »

I think the LERP in the form (a + (b-a)*t) is faster than the form (a*(1-t) + b*t) used in that function because there's one less multiplication op.
User avatar
pgimeno
Party member
Posts: 3550
Joined: Sun Oct 18, 2015 2:58 pm

Re: How to make smooth camera movement?

Post by pgimeno »

Most importantly, it is monotonic, which zorg's formula isn't. As a drawback, it doesn't always equal b when t = 1, which zorg's formula does.
https://math.stackexchange.com/question ... erpolation

But if I read a program with a function called lerp that performs something more than linear interpolation, I would be very confused. I'd separate the interpolation from the damping, because linear interpolation may be useful on its own in other parts of the program:

Code: Select all

local function lerp(a, b, t)
  return t < 0.5 and a + (b - a) * t or b + (a - b) * (1 - t)
end

local function damp(a, b, x, dt)
  return lerp(a, b, math.exp(-x * dt))
end
RNavega
Party member
Posts: 249
Joined: Sun Aug 16, 2020 1:28 pm

Re: How to make smooth camera movement?

Post by RNavega »

Wow, that's a thorough analysis there. Thanks Pedro!
Post Reply

Who is online

Users browsing this forum: Google [Bot], Yolwoocle and 219 guests