[SOLVED] GUI Menus

D

DancingPlant

Guest
Hello all,
After a bit of trying to figure out this logic on my own I have decided to seek help and see if I could talk it through with some people that understand GUIs more thoroughly than myself (which I'm sure most people do).

I am working on a construction management style game for windows and am trying to make some menus. The idea behind the menus is that when the menu button is clicked (left pressed), a sort of "pop-up" menu will be created at the center of the screen, along with an exit button attached to it. This exit button can then be clicked to exit this "pop-up" menu.

I know how to draw the original menu button with a Draw GUI event but I am unsure of how to proceed from their, I am also using a hover feature that does an image_blend = c_white when the button is hovered over (done in Heartbeasts tutorial, it has worked very well for me before and I would like to implement it here). What I am having an issue with is how to create the "pop-up" menu along with its exit button when the initial menu button is clicked.

I have had a few thoughts but am unsure of which to implement, if they will even work at all. I have thought of placing if statements in the same Draw GUI event for the initial menu, something along the lines of this (not actual code, just my thought process):
Code:
///Draw menu button
draw_sprite(shop button,0,x,y);
if (hover) {
     image_blend = c_white;
     if (left clicked) {
          draw_sprite("pop-up" menu,0,x,y);
          draw_sprite(exit button,0,x,y);
     }
}
But from there I'm not sure where to go, or if it is even correct, and how to go about implementing the hover over just the exit button for now (I am not going to be adding anything else to the "pop-up" menu until I can figure this section out) and exiting the "pop-up" menu, all while still having the current room visible behind the menus.

My second idea was to go a similar route from a tutorial by using a Global Left Pressed event to do all of the clicking:
Code:
///Check for hover
if (hover) {
      somehow draw "pop-up" menu and exit button
}
I thought about this at first but was unsure of how I could make a Draw GUI occur from within this, I looked at both event_perform and event_perform_object but was unsure if implementing them would work in this case.

I have quite a bit of work ahead of me but really want to get just this section figured out for now before I can really implement anything else. I am not looking for code to just be given to me, but I would really love to be able to bounce ideas back and forth with someone who has more knowledge on the subject to help me better understand what it is I need to fix.

Thank you in advance for any comments and help!
 
I would actually have an object obj_popup and give it the depth of your other GUI elements. Have the exit button as it's sprite. Then when you need the popup, you just create it. In the obj_popup create and begin_step event's you would have hover=false; and in the mouse-> no button event have hover = true; In the draw event or draw gui event draw the menu sprite, then check for hover,set the blend mode and then draw itself.

You can expand this idea into a full menu. Instead of the obj_popup having the exit sprite, have it have the menu background sprite. Then in the create event create all the button objects that the player can use. In this way you can code the buttons on click events to do as needed. If will be easier to destroy everything if you assign the button object id's into a ds_list or an array when you create them. If you then destroy button objects in the array or list in the destroy event of the obj_popup, then all you have to do in the grander scheme of things is destroy the obj_popup, the popup will destroy the rest.

Example of obj_menu

create event
Code:
butonList=ds_list_create(); // list of buttons
ds_list_add(instance_create(someX,someY,obj_buttonTank1)); // add some buttons to the list
ds_list_add(instance_create(someOtherX,someOtherY,obj_buttonTank2));
ds_list_add(instance_create(anotherX,anotherY,obj_buttonTank3));
ds_list_add(instance_create(yetAnotherX,yetAnotherY,obj_exit));
destroy event
Code:
var inst; // this will hold the next id in the list
while(ds_list_size(buttonList)>0){    // while the list has id's
  inst=ds_list_find_value(buttonList,0); // find the first one in the list
  if(instance_exists(inst))  // if that value is actually an instance
     with(inst){instance_destroy();} // destroy that instance
  ds_list_delete(buttonList,0); // delete that value from the list
}
ds_list_destroy(buttonList); // don't forget to destroy the list :P
so to create the menu
Code:
instance_create(somwhereX,somewhereY,obj_menu);
and to get rid of the menu, in the exit button mouse left button pressed event have
Code:
with(obj_menu){instance_destroy();}

You can go even one further and have a text variable in teh menu. Then when you create the menu you can assign it the text you want the player to read
the menu object create event would add to it
Code:
text="";
then alter the draw event of the menu
Code:
draw_sprite(sprMenu,0,someX,someY);
draw_text(relativeToMeX,relativeToMeY,text);
Just make sure that the button objects have a slightly lower depth than the menu

then when you create the menu
Code:
var m;
m=instance_create(someX,someY,obj_menu);
m.text="Which Tank would you like to purchase?";
or
Code:
m.text="Which Tank would you like to do something else with?";
 
Last edited:
D

DancingPlant

Guest
I would actually have an object obj_popup and give it the depth of your other GUI elements. Have the exit button as it's sprite. Then when you need the popup, you just create it. In the obj_popup create and begin_step event's you would have hover=false; and in the mouse-> no button event have hover = true; In the draw event or draw gui event draw the menu sprite, then check for hover,set the blend mode and then draw itself.

You can expand this idea into a full menu. Instead of the obj_popup having the exit sprite, have it have the menu background sprite. Then in the create event create all the button objects that the player can use. In this way you can code the buttons on click events to do as needed. If will be easier to destroy everything if you assign the button object id's into a ds_list or an array when you create them. If you then destroy button objects in the array or list in the destroy event of the obj_popup, then all you have to do in the grander scheme of things is destroy the obj_popup, the popup will destroy the rest.

Example of obj_menu

create event
Code:
butonList=ds_list_create(); // list of buttons
ds_list_add(instance_create(someX,someY,obj_buttonTank1)); // add some buttons to the list
ds_list_add(instance_create(someOtherX,someOtherY,obj_buttonTank2));
ds_list_add(instance_create(anotherX,anotherY,obj_buttonTank3));
ds_list_add(instance_create(yetAnotherX,yetAnotherY,obj_exit));
destroy event
Code:
var inst; // this will hold the next id in the list
while(ds_list_size(buttonList)>0){    // while the list has id's
  inst=ds_list_find_value(buttonList,0); // find the first one in the list
  if(instance_exists(inst))  // if that value is actually an instance
     with(inst){instance_destroy();} // destroy that instance
  ds_list_delete(buttonList,0); // delete that value from the list
}
ds_list_destroy(buttonList); // don't forget to destroy the list :P
so to create the menu
Code:
instance_create(somwhereX,somewhereY,obj_menu);
and to get rid of the menu, in the exit button mouse left button pressed event have
Code:
with(obj_menu){instance_destroy();}

You can go even one further and have a text variable in teh menu. Then when you create the menu you can assign it the text you want the player to read
the menu object create event would add to it
Code:
text="";
then alter the draw event of the menu
Code:
draw_sprite(sprMenu,0,someX,someY);
draw_text(relativeToMeX,relativeToMeY,text);
Just make sure that the button objects have a slightly lower depth than the menu

then when you create the menu
Code:
var m;
m=instance_create(someX,someY,obj_menu);
m.text="Which Tank would you like to purchase?";
or
Code:
m.text="Which Tank would you like to do something else with?";
I would actually have an object obj_popup and give it the depth of your other GUI elements. Have the exit button as it's sprite. Then when you need the popup, you just create it. In the obj_popup create and begin_step event's you would have hover=false; and in the mouse-> no button event have hover = true; In the draw event or draw gui event draw the menu sprite, then check for hover,set the blend mode and then draw itself.

You can expand this idea into a full menu. Instead of the obj_popup having the exit sprite, have it have the menu background sprite. Then in the create event create all the button objects that the player can use. In this way you can code the buttons on click events to do as needed. If will be easier to destroy everything if you assign the button object id's into a ds_list or an array when you create them. If you then destroy button objects in the array or list in the destroy event of the obj_popup, then all you have to do in the grander scheme of things is destroy the obj_popup, the popup will destroy the rest.

Example of obj_menu

create event
Code:
butonList=ds_list_create(); // list of buttons
ds_list_add(instance_create(someX,someY,obj_buttonTank1)); // add some buttons to the list
ds_list_add(instance_create(someOtherX,someOtherY,obj_buttonTank2));
ds_list_add(instance_create(anotherX,anotherY,obj_buttonTank3));
ds_list_add(instance_create(yetAnotherX,yetAnotherY,obj_exit));
destroy event
Code:
var inst; // this will hold the next id in the list
while(ds_list_size(buttonList)>0){    // while the list has id's
  inst=ds_list_find_value(buttonList,0); // find the first one in the list
  if(instance_exists(inst))  // if that value is actually an instance
     with(inst){instance_destroy();} // destroy that instance
  ds_list_delete(buttonList,0); // delete that value from the list
}
ds_list_destroy(buttonList); // don't forget to destroy the list :P
so to create the menu
Code:
instance_create(somwhereX,somewhereY,obj_menu);
and to get rid of the menu, in the exit button mouse left button pressed event have
Code:
with(obj_menu){instance_destroy();}

You can go even one further and have a text variable in teh menu. Then when you create the menu you can assign it the text you want the player to read
the menu object create event would add to it
Code:
text="";
then alter the draw event of the menu
Code:
draw_sprite(sprMenu,0,someX,someY);
draw_text(relativeToMeX,relativeToMeY,text);
Just make sure that the button objects have a slightly lower depth than the menu

then when you create the menu
Code:
var m;
m=instance_create(someX,someY,obj_menu);
m.text="Which Tank would you like to purchase?";
or
Code:
m.text="Which Tank would you like to do something else with?";
This is incredible! Thank you so much! I thought about something along the lines of this after I posted it but didn't think about doing lists at all, this will be incredibly helpful, thank you so much!
 
Top