How to Make a Menu System (with Submenus) in GameMaker Studio 2!

Title screens, pause menus, shop systems, whatever! This system can very easily be added to any game (including the "How to Make an RPG" series game), and is good prep for my next video on Textboxes and Branching Dialogue!

If you want to support me, subscribe and follow this stuff!

If you have any questions, leave a comment or send me a dm on twitter/Discord!

[peytonburnham]

Go there if you want to help me out a little more so I can make more videos like this (full turn-based RPGs, platformers, zelda-likes, beat 'em ups, etc)!

There's a bunch of cool perks like getting videos before Youtube does, voting on future series, and getting the project files and assets from future videos! Thanks!

[SecretEccentric]

one of the things I love about your videos is that the comments garner such a wide range of experience from folks, every comment I see is either thanking you for the tutorials, talking about the things they made from the tutorials, or someone asking for help with something that wasn't exactly made apparent in the video and getting helpful replies from multiple people. I love it here :)

[electrosaber]

This is one of the best tutorials I have seen, please continue this. Doing a great job.

[downthispath]

Oh wow you explained everything so easily and clearly that even as a non dev like me can understand. I'm trying to understand this cause I plan to give my sister a gift for her bday next year using your dialogue tutorial. I made her a simple platformer this year following random tutorials here on youtube and she absolutely loved it. So I'll try my hand at something more ambitious next year.

Thanks a lot for these! I really appreciate it.

[SGTIvan]

Timestamps for reference:
3:50 Declaration of variables in obj_side_menu
4:23 Array of options
5:21 Draw the menu
7:20 Brief demo
7:40 Draw the options, set up font (skip to10:07 if I already have a font)
9:27 Clean up event: font_delete the custom font.
10:07 Draw font
11:00 Use of for loop: draw the options if i < length of the option array
11:46 Add padding to the text
12:33 op_space * i will ensure that the options are not drawn on top of each other, they are drawn like a normal menu
13:04 Demo
13:20 pos variable in Create event - we're gonna start being able to select the options
14:25 up and down key
14:42 We want to prevent the pos from going above 2 or below 0.
15:44 Changing text colour to show which one selected
16:25 if pos == i, _c = c_yellow
17:12 Step event: add a switch statement (for the purpose of entering the option)
19:31 Demo
19:45 Submenu making
20:01 Make the option array 2-dimensional, add a variable menu_level (note to self: I could use regions as a way to open and close to see what are the options under the, say, settings menu. Here, he does it by separating the menus.)
21:09 Create event: set op_length to 0, since we will set the option lengths dynamically in the step event.
22:04 Change that bit of code to draw from a 2d array instead of the previous 1d array (option[menu_level, i])
22:20 Changing up the organisation of the switch statement, and there will be another switch which checks for menu_level.
24:20 Set menu_level back to 0 if pressing back in settings menu, and set menu_level to 1 if pressing settings menu
25:00 Fixing the bug (the for loop) [Done by setting a local var _sml, whereby, in the switch statement of the menu_level, if it does not equal to menu_level, then set the pos = 0. This is to prevent the unexpected bug of the for loop looking for an option 3 in the main menu when there isn't one.]
26:45 Demo
27:24 Dynamically get width and height of menu
27:59 An important note related to string_height
29:34 The local variable _new_w: setting new menu width based on which option the longest
30:31 Centralise the menu

[martinsnape]

Having almost bit the edge of my desk in frustration at not getting a menu system working properly, I found this. Such a clear and easy tutorial.

[RandomGameBenchmark]

to play a sound when you change the menu lines

create a line called
last_selected = 0; in create event and go to step event

now in step event, put this code there

if (pos != last_selected) audio_play_sound(YOUR SOUND NAME, 1, false);
last_selected = pos;

thats all

[myers]

Around 27:57 If you're using a Font that isn't set as by sprite. You could use the below code, with "fnt_menu..." being the custom font. Take this with a grain of salt, it worked for me, but I do not know much about coding.

height = op_border * 2 + + (op_length - 1) * op_space;

[Onlyfaff]

if you want to use the WASD keys for the menu, put an OR state in the middle for example:
up_key = keyboard_check_pressed(vk_up) ||

[CGJournalist]

If anyone else is trying to use this on a 1920 x 1080 room, the easiest thing to do is to scale his values by 10. For example, where he put "width = 64" in the create page, I put "width = 640". Change this, the height (860), op_border(80), op_space(160) and also the last number of obj_settings --> Create --> line "global.font_main"... from 1 to 5. Then the rest of the math will all make sense. I also changed my font sprite to 70x90 and my textbox sprite to 200x200. Double check all these listed values for a 1920x1080 room and it will all work as demonstrated in the video!

[cleverdragon]

I honestly find these more straightforward and clear than the official gamemaker tutorials. Thanks!

[schlatta-dirtydeeds]

When I say this is an upgrade to my previous menu system it is NOT an understatement, thank you! Looking forward to checking out more of your stuff!

[ksenyajustkidding]

i’ve bingewatched all your programming videos and made something… this guide is sooo coool! man i never thought it could be so interesting!!! pleeasaeee continue these tutorials it’s super cool!!!! also im quite surprised that your channel is so small so keep it up

[BritBox]

Anyone having pixel issue with their 9 slice by the end- I recommend putting the code for centering the x and y in a " x = round( [code] ) " to round it. That solved the issue for me.

[explodedkidboi]

I started using GameMaker recently. These tutorials really helped me understand how GameMaker works. Although, i used GameMaker Visual to code, i was able to make sure I was matching the code by useing the Live Preview function, which shows your code if typed out, but doesnt permanently convert it. Thanks for this 😊

[Cyranek]

well spoken perfectly paced informative tutorial

[carlospintor-fernandez]

Gotta say very well explained for beginners such as myself.

[disusdev]

Quick tip: Way to go through menu options without branches: just after `pos += down_key - up_key;` you can add `pos = (pos + op_length) % op_length;` instead of "if" statements

[shaneduquette]

If you're building this menu into the RPG game from the previous tutorials, and if you want to access the menu from your game, I added this to the beginning of the step event for the player object (obj_player):

if {
room_goto(rm_title_screen);

}

It makes it so that pressing the escape key (vk_escape) loads the menu (rm_title_screen). It also deactivates the player so they don't show up on top of the menu.

[Mvolkovin]

Holy crap man. Excited for Starcross to come out, it looks like an absolute blast. Thank you for doing these tutorials for us in the meantime. You've earned a loyal fan.