I'm Coding a Game - Part 9

This week I created a menu system for my game. To get things started I created the “New,” “Continue,” and “Quit” categories in my menu. It required quite a bit of coding variables, as well as features I wasn’t very familiar with, to achieve just a basic menu.
 
Let’s dive into the creation process!
 
 
Creating a New Room:
 
Before I could write any code for the menu, I first had to make a new room for the menu. Try to think of rooms as scenes from a movie. Under the rooms tab, I created a new room and named it, rMenu.
 
 
 
 
Next, I imported the backgrounds I had already created for the game and pasted them on the menu screen. What’s nice about GameMaker Studio 2 is that it allows you to have backgrounds scroll at a certain speed which is perfect for a menu screen.
 
 
 
In the picture above I set B2 (BackgroundLayer 2) to a horizontal speed of 1. Once I did this to all the layers and set them at different speeds, I have a room that looks like this:
 
 
 
 
After the room was setup it was time to get on with the code. I created a new object and named it oMenu. Next I created a Create Event in that object and wrote some code….
 
 
 
The Coding
 
 
 
 
 
The first group of variables were created to grab the screen’s width and height. Functions display_get_gui_width, and display_get_gui_height operate better than setting a specific resolution. These functions allow the programmer the ability to change the resolution of the game and still have the menu be in the same relative spot.
 
*Quick Mental Break*
Is your mind blown yet? I know mine was as I was learning all about this ‘gibberish’-looking code…Let’s take a few seconds to breathe and pause before we continue.
 
Moving right along!
 
The next group of variables set properties of the menu. Variables menu_xmenu_y, and menu_x_target are used for the position of the menu. The variable menu_font uses a new resource, the font resource. GameMaker Studio 2 has a font feature that you can assign the programmer’s system fonts:
 
 
“I’ve always found the HoloLens MDL2 Assets font to be one of the more erotic fonts. Wouldn’t you agree?” NickelNDime’s lamenting on fonts.
 
I named the font, fMenu and then assigned it to the variable, menu_font.
 
The last section to complete was to set the actual options for the menu. I used an array for this task. Arrays are good for using several variables within a variable. They are good for menus, health boxes, mana boxes…etc. This is were I coded:
 
menu[2] = “New Game”
menu[1] = “Continue”
menu[0] = “Quit”
 
 
After all the variables were created, I created a Draw GUI event in the oMenu object:
 
 
 
The first three lines of code select what font and the alignment of the text. The next set of code used a for loop. A for loop runs a series of actions, until a condition is no longer true. The for loops are useful if one variable is being altered every time the program goes through the for loop. The first line of codes states:
 
for (var i = 0; i < menu_items; i++)
 
this states:
 
Set ‘i’ to 0
Continue the loop as long as i is less than menu_items
Add one to ‘i’ every single loop.
 
 
The ‘if’ statement within the for loop states that if ‘i’ is equal to menu_cursor, place a ‘>’ by the selected text and make that text white. If not, make the deselected text, grey.
 
With all these lines of code the menu was now created, however it didn’t do anything yet. For that, I had to assign properties to that menu by creating a Step Event on the object.
 
 
 
This code takes in keyboard commands, and lets the user actually use the menu. If the up arrow is pressed the first routine happens. if the down arrow is pressed the second routine happens. Last is if the enter button is pressed it then hops down to the last bit of code.
 
The game now has a functioning menu when a player starts the game:
 
 
 
…aaaaaaaaaaaaand I’m done!