[Solved] Menu - Button Hover Sound Code

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
TheDeskPop
Prole
Posts: 10
Joined: Fri Dec 28, 2012 6:23 pm
Contact:

[Solved] Menu - Button Hover Sound Code

Post by TheDeskPop »

Hello I have a question and might need to reformat some of what I have done. I am in need of some assistance.

What I have is a menu and 2 buttons that upon hover state I wish to play audio. I have it so that the audio plays. However, it is on somewhat of a default loop. See the problem here is that while still hovering it continues to play. I dont know how to make it so that upon FIRST hover it plays and then stops if still hovering.

This is not a

Code: Select all

Source:setLooping(loop)
fix.

This is the code I have (please bare with me I am new) and I realize that this may not be correct (obviously it isnt or I wouldnt be asking.) :oops:

Code: Select all

local function drawButton(off, on, x, y, w, h, mx, my)
	local ins = insideBox( mx, my, x - (w/2), y - (h/2), w, h )
	
	if ins then
		love.graphics.draw( on, x, y, 0, 1, 1, (w/2), (h/2) )

	else
		love.graphics.draw( off, x, y, 0, 1, 1, (w/2), (h/2) )
	end
	
	if not once and (ins) then
		love.audio.play(src2)
		once = true
	elseif once and (ins) then
		once = false
	end
end
Last edited by TheDeskPop on Sun Dec 30, 2012 3:05 am, edited 1 time in total.
User avatar
Boolsheet
Inner party member
Posts: 780
Joined: Wed Dec 29, 2010 4:57 am
Location: Switzerland

Re: Menu - Button Hover Sound Code

Post by Boolsheet »

The problem is that this code toggles 'once' every time it is executed.

Code: Select all

   if not once and (ins) then
      love.audio.play(src2)
      once = true
   elseif once and (ins) then
      once = false
   end
You may want a 'not ins' in the second condition.
Shallow indentations.
User avatar
TheDeskPop
Prole
Posts: 10
Joined: Fri Dec 28, 2012 6:23 pm
Contact:

Re: Menu - Button Hover Sound Code

Post by TheDeskPop »

Well, thanks boolsheet! This got me one step closer! Now it plays the sound just once but upon re-hovering, it does not play the sound again. This now the code that makes the above possible.

Code: Select all

if not once and (ins) then
		love.audio.play(src2)
		once = true
	elseif not once and (ins) then
		once = false
	end
Any further ideas on how to make the sound play every time the button is hovered over?
User avatar
Boolsheet
Inner party member
Posts: 780
Joined: Wed Dec 29, 2010 4:57 am
Location: Switzerland

Re: Menu - Button Hover Sound Code

Post by Boolsheet »

I meant you should do it like this.

Code: Select all

   if not once and ins then
      love.audio.play(src2)
      once = true
   elseif once and not ins then
      once = false
   end
Shallow indentations.
User avatar
TheDeskPop
Prole
Posts: 10
Joined: Fri Dec 28, 2012 6:23 pm
Contact:

Re: Menu - Button Hover Sound Code

Post by TheDeskPop »

Boolsheet wrote:I meant you should do it like this.

Code: Select all

   if not once and ins then
      love.audio.play(src2)
      once = true
   elseif once and not ins then
      once = false
   end
I tried it this way and it does the same thing. Doing it this way repeats the sound. This is where I am leaning towards I did not create this correctly. I will show more code and maybe that will help better diagnose the issue and solve the problem.

