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

138,656
0
Published 2021-04-29
Support me and these videos on Patreon! www.patreon.com/peytonburnham

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!
My tweets: twitter.com/peydinburnham
My Game: peytonburnham.itch.io/rose-of-starcross-demo
Discord: discord.gg/tFd6RVF
My twitch: www.twitch.tv/peydinburnham


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

All Comments (21)
  • Check out my Patreon! www.patreon.com/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!
  • @SGTIvan921
    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
  • 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
  • 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.
  • This is one of the best tutorials I have seen, please continue this. Doing a great job.
  • @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) || keyboard_check_pressed(ord("W"));
  • @BritBox777
    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.
  • @martinsnape8104
    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.
  • 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 !!!!!!
  • @myers4924
    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 + font_get_size(fnt_menu_dungeonfont) + (op_length - 1) * op_space;
  • @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 :)
  • @Nightfallz23
    Amazing Tutorial - I actually supported your Kickstarter and somehow never realized you did tutorials like this. Keep up the incredible work on your tutorials, this was very clear and helpful to expand upon.
  • 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!
  • @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!
  • I honestly find these more straightforward and clear than the official gamemaker tutorials. Thanks!
  • @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.
  • @ashliiiiii
    Thank you!! This is the best menu tutorial that I've found online, and helped me develop my menu system. I'm just getting into GameMaker2 so this tutorial was very helpful for me. Infinitely grateful!
  • @Cyranek
    well spoken perfectly paced informative tutorial
  • @explodedkidboi3004
    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 😊
  • @kkeough5759
    You, sir, are the real MVP. This series has been a tremendous kick-start.