Growing circle on click (Missile Command style)

[replicate]

This has probably been answered before or is so straightforward it's never been asked, but I'd really appreciate some help :/ Trying to make a circle appear on mouse coords on click that starts out small and grows to a set limit over 2 or 3 seconds, then either dissapears or shrinks opposite how it grew. If you've ever played Missile Command, you'll know exactly what I'm talking about (the explosion that occurs wherever you click).

At this point it doesn't need any physics or collision detection or anything fancy. What I've got so far is the circle will appear at mouse coords as expected, but grows so fast you can't even tell. I'm sure it's something with the love.update(dt) function, but I'm not familiar enough with it to know for certain. Basically, I just want to slow the growth down via the radius variable and pass that to my love.circle.draw function elsewhere (which works in it's own right). I think this is the relevant code. Thanks.

Code: Select all

function love.update(dt)
	mx = love.mouse.getX()
	my = love.mouse.getY()
	radius = radius + 2
	if radius > 100 then radius = 1 end
end

[bmelts]

The issue with that code is that the radius is growing by 2 pixels every frame. For a simple program like that, a frame is a very small fraction of a second.

The solution is to make the growth pegged to the length of the frame. Try this:

Code: Select all

function love.update(dt)
   mx = love.mouse.getX()
   my = love.mouse.getY()
   radius = radius + (2 * dt)
   if radius > 100 then radius = 1 end
end

That'll make the radius grow at 2 pixels per second, which is pretty slow, but the growth would be a lot more visible there!

[Robin]

Also, this way it keeps growing after it reached the 100 and is shrunk. Do you want it to repeat?

[Jasoco]

Paste this into a new project and play around with it.

Code: Select all

local pi = math.pi
local gr = love.graphics
local _sq = math.sqrt
math.randomseed(os.time())
function love.load()
	gr.setFont(love._vera_ttf, 14)

	gr.setBackgroundColor(0,0,0)

  --Set up Missile and Bomb tables
  missiles = {}
  bombs = {}

  --Add 10 random Bombs
  for i=0,10,1 do
    table.insert(bombs, {x = math.random(20,620), y = -10})
  end
end

function love.update(dt)
  --Move the Bombs (Enemy missiles)
  for j, b in pairs(bombs) do
    b.y = b.y + 10 * dt
    b.x = b.x + 5 * dt
  end

  --Update the player missiles
  for i, m in pairs(missiles) do
    --Make them bigger and kill them when done
    m.life = m.life - 100 * dt
    if m.life <= 0 then
      table.remove(missiles, i)
    end
    --Check for collision with enemy bombs
    for j, b in pairs(bombs) do
      if distanceFrom(b.x, b.y, m.x, m.y) < (m.start-m.life) then
        --Set off another explosion to chain to the closer bombs
        createMissile(b.x, b.y, 40)
        table.remove(bombs, j)
      end
    end
  end
end

function love.draw()
	local fps = love.timer.getFPS()

  --Draw the Enemy Bombs
	for j, b in pairs(bombs) do
	  gr.setColor(255,0,0,255)
    gr.circle("fill", b.x, b.y, 5, 32)
	end

  --Draw the Player Missiles
	for i, m in pairs(missiles) do
	  gr.setColor(255,255,255,220)
    gr.circle("fill", m.x, m.y, m.start-m.life, 32)
	end

	gr.setColor(255,255,255)
	gr.print("FPS: " .. fps, 10, 14)
end

function love.mousepressed(x, y, button)
  if button == "l" then
    createMissile(x,y,50)
  end
end

--Create a missile wherever you want
function createMissile(x,y,l)
  table.insert(missiles, { x = x, y = y, life = l, start = l })
end

--Returns the distance between two points
function distanceFrom(x1,y1,x2,y2) return _sq((x2 - x1) ^ 2 + (y2 - y1) ^ 2) end

You could take it further and make each enemy bomb have a target that it flies towards like the real game does.

It even has chains where detonated bombs will detonate other bombs close by just like the real game.

[Robin]

Jasoco! Shame on you!

If you have to play dirty, at least use locals:

Code: Select all

local pi = math.pi
local gr = love.graphics
local _sq = math.sqrt

[Jasoco]

Hahahahahaha... no. What? Sorry. Okay. I will obey.. maybe. It was quick and dirty so sue me.

Also, in the part where the missiles are updated, the number 100 is the speed of pixels per frame. 100 is pretty fast and is more comparable to the original. 2 pixels per frame would take forever to grow.