My code for the buttons (what you see in update is for the bgm or in this case (src1) =

Code: Select all

	buttons = 	{
				{imgOff = imgPlay, imgOn = imgPlayOn, x = 400, y = 300 - 64, w = 256, h = 64, action = "play"},
				{imgOff = imgExit, imgOn = imgExitOn, x = 400, y = 300 + 64, w = 256, h = 64, action = "exit"}
				}
end

local function drawButton(off, on, x, y, w, h, mx, my)
	local ins = insideBox( mx, my, x - (w/2), y - (h/2), w, h )
	
	if ins then
		love.graphics.draw( on, x, y, 0, 1, 1, (w/2), (h/2) )

	else
		love.graphics.draw( off, x, y, 0, 1, 1, (w/2), (h/2) )
	end
	
	if not once and ins then
		love.audio.play(src2)
		once = true
	elseif once and not ins then
		once = false
	end
end

function love.draw()
	love.graphics.setColor (255, 255, 255)
	love.graphics.draw (imgBackground, 0, 0, 0, 1, 1, 0, 0)
	
	local x = love.mouse.getX( )
	local y = love.mouse.getY( )

	for k, v in pairs(buttons) do
		drawButton( v.imgOff, v.imgOn, v.x, v.y, v.w, v.h, x, y )
	end
	
end

function love.update(dt)
	src1:setLooping(true)
end
Santos
Party member
Posts: 384
Joined: Sat Oct 22, 2011 7:37 am

Re: Menu - Button Hover Sound Code

Post by Santos »

How about something like this:

Code: Select all

function love.load()
	buttons =    {
		{imgOff = imgPlay, imgOn = imgPlayOn, x = 400, y = 300 - 64, w = 256, h = 64, action = "play", active = false},
		{imgOff = imgExit, imgOn = imgExitOn, x = 400, y = 300 + 64, w = 256, h = 64, action = "exit", active = false}
	}

	src1 = love.audio.newSource('music.ogg', 'stream')
	src1:setLooping(true)

	src2 = love.audio.newSource('sound.ogg', 'static')
end

function love.draw()
	for k, v in pairs(buttons) do
		drawButton(v)
	end
end

function love.update(dt)
	local x = love.mouse.getX( )
	local y = love.mouse.getY( )

	for k, v in pairs(buttons) do
		if insideBox(x, y, v.x, v.y, v.w, v.h) then
			if not v.active then
				playMenuSound()
				v.active = true
			end
		else
			v.active = false
		end
	end
end

local function playMenuSound()
	src2:rewind()
	src2:play()
end

local function drawButton(b)
	if b.active then
		love.graphics.draw( b.imgOn, b.x, b.y, 0, 1, 1, (b.w/2), (b.h/2) )
	else
		love.graphics.draw( b.imgOff, b.x, b.y, 0, 1, 1, (b.w/2), (b.h/2) )
	end
end
Some things to note:
  • The buttons could have an active variable which is true if the button is currently hovered over or false otherwise.
  • drawButton could take the entire button table as an argument, and use the active table entry to decide which image to use.
  • Rewinding sources before playing them makes the sound play again, rather than play again only if it's not already playing.
  • src1:setLooping(true) only needs to be set once, so it can be called in love.load.
User avatar
TheDeskPop
Prole
Posts: 10
Joined: Fri Dec 28, 2012 6:23 pm
Contact:

Re: Menu - Button Hover Sound Code

Post by TheDeskPop »

Some things to note:
  • The buttons could have an active variable which is true if the button is currently hovered over or false otherwise.
  • drawButton could take the entire button table as an argument, and use the active table entry to decide which image to use.
  • Rewinding sources before playing them makes the sound play again, rather than play again only if it's not already playing.
  • src1:setLooping(true) only needs to be set once, so it can be called in love.load.
Thanks I will give this a try and let you know.
User avatar
TheDeskPop
Prole
Posts: 10
Joined: Fri Dec 28, 2012 6:23 pm
Contact:

Re: Menu - Button Hover Sound Code

Post by TheDeskPop »

That worked Santos! The only line of code I had to add was in love.update(dt)

Suggested:

Code: Select all

function love.update(dt)
	local x = love.mouse.getX( )
    local y = love.mouse.getY( )

    for k, v in pairs(buttons) do
        if insideBox(x, y, v.x, v.y, v.w, v.h) then
			if not v.active then
				playMenuSound()
				v.active = true
			end
		else
			v.active = false
		end
	end
end


My change:

Code: Select all

function love.update(dt)
	local x = love.mouse.getX( )
    local y = love.mouse.getY( )

    for k, v in pairs(buttons) do
        if insideBox(x + (v.w/2), y + (v.h/2), v.x, v.y, v.w, v.h) then
			if not v.active then
				playMenuSound()
				v.active = true
			end
		else
			v.active = false
		end
	end
end
Thank you to all who helped! If I could find the +1 karma button I would send some your way but I do not see it anywhere. Was this done away with(off-topic)?
Post Reply

Who is online

Users browsing this forum: Ahrefs [Bot], Bing [Bot] and 4 guests