Mouse Hovering Over Printed Text

[Rehnrald]

Great, Rehn's back with more problems. I hate to ask for help on here, I really do.

Anyways.

I am working on a sweet Arcade game similar to Galaga, but with better graphics, better audio, a story mode, and other cool junk. I got a cool lookin' boot scene thing, and now I am making the menu. I have a background image and text printed over it in a special font. What I am trying to do is make an 'invisible box' around it, and when you hover over that the text (which is normally white) turns grey. Also, clicking within this 'invisible box' would trigger some function, which does work. The hovering however, does not, and I dunno where I messed up because it seems all good to me. I think it might be the fact that I basically have 40 And Statements in a row towards the bottom in 'function love.mousepressed', but that is just speculation. Any help is appreciated, thanks in advance.

[Ranguna259]

I haven't looked into the code as it's a little past bed time so I'm gonna go out on a limb here and tell you the rectangle collision code because maybe you got that wrong, code:

Code: Select all

-- x ,y being love.mouse.getX() and getY()
--button being the table that holds the x and y coordenates and the width and the height of the button
if x >= button.x and x <= button.x + button.width and y >= button.y and y <= button.y + button.height then
  --do some stuff
end

If this was not your problem then I'll look into your code tomorrow.

[bdjnk]

What I am trying to do is make an 'invisible box' around it, and when you hover over that the text (which is normally white) turns grey.

The abundance of 'and's just make the code a bit hard to read, but they are not necessarily wrong. The immediate problem is that you're never setting your graphics color to anything but white, so why should it draw anything as gray... Additionally, your are never reacting to hover as your only mouse event handler is 'mousepressed'.

What you need to do is something much simpler. Use the getPosition function in draw (or in update and set a variable like you do with mousepressed if that makes more sense to you) to determine which (if any) menu item you're hover over, using setColor before drawing / printing the element (make sure you set the color back to white afterwards).

[Rehnrald]

I haven't looked into the code as it's a little past bed time so I'm gonna go out on a limb here and tell you the rectangle collision code because maybe you got that wrong, ...

This wasn't my problem, all the coordinates and math were right. The problem was this:

... Additionally, your are never reacting to hover as your only mouse event handler is 'mousepressed'.

What you need to do is something much simpler. Use the getPosition function in draw (or in update and set a variable like you do with mousepressed if that makes more sense to you) to determine which (if any) menu item you're hover over, using setColor before drawing / printing the element (make sure you set the color back to white afterwards).

All my hover handling stuff was in "love.mousepressed" when it should have been in "love.update". I fixed everything up after noticing that, and now the hovering works. The only problem now is that once it turns grey, it remains grey, and taking the mouse away doesn't turn it back to white like I intended. I'd appreciate if you were to continue helping me a bit for this last hurdle, thanks.

[bdjnk]

Reseting your button state each update will fix the current trouble, like so

Code: Select all

	if gamestate == 'menu' then
		newgamebtn = ""
		loadgamebtn = ""
		optionsbtn = ""
		creditsbtn = ""
		exitbtn = ""
		...

This is still a bit of a mess though. The main remaining problems: ignoring the 0 1 ∞ rule, (likely) unexpected global variables, and a general lack of encapsulation (not necessarily an OOP idea, even though everyone talk about it like it is).

[Rehnrald]

Reseting your button state each update will fix the current trouble, like so

Code: Select all

	if gamestate == 'menu' then
		newgamebtn = ""
		loadgamebtn = ""
		optionsbtn = ""
		creditsbtn = ""
		exitbtn = ""
		...

Okay, I see now. I have to return the variables. I did it within my crazy "if mousex >= 40 and mousex <= 199 and mousey >= 512 ..." lines under an Else statement. Thanks for the help!

This is still a bit of a mess though. The main remaining problems: ignoring the 0 1 ∞ rule, (likely) unexpected global variables, and a general lack of encapsulation (not necessarily an OOP idea, even though everyone talk about it like it is).

As for this, I don't quite get what you mean by the Zero-One-Infinity Rule, so I guess you could say I am ignoring it. As for the Global variable thing, I'll have to check that out, because I don't recall the difference between Global and Local being something too crazy, I thought it was just about not being able to use Local variables in other .lua files you run from main.lua. And finally, I think by the Data Encapsulation you are talking about using tables and arrays and cool stuff. I am still messing around with those things in smaller projects, but I do have a "Player" table in Cosmos for storing the Player's stats and current ship and such. If you've got the time to explain the first two a bit, that'd be great.

Anyways, thanks a ton for your help. The fixes were pretty easy, and I'm surprised I didn't notice at least the second one.

[bdjnk]

I'll elaborate on zero-one-infinity, because it's widely applicable and very helpful. I'll focus on Cosmos, even though it's not yet large enough for serious concern.

The code managing your menu system is spread throughout the main.lua, which means changes must be kept in sync across disparate code blocks. If I wanted to add a menu item, or remove one, this would be relatively error prone and time consuming. Using encapsulation to collect relevant data and functionality would ameliorate the issue, but wouldn't truly eliminate it.

So let's think of it this way. How many menu items can I have? If it isn't zero or one, it should ideally be infinite. How do I handle those infinite items? What we want is to be able to add, remove, and edit menu items in a single sensible location, and everything else should work auto-magically.

Here's some code I wrote for a menu system of my own.

Code: Select all

require "play"
require "settings"

menu = {}

function menu.setup()
	sans46 = love.graphics.newFont("dejavu/DejaVuSans.ttf", 46)
	options = {
		{
			title = "Play",
			action = play,
		},
		{
			title = "Settings",
			action = settings,
		},
	}
	selected = 0
end

function menu.draw()
	local mx, my = love.mouse.getPosition()

	love.graphics.setFont(sans46)
	local fh = sans46:getHeight()

	for key, value in pairs(options) do
		love.graphics.setColor(colors.white)
		if mx > 10 and mx < sans46:getWidth(value.title) and my > key*fh and my < (key+1)*fh then
			selected = key else selected = 0
		end
		if selected == key then
			love.graphics.setColor(colors.yellow)
		end
		love.graphics.print(value.title, 10, key*fh)
	end
end

[Rehnrald]

Ah, I see what you mean. You have everything set up in one place and then you can easily run the function, in your case "menu.setup()", and create a new menu without hassle.

I think that is a great idea, thanks for explaining it. Since I plan to have a pause menu, options menu, etc., I'll work on making the menu I have right now work from a more concentrated area rather than spread out across the entire main.lua.

In any case, my menu is completed thanks to your help. I appreciate your assistance, bdjnk.

[MadByte]

You might want to check out an gamestate library or something to do things like that
Personally I wrote an simple SceneManager on my own. You can create normal scenes and overlay scenes (like an ingame menu) without a hassle. Also it has a new Scene:enter() and Scene:leave() callback. Currently they must be defined ( just to force myself to don't forget them ). But this can be changed.

Here is an example for that if you want to give it a try.

SceneManager Example.love

[Rehnrald]

You might want to check out an gamestate library or something to do things like that
Personally I wrote an simple SceneManager on my own. You can create normal scenes and overlay scenes (like an ingame menu) without a hassle. Also it has a new Scene:enter() and Scene:leave() callback. Currently they must be defined ( just to force myself to don't forget them ). But this can be changed.

That looks pretty cool, if I can figure out the scene entering and leaving I might use it for a quick pause menu!