Love2D Game Menu

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
AlchemistArea
Prole
Posts: 4
Joined: Sun Aug 14, 2016 5:41 pm

Love2D Game Menu

Post by AlchemistArea » Sun Aug 14, 2016 6:35 pm

I am not a very experienced programmer at all, I just started learning LOVE2D yesterday. I used tutorials from Sockmunkee Dev, if you know who he is. However, the menu for the game he wanted to make didn't have any sub-menus, and the main menu for the game I want to make, however, has a couple of sub-menus; Options and About. However, when I try to spawn and draw buttons for either of those sub-menus, the buttons for the more general menus stay on the screen. Is there any way to fix this?

Thank you,
Maxwell

User avatar
MadByte
Party member
Posts: 497
Joined: Fri May 03, 2013 6:42 pm
Location: Germany

Re: Love2D Game Menu

Post by MadByte » Sun Aug 14, 2016 7:04 pm

Welcome to the forum!

I'm not familiar with the tutorial of sockmunkee dev. It sounds like you could use gamestates to do what you're aiming for (One for the mainMenu, one for optionsMenu, and so on). Either you choose an existing library for gamestates or you write some lines on your own.

Here is a small example program showing a way to setup gamestates using a lib.

AlchemistArea
Prole
Posts: 4
Joined: Sun Aug 14, 2016 5:41 pm

Re: Love2D Game Menu

Post by AlchemistArea » Sun Aug 14, 2016 7:48 pm

MadByte wrote:Welcome to the forum!

I'm not familiar with the tutorial of sockmunkee dev. It sounds like you could use gamestates to do what you're aiming for (One for the mainMenu, one for optionsMenu, and so on). Either you choose an existing library for gamestates or you write some lines on your own.

Here is a small example program showing a way to setup gamestates using a lib.
I actually tried using gamestates, but I couldn't find an option to stop the first buttons from appearing, so they stayed under the buttons in the sub-menu. What I am doing, and what I was taught by Sockmunkee Dev's tutorials, is that I made a seperate .lua file from main.lua, and I made a function in that file: "button_spawn(x,y,text,id,mouseover)." X and Y, of course, mean the X and Y of the button being spawned onto the screen, text being the text of the button, id being the name of the button in the program itself, and mouseover meaning whether or not the mouse is over that button. After a while, I got it working to where you could click on the buttons and they could perform certain actions, such as clearing the screen or, namely, creating new buttons in a sub-menu. However, when I click on a button in the main menu, the button(s) in that sub-menu are just slapped in front of the buttons in the main menu, and the buttons in the main menu do not go away. This is the main problem.

User avatar
Plu
Inner party member
Posts: 722
Joined: Fri Mar 15, 2013 9:36 pm

Re: Love2D Game Menu

Post by Plu » Mon Aug 15, 2016 5:39 am

Can you post your current code? It might help in figuring out what's going wrong.

User avatar
4aiman
Party member
Posts: 248
Joined: Sat Jan 16, 2016 10:30 am

Re: Love2D Game Menu

Post by 4aiman » Mon Aug 15, 2016 6:06 am

Try to do this:
1. Create a table:

Code: Select all

menus={{"line1","line2","line3","line4",},
 {"line1","line2","line3","line4",},
 {"line1","line2","line3","line4",},
 {"line1","line2","line3","line4",},
 ...}
Every other sub-table should contain a list of the text of menu items. Every other menu and submenu you have, should go in here. You can make it more complicated, but that's up to you.

2. Create a variable

Code: Select all

current_menu = 1
It will tell you which menu you're in.

3. Create a variable

Code: Select all

current_item = 1
It will tell you which menu *item* you've selected.

4. Now make your draw function look like this:

Code: Select all

for i=1, #menus[current_menu] do
    love.graphics.print(menus[current_menu][i], X, Y+ 20*i)
 end
This way you'll be drawing only current (sub)menu.

5. Apply controls.

Code: Select all

if love.keyreleased["up"] then
    current_item = current_item - 1
    if current_item<1 then
       current_item = #menus[current_item]
    end
