My 90 day journey becoming a Unity game developer: Day-26

Objective: Create a main menu with a new game button when clicked on will start a new game. Also, add game credits of who made the game to the menu’s screen.

Final result of the Main Menu created and New Game button activated.

Create a new scene by going to File->New Scene. If prompted, save your current scene. Save new scene in Scenes folder and name it Main Menu.

Created new scene called Main Menu.

In Hierarchy, right-click and select UI->Image. The Canvas will be added automatically with the image. Name the image Title Screen img. Drag the main menu image to the Source Image.

Main menu image placed in Source Image under Image component.

Center the image onscreen and preserve aspect. Add the dimensions of the image to the width and height to have a full blown image onscreen. Down at the Canvas Scaler change the UI Scale Mode to Scale with Screen Size.

Main menu image scaled to screen size and centered.

Darken the environment of the Main Menu by clicking on the Main Camera, change color to black, and change Clear Flags from Skybox to Solid Color.

Making the background to a dark color and setting it to Solid Color.

Drag the space background overlay into the Hierarchy, then stretch it out to fill the entire screen.

Background overlay added

Add a button by right-clicking on Canvas, select UI and Button. Name it New Game Button, anchor it to the right side of the screen, drag it around on the right side of the screen to adjust , and change the button’s text to New Game. On the button go to the Button script component and change Highlighted Color to a light blue.

New Game button added.

To use the button’s onClick() function, we will communicate between the button and the Canvas. In the Scripts folder, create a new folder name Main Menu and create a script name MainMenu. On the Canvas, attach the MainMenu script. In the script, create a method call LoadGame() to start the game.

Go to File->Build Settings and delete the scene in Scenes to Build. Click on Add Open Scenes to make our Main Menu scene the first on the build list. Drag the Game Scene from the Scenes folder into the build list to make the Game second on the list.

Setting up the build settings for main menu first, game second in the list.

Back in the MainMenu script, add SceneManagement namespace at the top to use the Scene Manager. In the LoadGame() method, use the SceneManager to call the LoadScene() function and pass the index number 1 to it for the Game Scene to be loaded.

Select the New Game Button, go to the onClick() function, and click the plus (+) sign. Drag the Canvas to the Object section which represents the game object we want to communicate with. Click on the function section and look for the MainMenu component on the Canvas. Inside the MainMenu look for the method LoadGame() and select.

Using LoadGame method to start game when the New Game button is clicked.

In the GameManager script we need to adjust the LoadScene from zero to 1 when the user presses the ‘R’ key and the game is over.

LoadScene changed from the main menu scene to the game scene to load.

To add your name to the credits, right-click on the Canvas->UI->Text. Write your name and whatever else you want in your credits onscreen inside the Text field. Center the text, change color to white, adjust the text box to fit the text inside. If text too long to be seen onscreen, select Overflow for Horizontal Overflow, and Truncate for Vertical Overflow to see how it looks.

Adding creative credits to the Main Menu.

Main Menu finished design and New Game button starts a new game.

Next will be adding visual effects to the player and enemies being destroyed.