The Great Fleece: Main Menu > Loading Screen > Game: AsyncOperation
In this article Im going to talk about how to set up a Main meu that transitions from Main Menu to a loading screen, then to the game.
For this you’ll need to understand how Asyncronous operations work in Unity. What we want to do is press start on the main menu, then have a loading bar update its progress percentage visually depending on the actual progress of the game loading. Sounds complex and it IS a little bit. Fear not.
All the assets for the Main menu exist in the assets folder for the game. I have mine set up simply like this:
I have the canvas which contains the MainMenu script shown below. Then within that I have the background and title images, a start and quit button, and the camera fade.
In the past I’ve shown how to set up camera fade ins. I want to animate the Title image to fade in and move closer to the camera when he scene loads. The way this is accomplish is by setting the anchors to “stretch”, set all the positions to 0. Start recording the animation. Go from 245 on the “left” to 0 in about 5 seconds. Set the fade alphas accordingly to fade in and out.
you can see the Left position and the colors have an animation attached.
Easy. So the script attached to the canvas has reference to the UnityEngine.SceneManagement. library. When clicking the start or quit buttons the associated function is called. Be sure to set the “cull transparent mesh” to true on the fade object so we can click past it.
Setting up the loading scene is a little different.
Set up the canvas in a new scene called Loading Screen.
Simple Canvas, Background image, progress bar, and overlay for the progress bar.
The image properties for the progress bar should be as follows:
the fill method and type matter here. The default set up makes the bar fill up in a circular motion. We start it from the Left in the Fill Origin property.
Here I’m starting a coroutine in start. The coroutine “LoadMainScene()” starts an AsyncOperation called operation. Here you will find tons of information about how this operates.
Unity — Scripting API: SceneManagement.SceneManager.LoadSceneAsync (unity3d.com)
basically, while the operation is not done, the progress bar.fillAmount = the operation’s progress. AsyncOperations load the Scene asynchronously in the background.
The scene should look like this when set up properly:
depending on your computer’s performance, this loading screen can show for a split second or for several. This set up takes into consideration systems that may have a hard time loading up the game scene. This provides something visual for the player so they can see that the game is loading, its just taking a minute.
Much of the game development process is taking all the players into consideration. Providing a visual like this can make all the difference in whether someone plays it through or not.
In the build settings, make sure your scenes are listed in order so that the loading screen goes from loading to the game scene and viola!