end
if love.keyreleased["down"] then
    current_item = current_item + 1
    if current_item>#menus[current_item] then
       current_item = 1
    end
end
The actual way to determine current item (if needed) and/or setting it to some value may be changed. I haven't seen your code to tell for sure;)

6. The last, but the most complex (not really) would be to create a handler for those menus. Make an update function that does something like this:

Code: Select all

if current_menu==1 then
   if current_item==1 then
      -- handle item #1 from menu #1
   elseif current_item==2 then
      -- handle item #2 from menu #1
   elseif current_item==3 then
      ...
   elseif current_item==4 then
      ...
   end
elseif current_menu==2 then
   if current_item==1 then
      -- handle item #1 from menu #2
   elseif current_item==2 then
      -- handle item #2 from menu #2
   elseif current_item==3 then
      ...
   elseif current_item==4 then
      ...
   end
elseif current_menu==3 then
   ...
elseif current_menu==4 then
   ...
end
Note, that you can draw only inside of love.draw().
Note, that it's a good idea to move all your key-press detection inside love.update.
In order to make it more convenient, create your own functions menu.draw and menu.update, put everything needed into those, and call menu.draw in love.draw and menu.update in love.update.

Cheers!

P.S. You may want to see how I did something like this in MagicGems (see my signature). #NotSomeNastyAdvertisement

AlchemistArea
Prole
Posts: 4
Joined: Sun Aug 14, 2016 5:41 pm

Re: Love2D Game Menu

Post by AlchemistArea » Tue Aug 16, 2016 12:12 am

4aiman wrote:Try to do this:
1. Create a table:

Code: Select all

menus={{"line1","line2","line3","line4",},
 {"line1","line2","line3","line4",},
 {"line1","line2","line3","line4",},
 {"line1","line2","line3","line4",},
 ...}
Every other sub-table should contain a list of the text of menu items. Every other menu and submenu you have, should go in here. You can make it more complicated, but that's up to you.

2. Create a variable

Code: Select all

current_menu = 1
It will tell you which menu you're in.

3. Create a variable

Code: Select all

current_item = 1
It will tell you which menu *item* you've selected.

4. Now make your draw function look like this:

Code: Select all

for i=1, #menus[current_menu] do
    love.graphics.print(menus[current_menu][i], X, Y+ 20*i)
 end
This way you'll be drawing only current (sub)menu.

5. Apply controls.

Code: Select all

if love.keyreleased["up"] then
    current_item = current_item - 1
    if current_item<1 then
       current_item = #menus[current_item]
    end
end
if love.keyreleased["down"] then
    current_item = current_item + 1
    if current_item>#menus[current_item] then
       current_item = 1
    end
end
The actual way to determine current item (if needed) and/or setting it to some value may be changed. I haven't seen your code to tell for sure;)

6. The last, but the most complex (not really) would be to create a handler for those menus. Make an update function that does something like this:

Code: Select all

if current_menu==1 then
   if current_item==1 then
      -- handle item #1 from menu #1
   elseif current_item==2 then
      -- handle item #2 from menu #1
   elseif current_item==3 then
      ...
   elseif current_item==4 then
      ...
   end
elseif current_menu==2 then
   if current_item==1 then
      -- handle item #1 from menu #2
   elseif current_item==2 then
      -- handle item #2 from menu #2
   elseif current_item==3 then
      ...
   elseif current_item==4 then
      ...
   end
elseif current_menu==3 then
   ...
elseif current_menu==4 then
   ...
end
Note, that you can draw only inside of love.draw().
Note, that it's a good idea to move all your key-press detection inside love.update.
In order to make it more convenient, create your own functions menu.draw and menu.update, put everything needed into those, and call menu.draw in love.draw and menu.update in love.update.

Cheers!

P.S. You may want to see how I did something like this in MagicGems (see my signature). #NotSomeNastyAdvertisement
Thank you very much! You helped a lot. :)

Post Reply

Who is online

Users browsing this forum: No registered users and 36 guests