Loading Scenes Using UI In Unity 2020 x.x +

Unity 2020 and beyond uses its new scene management system. Just like the UI, The scene management functions are accessed by including its scene management namespace; using UnityEngine.SceneManagement;

Ill demonstrate navigating between scenes via UI and even creating custom UI for any project.

Demonstration

I have a Gradius-Like game in the works. The core gameplay mechanics and loop is nearly together. The only thing that is lacking is a title screen, player menus for win/lose, and Options.

I will need 4 UI Canvas and 2 Separate Scenes. 4 UI Canvases are needed because putting everything in different canvases is helps with performance. One update in a UI canvas will update every single UI component in that canvas. Even if its just one UI Element.

deeper explanation here:

https://www.youtube.com/watch?v=_wxitgdx-UI

Creating The Title Screen

Create A new scene and insure that it was at Camera. Set the Cameras background to whatever is desirable. I dressed up my scene like this:

Right click in the hierarchy panel and navigate to canvas in the drop down.

Once Created, Rename it to Title Menu. The We begin populating

Start Button

I often use Text Objects to create buttons. The unity's default button image is a bit too bland for me and making my own image for a button is too much work at the moment. With Text, I can change the wording of the button anytime and have the same functionality.

To Begin, select the title menu canvas in the hierarchy and right click it to bring down the drop down. Navigate to the same place we found canvas in and button; rename it Start.

We should now have a button in a canvas named Title Menu.

Change the text to ,’Start in the inspector. Change the font size and color to make it more visible against the background.

Something that is easily seen.

Now ill do the rest for Options and Quit Game

Button Component

The UI Text I Have Placed down can become buttons by adding a button component.

To add a button component onto the UI Texts.

Select the Start UI Text that was created and locate the add component button in the inspector.

Click it and type in Button; A related search for the button component should appear.

Now Start Text has the same functionality a regular button. Now Ill do this for the other Text objects.

I can now hover over the Texts and interact with them like buttons.

Scripting Scene Management For Button Clicks

Ill be creating one script and name it SceneManagement which will only contain public functions that our newly buttons can access.

Start by including the name space.

then creating two functions. One to load a scene and the other to quit the game.

Next, Ill be linking them up to my buttons.

OnClick() Events in button component

Onclick() is a function that executes when the button has been clicked. they can be passed functions to them so that when Onclick executes, so does the function that is passed.

Onclick() can be modified within the inspector here:

by click the +, I can add a game object to the empty slot to the bottom left and access its function.

So that being said, I create a new game object, attach the newly created scene manager script to it, and drop it in.

Once that's in, I click the no function drop down menu and navigate

Now, Whenever the Start Button is clicked. Scene 0 will load. This itself may or may not load a scene because I haven't modified anything in the build settings. Scene 0 my not belong to anything. Lets check.

Building Settings

To check, ill go to the top left, click file, and then build settings.

the build window should now be displayed

As I predicted, there's nothing in the ,’Scenes In Build’ section. So that means no scenes will load whatsoever.

To add a scenes, simply click the ,’Add Open Scene’ as seen on the bottom left. This will add the scene that is currently open within the project.

To add other scenes, drag and drop the scene into the section

Now scene 0 is our scene with the UI I created and scene 1 is the game scene that I want to load.

I go back to the start button ui and change the loadscene() parameter within the onclick() function to load the game scene.

Ill Do the same for the quit button, but link the quit function.

Note: The application.quit() will only work built games that are running from the client, not the inspector.

Result