Creating A Loading Scene in Unity

This article will show how to create a loading screen in Unity that updates the loading bar as the next scene is loaded.

To create the Loading Bar, we will use an image and change the Image Type to Filled. Next, change the Fill Method to Horizontal and the Fill Origin to Left. As the Fill Amount is altered, the Image fills the area from left to right on a 0 to 1 range. This Fill Amount is what will be changed as the next scene is loaded.

The LoadLevel script needs to use the UnityEngine Scenemanagement and UI namespaces to load the next scene and adjust the Loading Bar’s Fill Amount. For variables, the script only needs a reference to the Loading Bar Image. To update the Loading Bar each frame, a Coroutine is required. The first thing the Coroutine does is create an ASyncOperation to load the next scene in the background till it is finished and then activates the scene. After that, the while loop runs till the scene is loaded, updates the Fill Amount of the Loading Bar to the progress level of the AsyncOperation, then waits for the current frame to end.

We do not use the base value of the operation’s progress because the Loading Bar would never get to full since Unity unloads the current scene and activates the next during 0.9 and 1 of the load process. So to show the Bar at full, we need to divide the progress by 0.9 so when it is at 0.9, it sets the Fill to 1, and then we clamp the value between 0 and 1 to prevent any problems with it being higher than 1.

Now to attach the script and hook up the Loading Bar Image.

Going from the Main Menu to the Loading Screen to the Game. (Game loads very fast.)